状态码非200 响应

有时需要使用 200 以外的 HTTP 状态代码进行响应。 在这种情况下，响应处理程序 是 确定应返回什么状态代码的地方。

假定目录结构：

src/
└── routes/
    └── product/
        └── [skuId]/
            └── index.tsx     # https://example.com/product/1234

404 - Not Found

假设用户向无效的 skuId 发出请求，例如 https://example.com/product/999 。 在这种情况下，我们想返回一个 404 HTTP 状态码并渲染一个 404 页面。 我们通过查看数据库来确定请求是否有效的地方是在 请求处理程序（request handler）中。 即使响应不是 200，组件仍然有机会渲染页面（重定向情况除外。）

// File: src/routes/product/[skuId]/index.tsx
import { component$ } from '@builder.io/qwik';

type EndpointData = ProductData | null;

interface ProductData {
  skuId: string;
  price: number;
  description: string;
}
export const onGet: RequestHandler<EndpointData> = async ({ params, response }) => {
  const product = await loadProductFromDatabase(params.skuId);

  if (!product) {
    // Product data not found
    // but the data is still given to the renderer to decide what to do
    response.status = 404;
    return null;
  } else {
    // ...
  }
};

export default component$(() => {
  const resource = useEndpoint<typeof onGet>(); //equivalent to useEndpoint<EndpointData>

  if (resource.state == 'resolved' && !resource.resolved) {
    // Early return for 404
    return <div>404: Product not found!!!</div>;
  }

  // Normal rendering
  return (
    <Resource
      value={resource}
      onPending={() => <div>Loading...</div>}
      onError={() => <div>Error</div>}
      onResolved={() => (
        <>
          <h1>Product: {product.productId}</h1>
          <p>Price: {product.price}</p>
          <p>{product.description}</p>
        </>
      )}
    />
  );
});