From 2b1b3322f850a3df6bdf23e86653434bfa7b8f6f Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sat, 2 Sep 2023 21:25:11 +0900 Subject: [PATCH 01/13] 60f35d65a6ef99bb13fafbbc312c332213ab5a70 --- .../docs/ja/core-concepts/endpoints.mdx | 63 +------------------ 1 file changed, 1 insertion(+), 62 deletions(-) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index 64fc777c64c2b..bf61e13c69047 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -219,65 +219,4 @@ export async function get({ params, redirect }) { } ``` -### 例：CAPTCHA（キャプチャ）の検証 - -サーバーエンドポイントをREST APIのエンドポイントとして使用することで、機密データをクライアントに公開することなく、認証、データベースアクセス、検証などの機能を実行できます。 - -以下の例では、Google reCAPTCHA v3を検証するためにAPIルートを使用していますが、これはクライアントにシークレットを公開しません。 - -サーバー上では、recaptchaのデータを受け入れるpostメソッドを定義し、reCAPTCHAのAPIを使って検証を行います。ここで、secret値を安全に定義したり、環境変数を読み込んだりできます。 - -```js title="src/pages/recaptcha.js" -export async function post({ request }) { - const data = await request.json(); - - const recaptchaURL = 'https://www.google.com/recaptcha/api/siteverify'; - const requestBody = { - secret: "YOUR_SITE_SECRET_KEY", // 環境変数にできます - response: data.recaptcha // クライアントから渡されたトークン - }; - - const response = await fetch(recaptchaURL, { - method: "POST", - body: JSON.stringify(requestBody) - }); - - const responseData = await response.json(); - - return new Response(JSON.stringify(responseData), { status: 200 }); -} -``` - -そして、クライアントスクリプトから`fetch`を使ってエンドポイントにアクセスします。 - -```astro title="src/pages/index.astro" - - - - - - - - - - - -``` +**関連レシピ:** [CAPTCHAを検証するためにサーバーエンドポイントを使う](/ja/recipes/captcha/) From be55c28966522a803ca5a9d5180dcdf26edc754c Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sat, 2 Sep 2023 21:26:07 +0900 Subject: [PATCH 02/13] 8077640390594eab66c6497d5e9146c2e5bef371 --- src/content/docs/ja/core-concepts/endpoints.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index bf61e13c69047..913ff327e7670 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -31,7 +31,7 @@ export async function get({params, request}) { ```ts title="src/pages/astro-logo.png.ts" {6} export async function get({ params, request }) { - const response = await fetch("https://astro.build/assets/press/full-logo-light.png"); + const response = await fetch("https://docs.astro.build/assets/full-logo-light.png"); const buffer = Buffer.from(await response.arrayBuffer()); return { body: buffer, From c755f67af5a52ec4413a41f0da4f80bd3ca4ed26 Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sat, 2 Sep 2023 21:30:09 +0900 Subject: [PATCH 03/13] 829b66397ad31b2e3921af7f96d5aed7677e8ddf --- src/content/docs/ja/core-concepts/endpoints.mdx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index 913ff327e7670..0da9f22af154c 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -3,6 +3,8 @@ title: エンドポイント description: あらゆる種類のデータを提供するエンドポイントの作成方法について説明します。 i18nReady: true --- +import RecipeLinks from "~/components/RecipeLinks.astro"; + Astroでは、あらゆる種類のデータを提供するためのカスタムエンドポイントを作成できます。これを利用して、画像を生成したり、RSSを公開したり、またはAPIルーティングとして使用してサイトの完全なAPIを構築できます。 静的に生成されたサイトでは、カスタムエンドポイントは静的ファイルを生成するため、ビルド時に呼び出されます。[SSR](/ja/guides/server-side-rendering/)モードを選択した場合、カスタムエンドポイントはリクエストに応じて呼び出されるライブサーバーエンドポイントに変わります。静的エンドポイントとSSRエンドポイントは同じ様に定義されますが、SSRエンドポイントは追加機能をサポートします。 @@ -178,6 +180,8 @@ export const all: APIRoute = ({ request }) => { } ``` + + ### `request` SSRモードでは、`request`プロパティは、現在のリクエストを参照する完全に使用可能な[`Request`](https://developer.mozilla.org/ja/docs/Web/API/Request)オブジェクトを返します。これにより、データの受け入れやヘッダーのチェックができます。 @@ -218,5 +222,3 @@ export async function get({ params, redirect }) { return redirect(link, 307); } ``` - -**関連レシピ:** [CAPTCHAを検証するためにサーバーエンドポイントを使う](/ja/recipes/captcha/) From 820d71b78d12993155cbd4e32aa7a37909c84c99 Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sat, 2 Sep 2023 21:31:33 +0900 Subject: [PATCH 04/13] 33b3229039014f1f9b7ab843300a0c630b1785f3 --- src/content/docs/ja/core-concepts/endpoints.mdx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index 0da9f22af154c..4aac638879202 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -56,7 +56,7 @@ export const get: APIRoute = async function get ({params, request}) { エンドポイントは、ページと同じ[動的ルーティング](/ja/core-concepts/routing/#%E5%8B%95%E7%9A%84%E3%83%AB%E3%83%BC%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0)機能をサポートしています。ファイル名を括弧付きのパラメーター名とし、[`getStaticPaths()`関数](/ja/reference/api-reference/#getstaticpaths)をエクスポートしてください。そして、エンドポイント関数に渡された`params`プロパティを使用して、パラメーターにアクセスします。 -```ts title="src/pages/[id].json.ts" +```ts title="src/pages/api/[id].json.ts" import type { APIRoute } from 'astro'; const usernames = ["Sarah", "Chris", "Dan"] @@ -79,7 +79,7 @@ export function getStaticPaths () { } ``` -これにより、ビルド時に`/api/1.json`、`/api/2.json`、`/api/3.json`という3つのJSONエンドポイントが生成されます。エンドポイントによる動的ルーティングはページと同じように動作しますが、エンドポイントはコンポーネントではなく関数であるため、[props](/ja/reference/api-reference/#data-passing-with-props)はサポートされていません。 +これにより、ビルド時に`/api/0.json`、`/api/1.json`、`/api/2.json`という3つのJSONエンドポイントが生成されます。エンドポイントによる動的ルーティングはページと同じように動作しますが、エンドポイントはコンポーネントではなく関数であるため、[props](/ja/reference/api-reference/#data-passing-with-props)はサポートされていません。 ### `request` From 483fd0818e420d7d6d0e248d2d54a377b577434d Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sat, 2 Sep 2023 21:47:53 +0900 Subject: [PATCH 05/13] 046e0af9329b5f23bbc8dcde58681a4d956f3261 --- src/content/docs/ja/core-concepts/endpoints.mdx | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index 4aac638879202..15a31518ad0e5 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -136,6 +136,17 @@ export async function get({ params }) { これは、動的ルーティングにマッチするすべてのリクエストに応答します。たとえば、`/helmet.json`に移動した場合、`params.id`は`helmet`に設定されます。モックの商品データベースに`helmet`が存在すれば、エンドポイントは`Response`オブジェクトを作成してJSONで応答し、[HTTPステータスコード](https://developer.mozilla.org/ja/docs/Web/API/Response/status)として成功を返します。存在しない場合は、`Response`オブジェクトを使用して`404`で応答します。 +特定のプロバイダーは、SSRモードで画像を返すために`Content-Type`ヘッダーを要求します。この場合、`Response`オブジェクトを使用して`headers`プロパティを指定します。以下はバイナリの`.png`画像を返却する例です。 +```ts title="src/pages/astro-logo.png.ts" +export async function get({ params, request }) { + const response = await fetch("https://docs.astro.build/assets/full-logo-light.png"); + const buffer = Buffer.from(await response.arrayBuffer()); + return new Response(buffer, { + headers: { "Content-Type": "image/png" }, + }); +} +``` + ### HTTPメソッド `get`関数に加え、任意の[HTTPメソッド](https://developer.mozilla.org/ja/docs/Web/HTTP/Methods)名を持つ関数をエクスポートできます。リクエストが来ると、Astroはそのメソッドをチェックして、対応する関数を呼び出します。 From 6b13ff53effd5556b8aca2c4f3356071cc1317fc Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sat, 2 Sep 2023 21:49:17 +0900 Subject: [PATCH 06/13] dd6c16bcb158cc386eb678a5a9d57e177e763c39 --- src/content/docs/ja/core-concepts/endpoints.mdx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index 15a31518ad0e5..721e8c7c38683 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -104,6 +104,8 @@ export const get: APIRoute = ({ params, request }) => { しかし、`static`モードとは異なり、`server`モードを設定すると、エンドポイントはリクエストされた時点で構築されます。これにより、ビルド時には利用できない新しい機能がアンロックされ、リクエストをリッスンするAPIルートを構築したり、実行時にサーバー上で安全にコードを実行できるようになります。 + + :::note これらの例を試す前に、必ず[SSRを有効](/ja/guides/server-side-rendering/#プロジェクトでssrを有効にする)にしてください。 ::: From 8449fbd381565d75784a25403c7d0a95af75aab5 Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sat, 2 Sep 2023 21:50:08 +0900 Subject: [PATCH 07/13] f4a736e44fe7c1b153f00bfdaf08ce04edf00b8a --- src/content/docs/ja/core-concepts/endpoints.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index 721e8c7c38683..b42680c0b0219 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -47,7 +47,7 @@ export async function get({ params, request }) { ```ts import type { APIRoute } from 'astro'; -export const get: APIRoute = async function get ({params, request}) { +export const get: APIRoute = async () => ({ params, request }) { ... ``` From fb8ed36d938df18df2d96e85599c43b55f1710ff Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sat, 2 Sep 2023 21:50:52 +0900 Subject: [PATCH 08/13] e93972727b54b241893e9937d928f2edfb9a8499 --- src/content/docs/ja/core-concepts/endpoints.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index b42680c0b0219..7f2298dc715df 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -47,7 +47,7 @@ export async function get({ params, request }) { ```ts import type { APIRoute } from 'astro'; -export const get: APIRoute = async () => ({ params, request }) { +export const get: APIRoute = async ({ params, request }) => { ... ``` From 3131a88a366a4f5ef68c5184fdf86821f08ebbf1 Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sat, 2 Sep 2023 22:23:25 +0900 Subject: [PATCH 09/13] a4fe77693b97db1ed76f72e251824c0c17631ee9 --- .../docs/ja/core-concepts/endpoints.mdx | 111 ++++++++---------- 1 file changed, 50 insertions(+), 61 deletions(-) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index 7f2298dc715df..3ba38f18fdf10 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -14,31 +14,27 @@ Astroでは、あらゆる種類のデータを提供するためのカスタム カスタムエンドポイントを作成するには、`.js`または`.ts`ファイルを`/pages`ディレクトリに追加してください。`.js`または`.ts`の拡張子はビルドプロセス中に削除されるので、ファイル名には作成したいデータの拡張子を含める必要があります。たとえば、`src/pages/data.json.ts`は、`/data.json`エンドポイントを構築します。 -エンドポイントは、`Astro`グローバルと同様のプロパティを持つ[コンテキストオブジェクト](/ja/reference/api-reference/#endpoint-context)を受け取る`get`関数（オプションで`async`）をエクスポートします。これは`body`を持つオブジェクトを返し、Astroはビルド時にこれを呼び出し、bodyの内容を使ってファイルを生成します。 +エンドポイントは、`Astro`グローバルと同様のプロパティを持つ[コンテキストオブジェクト](/ja/reference/api-reference/#endpoint-context)を受け取る`GET`関数（オプションで`async`）をエクスポートします。以下では、`name`と`url`を持つレスポンスオブジェクトを返し、Astroはビルド時にこれを呼び出し、bodyの内容を使ってファイルを生成します。 ```ts // 例: src/pages/builtwith.json.ts // 出力: /builtwith.json -export async function get({params, request}) { - return { - body: JSON.stringify({ +export async function GET({params, request}) { + return new Response( + JSON.stringify({ name: 'Astro', - url: 'https://astro.build/', - }), - }; + url: 'https://astro.build/' + }) + ) } ``` -戻り値のオブジェクトは、`encoding`プロパティを持つことができます。これは、Node.jsの`fs.writeFile`メソッドで受け入れられる有効な[`BufferEncoding`](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/bdd02508ddb5eebcf701fdb8ffd6e84eabf47885/types/node/buffer.d.ts#L169)であれば何でもかまいません。たとえば、バイナリのpngイメージを生成する場合は次のようになります。 +Astro v3.0以降、返り値の`Response`オブジェクトが`encoding`プロパティを含む必要はなくなりました。たとえば、バイナリのpng画像を生成する場合は次のようになります。 -```ts title="src/pages/astro-logo.png.ts" {6} -export async function get({ params, request }) { +```ts title="src/pages/astro-logo.png.ts" {3} +export async function GET({ params, request }) { const response = await fetch("https://docs.astro.build/assets/full-logo-light.png"); - const buffer = Buffer.from(await response.arrayBuffer()); - return { - body: buffer, - encoding: 'binary', - }; + return new Response(await response.arrayBuffer()); } ``` @@ -47,8 +43,7 @@ export async function get({ params, request }) { ```ts import type { APIRoute } from 'astro'; -export const get: APIRoute = async ({ params, request }) => { -... +export const GET: APIRoute = async ({ params, request }) => {...} ``` ### `params`と動的ルーティング @@ -59,27 +54,28 @@ export const get: APIRoute = async ({ params, request }) => { ```ts title="src/pages/api/[id].json.ts" import type { APIRoute } from 'astro'; -const usernames = ["Sarah", "Chris", "Dan"] +const usernames = ["Sarah", "Chris", "Yan", "Elian"] -export const get: APIRoute = ({ params, request }) => { +export const GET: APIRoute = ({ params, request }) => { const id = params.id; - return { - body: JSON.stringify({ + return new Response( + JSON.stringify({ name: usernames[id] }) - } -}; + ) +} -export function getStaticPaths () { +export function getStaticPaths() { return [ { params: { id: "0"} }, { params: { id: "1"} }, { params: { id: "2"} }, + { params: { id: "3"} } ] } ``` -これにより、ビルド時に`/api/0.json`、`/api/1.json`、`/api/2.json`という3つのJSONエンドポイントが生成されます。エンドポイントによる動的ルーティングはページと同じように動作しますが、エンドポイントはコンポーネントではなく関数であるため、[props](/ja/reference/api-reference/#data-passing-with-props)はサポートされていません。 +これにより、ビルド時に`/api/0.json`、`/api/1.json`、`/api/2.json`、`/api/3.json`という4つのJSONエンドポイントが生成されます。エンドポイントによる動的ルーティングはページと同じように動作しますが、エンドポイントはコンポーネントではなく関数であるため、[props](/ja/reference/api-reference/#data-passing-with-props)はサポートされていません。 ### `request` @@ -88,12 +84,11 @@ export function getStaticPaths () { ```ts title="src/pages/request-path.json.ts" import type { APIRoute } from 'astro'; -export const get: APIRoute = ({ params, request }) => { - return { - body: JSON.stringify({ +export const GET: APIRoute = ({ params, request }) => { + return new Response(JSON.stringify({ path: new URL(request.url).pathname }) - }; + ) } ``` @@ -116,7 +111,7 @@ export const get: APIRoute = ({ params, request }) => { ```js title="src/pages/[id].json.js" import { getProduct } from '../db'; -export async function get({ params }) { +export async function GET({ params }) { const id = params.id; const product = await getProduct(id); @@ -127,12 +122,14 @@ export async function get({ params }) { }); } - return new Response(JSON.stringify(product), { - status: 200, - headers: { - "Content-Type": "application/json" + return new Response( + JSON.stringify(product), { + status: 200, + headers: { + "Content-Type": "application/json" + } } - }); + ); } ``` @@ -140,7 +137,7 @@ export async function get({ params }) { 特定のプロバイダーは、SSRモードで画像を返すために`Content-Type`ヘッダーを要求します。この場合、`Response`オブジェクトを使用して`headers`プロパティを指定します。以下はバイナリの`.png`画像を返却する例です。 ```ts title="src/pages/astro-logo.png.ts" -export async function get({ params, request }) { +export async function GET({ params, request }) { const response = await fetch("https://docs.astro.build/assets/full-logo-light.png"); const buffer = Buffer.from(await response.arrayBuffer()); return new Response(buffer, { @@ -151,45 +148,37 @@ export async function get({ params, request }) { ### HTTPメソッド -`get`関数に加え、任意の[HTTPメソッド](https://developer.mozilla.org/ja/docs/Web/HTTP/Methods)名を持つ関数をエクスポートできます。リクエストが来ると、Astroはそのメソッドをチェックして、対応する関数を呼び出します。 +`GET`関数に加えて、任意の[HTTPメソッド](https://developer.mozilla.org/ja/docs/Web/HTTP/Methods)の名前をもつ関数をエクスポートできます。リクエストが来た時、Astroはメソッドをチェックし、対応する関数を呼び出します。 -また、対応するエクスポートされた関数がないメソッドにマッチするように、`all`関数をエクスポートできます。一致するメソッドがないリクエストの場合、サイトの[404ページ](/ja/core-concepts/astro-pages/#%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%A0404%E3%82%A8%E3%83%A9%E3%83%BC%E3%83%9A%E3%83%BC%E3%82%B8)にリダイレクトされます。 - -:::note -JavaScriptでは`delete`は予約語なので、代わりに`del`関数をエクスポートするとdeleteメソッドにマッチします。 -::: +対応するエクスポートされた関数がないHTTPメソッドにマッチする`ALL`関数をエクスポートすることもできます。対応するメソッドがないリクエストが来た場合、サイトの[404ページ](/ja/core-concepts/astro-pages/#カスタム404エラーページ)にリダイレクトされます。 ```ts title="src/pages/methods.json.ts" -export const get: APIRoute = ({ params, request }) => { - return { - body: JSON.stringify({ +export const GET: APIRoute = ({ params, request }) => { + return new Response(JSON.stringify({ message: "This was a GET!" }) - } -}; + ) +} -export const post: APIRoute = ({ request }) => { - return { - body: JSON.stringify({ +export const POST: APIRoute = ({ request }) => { + return new Response(JSON.stringify({ message: "This was a POST!" }) - } + ) } -export const del: APIRoute = ({ request }) => { - return { - body: JSON.stringify({ +export const DELETE: APIRoute = ({ request }) => { + return new Response(JSON.stringify({ message: "This was a DELETE!" }) - } + ) } -export const all: APIRoute = ({ request }) => { - return { - body: JSON.stringify({ +export const ALL: APIRoute = ({ request }) => { + return new Response(JSON.stringify({ message: `This was a ${request.method}!` }) - } + ) } ``` @@ -200,7 +189,7 @@ export const all: APIRoute = ({ request }) => { SSRモードでは、`request`プロパティは、現在のリクエストを参照する完全に使用可能な[`Request`](https://developer.mozilla.org/ja/docs/Web/API/Request)オブジェクトを返します。これにより、データの受け入れやヘッダーのチェックができます。 ```ts title="src/pages/test-post.json.ts" -export const post: APIRoute = async ({ request }) => { +export const POST: APIRoute = async ({ request }) => { if (request.headers.get("Content-Type") === "application/json") { const body = await request.json(); const name = body.name; @@ -221,7 +210,7 @@ export const post: APIRoute = async ({ request }) => { ```js title="src/pages/links/[id].js" {14} import { getLinkUrl } from '../db'; -export async function get({ params, redirect }) { +export async function GET({ params, redirect }) { const { id } = params; const link = await getLinkUrl(id); From 2237fa6bea43798a78b9a5fc853ddba9935c1b03 Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sat, 2 Sep 2023 22:56:55 +0900 Subject: [PATCH 10/13] Minor tweaks --- .../docs/ja/core-concepts/endpoints.mdx | 24 +++++++++---------- 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index 3ba38f18fdf10..13f894ed4c3d6 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -1,20 +1,20 @@ --- title: エンドポイント -description: あらゆる種類のデータを提供するエンドポイントの作成方法について説明します。 +description: 任意の種類のデータを提供するエンドポイントの作成方法について説明します。 i18nReady: true --- import RecipeLinks from "~/components/RecipeLinks.astro"; -Astroでは、あらゆる種類のデータを提供するためのカスタムエンドポイントを作成できます。これを利用して、画像を生成したり、RSSを公開したり、またはAPIルーティングとして使用してサイトの完全なAPIを構築できます。 +Astroでは、任意の種類のデータを提供するためのカスタムエンドポイントを作成できます。これを利用して、画像を生成したり、RSSを公開したり、またはAPIルーティングとして使用してサイトの完全なAPIを構築したりできます。 -静的に生成されたサイトでは、カスタムエンドポイントは静的ファイルを生成するため、ビルド時に呼び出されます。[SSR](/ja/guides/server-side-rendering/)モードを選択した場合、カスタムエンドポイントはリクエストに応じて呼び出されるライブサーバーエンドポイントに変わります。静的エンドポイントとSSRエンドポイントは同じ様に定義されますが、SSRエンドポイントは追加機能をサポートします。 +静的に生成されたサイトでは、カスタムエンドポイントは静的ファイルを生成するため、ビルド時に呼び出されます。[SSR](/ja/guides/server-side-rendering/)モードを選択した場合、カスタムエンドポイントはリクエストに応じて呼び出される動的なサーバーエンドポイントに変わります。静的エンドポイントとSSRエンドポイントは同じ様に定義されますが、SSRエンドポイントは追加機能をサポートします。 ## 静的ファイルのエンドポイント -カスタムエンドポイントを作成するには、`.js`または`.ts`ファイルを`/pages`ディレクトリに追加してください。`.js`または`.ts`の拡張子はビルドプロセス中に削除されるので、ファイル名には作成したいデータの拡張子を含める必要があります。たとえば、`src/pages/data.json.ts`は、`/data.json`エンドポイントを構築します。 +カスタムエンドポイントを作成するには、`.js`または`.ts`ファイルを`/pages`ディレクトリに追加してください。`.js`または`.ts`の拡張子はビルドプロセス中に削除されるので、ファイル名には作成したいデータの拡張子を含める必要があります。たとえば、`src/pages/data.json.ts`は、ビルドすると`/data.json`エンドポイントとなります。 -エンドポイントは、`Astro`グローバルと同様のプロパティを持つ[コンテキストオブジェクト](/ja/reference/api-reference/#endpoint-context)を受け取る`GET`関数（オプションで`async`）をエクスポートします。以下では、`name`と`url`を持つレスポンスオブジェクトを返し、Astroはビルド時にこれを呼び出し、bodyの内容を使ってファイルを生成します。 +エンドポイントは、`Astro`グローバルと同様のプロパティを持つ[コンテキストオブジェクト](/ja/reference/api-reference/#endpoint-context)を受け取る`GET`関数（`async`も可）をエクスポートします。以下のエンドポイントは`name`と`url`を持つレスポンスオブジェクトを返しており、Astroはビルド時にこれを呼び出し、bodyの内容を使ってファイルを生成します。 ```ts // 例: src/pages/builtwith.json.ts @@ -48,7 +48,7 @@ export const GET: APIRoute = async ({ params, request }) => {...} ### `params`と動的ルーティング -エンドポイントは、ページと同じ[動的ルーティング](/ja/core-concepts/routing/#%E5%8B%95%E7%9A%84%E3%83%AB%E3%83%BC%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0)機能をサポートしています。ファイル名を括弧付きのパラメーター名とし、[`getStaticPaths()`関数](/ja/reference/api-reference/#getstaticpaths)をエクスポートしてください。そして、エンドポイント関数に渡された`params`プロパティを使用して、パラメーターにアクセスします。 +エンドポイントは、ページと同じ[動的ルーティング](/ja/core-concepts/routing/#%E5%8B%95%E7%9A%84%E3%83%AB%E3%83%BC%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0)機能をサポートしています。ファイル名を角括弧付きのパラメーター名とし、[`getStaticPaths()`関数](/ja/reference/api-reference/#getstaticpaths)をエクスポートしてください。そして、エンドポイント関数に渡された`params`プロパティを使用して、パラメーターにアクセスします。 ```ts title="src/pages/api/[id].json.ts" @@ -95,9 +95,9 @@ export const GET: APIRoute = ({ params, request }) => { ## サーバーエンドポイント（APIルーティング） -静的ファイルエンドポイントのセクションで説明したものはすべて、SSRモードでも使用できます。ファイルは、`Astro`グローバルと同様のプロパティを持つ[コンテキストオブジェクト](/ja/reference/api-reference/#endpoint-context)を受け取る`get`関数をエクスポートできます。 +静的ファイルエンドポイントのセクションで説明したものはすべて、SSRモードでも使用できます。ファイルは、`Astro`グローバルと同様のプロパティを持つ[コンテキストオブジェクト](/ja/reference/api-reference/#endpoint-context)を受け取る`GET`関数をエクスポートできます。 -しかし、`static`モードとは異なり、`server`モードを設定すると、エンドポイントはリクエストされた時点で構築されます。これにより、ビルド時には利用できない新しい機能がアンロックされ、リクエストをリッスンするAPIルートを構築したり、実行時にサーバー上で安全にコードを実行できるようになります。 +しかし、`static`モードとは異なり、`server`モードを設定すると、エンドポイントはリクエストされた時点でビルドされます。これにより、ビルド時には利用できない新しい機能が利用可能となり、リクエストをリッスンするAPIルートを構築したり、実行時にサーバー上で安全にコードを実行できるようになります。 @@ -105,7 +105,7 @@ export const GET: APIRoute = ({ params, request }) => { これらの例を試す前に、必ず[SSRを有効](/ja/guides/server-side-rendering/#プロジェクトでssrを有効にする)にしてください。 ::: -サーバーエンドポイントは、`getStaticPaths`をエクスポートせず`params`にアクセスでき、[`Response`](https://developer.mozilla.org/ja/docs/Web/API/Response)オブジェクトを返せるので、ステータスコードやヘッダーを設定できます。 +サーバーエンドポイントは、`getStaticPaths`のエクスポートなしで`params`にアクセスできます。また、[`Response`](https://developer.mozilla.org/ja/docs/Web/API/Response)オブジェクトを返せるので、ステータスコードやヘッダーを設定できます。 ```js title="src/pages/[id].json.js" @@ -133,7 +133,7 @@ export async function GET({ params }) { } ``` -これは、動的ルーティングにマッチするすべてのリクエストに応答します。たとえば、`/helmet.json`に移動した場合、`params.id`は`helmet`に設定されます。モックの商品データベースに`helmet`が存在すれば、エンドポイントは`Response`オブジェクトを作成してJSONで応答し、[HTTPステータスコード](https://developer.mozilla.org/ja/docs/Web/API/Response/status)として成功を返します。存在しない場合は、`Response`オブジェクトを使用して`404`で応答します。 +これは、動的ルーティングにマッチするすべてのリクエストに応答します。たとえば、`/helmet.json`に移動した場合、`params.id`は`helmet`に設定されます。モックの商品データベースに`helmet`が存在すれば、エンドポイントは`Response`オブジェクトを作成してJSONで応答し、成功を意味する[HTTPステータスコード](https://developer.mozilla.org/ja/docs/Web/API/Response/status)を返します。存在しない場合は、`Response`オブジェクトを使用して`404`で応答します。 特定のプロバイダーは、SSRモードで画像を返すために`Content-Type`ヘッダーを要求します。この場合、`Response`オブジェクトを使用して`headers`プロパティを指定します。以下はバイナリの`.png`画像を返却する例です。 ```ts title="src/pages/astro-logo.png.ts" @@ -186,7 +186,7 @@ export const ALL: APIRoute = ({ request }) => { ### `request` -SSRモードでは、`request`プロパティは、現在のリクエストを参照する完全に使用可能な[`Request`](https://developer.mozilla.org/ja/docs/Web/API/Request)オブジェクトを返します。これにより、データの受け入れやヘッダーのチェックができます。 +SSRモードでは、`request`プロパティは、現在のリクエストを参照する完全に使用可能な[`Request`](https://developer.mozilla.org/ja/docs/Web/API/Request)オブジェクトを返します。これにより、データの取得やヘッダーのチェックができます。 ```ts title="src/pages/test-post.json.ts" export const POST: APIRoute = async ({ request }) => { @@ -205,7 +205,7 @@ export const POST: APIRoute = async ({ request }) => { ### リダイレクト -エンドポイントコンテキストは、`Astro.redirect`に似た`redirect()`ユーティリティをエクスポートします。 +エンドポイントのコンテキストは、`Astro.redirect`に似た`redirect()`ユーティリティをエクスポートします。 ```js title="src/pages/links/[id].js" {14} import { getLinkUrl } from '../db'; From 9f5d76bc416438296d83b86bc1a4127983f05e9c Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sat, 2 Sep 2023 23:13:29 +0900 Subject: [PATCH 11/13] Fix broken links --- src/content/docs/ja/core-concepts/endpoints.mdx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index 13f894ed4c3d6..37441d8b0e195 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -99,7 +99,7 @@ export const GET: APIRoute = ({ params, request }) => { しかし、`static`モードとは異なり、`server`モードを設定すると、エンドポイントはリクエストされた時点でビルドされます。これにより、ビルド時には利用できない新しい機能が利用可能となり、リクエストをリッスンするAPIルートを構築したり、実行時にサーバー上で安全にコードを実行できるようになります。 - + :::note これらの例を試す前に、必ず[SSRを有効](/ja/guides/server-side-rendering/#プロジェクトでssrを有効にする)にしてください。 @@ -182,7 +182,7 @@ export const ALL: APIRoute = ({ request }) => { } ``` - + ### `request` From 6952bec09a1c1c39b3220b6ce6144f06a2b949ad Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sun, 3 Sep 2023 22:24:09 +0900 Subject: [PATCH 12/13] Update src/content/docs/ja/core-concepts/endpoints.mdx Co-authored-by: Kyosuke Nakamura --- src/content/docs/ja/core-concepts/endpoints.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index 37441d8b0e195..ab464f8995eb9 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -5,7 +5,7 @@ i18nReady: true --- import RecipeLinks from "~/components/RecipeLinks.astro"; -Astroでは、任意の種類のデータを提供するためのカスタムエンドポイントを作成できます。これを利用して、画像を生成したり、RSSを公開したり、またはAPIルーティングとして使用してサイトの完全なAPIを構築したりできます。 +Astroでは、どんな種類のデータでも提供できるカスタムエンドポイントを作成できます。これを利用して、画像を生成したり、RSSを公開したり、またはAPIルーティングとして使用してサイトの完全なAPIを構築したりできます。 静的に生成されたサイトでは、カスタムエンドポイントは静的ファイルを生成するため、ビルド時に呼び出されます。[SSR](/ja/guides/server-side-rendering/)モードを選択した場合、カスタムエンドポイントはリクエストに応じて呼び出される動的なサーバーエンドポイントに変わります。静的エンドポイントとSSRエンドポイントは同じ様に定義されますが、SSRエンドポイントは追加機能をサポートします。 From a38419f5440fa7c3aee38e0c6be5745adebcea26 Mon Sep 17 00:00:00 2001 From: Shinya Fujino Date: Sun, 3 Sep 2023 22:28:41 +0900 Subject: [PATCH 13/13] Update description --- src/content/docs/ja/core-concepts/endpoints.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/docs/ja/core-concepts/endpoints.mdx b/src/content/docs/ja/core-concepts/endpoints.mdx index ab464f8995eb9..fab928823fe14 100644 --- a/src/content/docs/ja/core-concepts/endpoints.mdx +++ b/src/content/docs/ja/core-concepts/endpoints.mdx @@ -1,6 +1,6 @@ --- title: エンドポイント -description: 任意の種類のデータを提供するエンドポイントの作成方法について説明します。 +description: どんな種類のデータでも提供できるエンドポイントの作成方法について学びます。 i18nReady: true --- import RecipeLinks from "~/components/RecipeLinks.astro";