Skip to content

Commit

Permalink
i18n(ko-KR): update middleware.mdx, routing.mdx, `api-reference.m…
Browse files Browse the repository at this point in the history
…dx` (#8989)

* i18n(ko-KR): update `middleware.mdx`

* fix: import `Since` component

* i18n(ko-KR): update `routing.mdx`

* i18n(ko-KR): update `api-reference.mdx`

* Update src/content/docs/ko/guides/routing.mdx

Co-authored-by: liruifengv <[email protected]>

* Update src/content/docs/ko/guides/middleware.mdx

Co-authored-by: liruifengv <[email protected]>

* Update src/content/docs/ko/guides/middleware.mdx

Co-authored-by: liruifengv <[email protected]>

* i18n(ko-KR): update `api-reference.mdx`

* fix: update broken link

* fix: update broken link

* fix: update broken link

* i18n(ko-KR): update `api-reference.mdx`

---------

Co-authored-by: liruifengv <[email protected]>
Co-authored-by: Yan <[email protected]>
  • Loading branch information
3 people authored Aug 5, 2024
1 parent eedcb8d commit d727852
Show file tree
Hide file tree
Showing 3 changed files with 565 additions and 63 deletions.
74 changes: 74 additions & 0 deletions src/content/docs/ko/guides/middleware.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ i18nReady: true
---
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
import { Steps } from '@astrojs/starlight/components';
import Since from '~/components/Since.astro';

**미들웨어**를 사용하면 페이지나 엔드포인트가 렌더링될 때마다 요청과 응답을 가로채고 동작을 동적으로 추가할 수 있습니다. 이 렌더링은 사전 렌더링된 모든 페이지에 대해 빌드 시 발생하지만, 요청 시 렌더링된 페이지에 대해 경로가 요청될 때 발생하므로 [쿠키 및 헤더와 같은 추가 SSR 기능](/ko/guides/server-side-rendering/#주문형-렌더링-기능)을 사용할 수 있습니다.

Expand Down Expand Up @@ -196,6 +197,79 @@ auth 응답
validation 응답
```

## 리라이팅

<p><Since v="4.13.0" /></p>

`APIContext``rewrite()`라는 메서드를 노출하는데, 이는 [Astro.rewrite](/ko/guides/routing/#리라이트)와 동일한 방식으로 작동합니다.

방문자를 새 페이지로 [리디렉션](/ko/guides/routing/#동적-리디렉션)하지 않고 다른 페이지의 콘텐츠를 표시하려면 미들웨어에서 `context.rewrite()`를 사용하세요. 이렇게 하면 새 렌더링 단계가 트리거되어 모든 미들웨어가 다시 실행됩니다.

```js title="src/middleware.js"
import { isLoggedIn } from "~/auth.js"
export function onRequest (context, next) {
if (!isLoggedIn(context)) {
// 사용자가 로그인하지 않은 경우 `/login` 경로를 렌더링하도록 요청을 업데이트하고
// 로그인 성공 후 사용자에게 전송할 위치를 나타내는 헤더를 추가합니다.
// 미들웨어를 다시 실행합니다.
return context.rewrite(new Request("/login", {
headers: {
"x-redirect-to": context.url.pathname
}
}));
}

return next();
};
```

또한 `next()` 함수에 선택적 URL 경로 매개변수를 전달하여 새 렌더링 단계를 다시 트리거하지 않고 현재 `Request`를 리라이트할 수 있습니다. 리라이트 경로의 위치는 문자열, URL 또는 `Request`로 제공할 수 있습니다:

```js title="src/middleware.js"
import { isLoggedIn } from "~/auth.js"
export function onRequest (context, next) {
if (!isLoggedIn(context)) {
// 사용자가 로그인하지 않은 경우 `/login` 경로를 렌더링하도록 요청을 업데이트하고
// 로그인 성공 후 사용자에게 전송할 위치를 나타내는 헤더를 추가합니다.
// 다음 미들웨어에 새 `context`를 반환합니다.
return next(new Request("/login", {
headers: {
"x-redirect-to": context.url.pathname
}
}));
}

return next();
};
```

`next()` 함수는 [`Astro.rewrite()` 함수](/ko/reference/api-reference/#astrorewrite)와 동일한 페이로드를 전달받습니다. 리라이트 경로의 위치는 문자열, URL 또는 `Request`로 제공할 수 있습니다.

[sequence()](#미들웨어-체이닝)를 통해 여러 미들웨어 함수가 체인으로 연결된 경우, `next()`에 경로를 제출하면 `Request`가 제자리에 리라이트되고 미들웨어가 다시 실행되지 않습니다. 체인의 다음 미들웨어 함수는 업데이트된 `context`와 함께 새 `Request`를 받게 됩니다:

```js title="src/middleware.js"
// 현재 URL은 https://example.com/blog

// 첫 미들웨어 함수
async function first(_, next) {
console.log(context.url.pathname) // "/blog"가 기록됩니다.
// 새 경로와 홈페이지가 리라이트됩니다.
// 다음 함수에 전달되는 업데이트된 `context`를 반환합니다.
return next("/")
}

// 현재 URL은 여전히 https://example.com/blog

// 두 번째 미들웨어 함수
async function second(context, next) {
// 업데이트된 `context`를 전달받습니다.
console.log(context.url.pathname) // "/"가 기록됩니다.
return next()
}

export const onRequest = sequence(first, second);
```

## 오류 페이지

미들웨어는 일치하는 경로를 찾을 수 없는 경우에도 주문형 렌더링된 모든 페이지에 대해 실행을 시도합니다. 여기에는 Astro의 기본 (비어있는) 404 페이지와 사용자 정의 404 페이지가 포함됩니다. 그러나 해당 코드의 실행 여부는 [어댑터](/ko/guides/server-side-rendering/)에 따라 결정됩니다. 일부 어댑터는 플랫폼별 오류 페이지를 대신 제공할 수 있습니다.
Expand Down
62 changes: 62 additions & 0 deletions src/content/docs/ko/guides/routing.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -298,6 +298,68 @@ if (!isLoggedIn(cookie)) {
</html>
```

## 리라이트

<p><Since v="4.13.0" /></p>

리라이트를 사용하면 브라우저를 다른 페이지로 리디렉션하지 않고도 다른 경로를 제공할 수 있습니다. 브라우저는 URL 표시줄에 원래 주소를 표시하지만, 대신 [`Astro.rewrite()`](/ko/reference/api-reference/#astrorewrite)에 제공된 URL의 콘텐츠를 표시합니다.

:::tip
영구적으로 이동한 콘텐츠를 제공하거나 사용자를 새 URL을 사용하는 다른 페이지로 안내하려면 (예: 로그인 후 사용자 대시보드) [리디렉션](#리디렉션)을 사용하세요.
:::

리라이트는 두 개의 다른 소스 파일을 유지 관리할 필요 없이 여러 경로 (예: `/products/shoes/men/``/products/men/shoes/`)에서 동일한 콘텐츠를 표시하는 데 유용할 수 있습니다.

리라이트는 SEO 목적과 사용자 경험에도 유용합니다. 방문자를 다른 페이지로 리디렉션해야 하거나 404 상태를 반환하는 콘텐츠를 표시할 수 있습니다. 리라이트의 일반적인 용도 중 하나는 다양한 언어 변형에 대해 동일한 현지화된 콘텐츠를 표시하는 것입니다.

다음은 방문자가 `/es-CU/` (쿠바 스페인어) URL 경로에 방문했을 때 리라이트를 사용하여 페이지의 `/es/` 버전을 렌더링하는 예시입니다. 방문자가 `/es-cu/articles/introduction` URL로 이동하면 Astro는 `src/pages/es/articles/introduction.astro` 파일에 의해 생성된 콘텐츠를 렌더링합니다.

```astro title="src/pages/es-cu/articles/introduction.astro"
---
return Astro.rewrite("/es/articles/introduction")
---
```

다른 페이지로 경로를 변경하려면 엔드포인트 파일에서 `context.rewrite()`를 사용하세요:

```js title="src/pages/api.js"
export function GET(context) {
if (!context.locals.allowed) {
return context.rewrite("/")
}
}
```

`Astro.rewrite()`에 전달된 URL이 런타임 오류를 발생시키면 개발 환경에서는 오버레이 오류가 표시되고 프로덕션 환경에서는 500 상태 코드가 반환됩니다. URL이 프로젝트에 존재하지 않으면 404 상태 코드가 반환됩니다.

예를 들어 이커머스 스토어의 제품을 더 이상 사용할 수 없음을 표시하기 위해 의도적으로 `/404` 페이지를 렌더링하는 리라이트를 생성할 수 있습니다:

```astro title="src/pages/[item].astro"
---
const { item } = Astro.params;
if (!itemExists(item)) {
return Astro.rewrite("/404")
}
---
<div>...</div>
```

예를 들어, 존재하지 않는 URL을 방문할 때 사이트의 특정 페이지를 표시하는 등 HTTP 응답 상태에 따라 조건부로 리라이트할 수도 있습니다:

```js title="src/middleware.mjs"
export const onRequest = async (context, next) => {
const response = await next();
if (response.status === 404) {
return context.rewrite("/");
}
return response;
}
```

지정된 리라이트 경로의 콘텐츠를 표시하기 전에 `Astro.rewrite()` 함수는 새롭고 완전한 렌더링 단계를 트리거합니다. 그러면 새 경로/요청에 대한 모든 미들웨어가 다시 실행됩니다.

<ReadMore>[`Astro.rewrite()` API 참조](/ko/reference/api-reference/#astrorewrite)에 대해 자세히 알아보세요.</ReadMore>

## 경로 우선순위

정의된 여러 경로가 동일한 URL 경로를 빌드하려고 시도할 수 있습니다. 예를 들어, 다음 경로는 모두 `/posts/create`를 빌드할 수 있습니다.
Expand Down
Loading

0 comments on commit d727852

Please sign in to comment.