

本文為英文版的機器翻譯版本，如內容有任何歧義或不一致之處，概以英文版為準。

# 重新導向和重寫範例參考
<a name="redirect-rewrite-examples"></a>

本節提供各種常見重新導向案例的範例。

**重要**  
網域特定的重新導向不支援來源欄位中的路徑元件。  
**支援**：  
`"source": "https://example.com" `（路徑會自動附加）
**不支援**：  
`"source": "https://example.com/specific-path"`
目前不支援具有`domain+path`組合的規則。
**替代模式**  
 對於網域特定的路徑重新導向，請使用：  
單獨的僅限網域規則 （路徑會自動附加）
具有條件式邏輯的僅限路徑規則
多個規則組合

您可以使用這些範例來了解在 Amplify 主控台 JSON 編輯器中建立您自己的重新導向和重寫的 JSON 語法。

**注意**  
原始地址網域比對不區分大小寫。

**Topics**
+ [簡單重新導向和重寫](#simple-redirects-and-rewrites)
+ [單一頁面 Web 應用程式 (SPA) 的重新導向](#redirects-for-single-page-web-apps-spa)
+ [反向代理重寫](#reverse-proxy-rewrite)
+ [追蹤斜線和乾淨的 URLs](#trailing-slashes-and-clean-urls)
+ [預留位置](#placeholders)
+ [查詢字串和路徑參數](#query-strings-and-path-parameters)
+ [區域型重新導向](#region-based-redirects)
+ [在重新導向和重寫中使用萬用字元表達式](#wildcard-redirects)

## 簡單重新導向和重寫
<a name="simple-redirects-and-rewrites"></a>

您可以使用下列範例，將特定頁面永久重新導向至新地址。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `/original.html`  |  `/destination.html`  |  `permanent redirect (301)`  |  | 

JSON format (JSON 格式)

```
[
  {
    "source": "/original.html", 
    "status": "301", 
    "target": "/destination.html", 
    "condition": null
  }
]
```

您可以使用下列範例，將資料夾下的任何路徑重新導向至不同資料夾下的相同路徑。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `/docs/<*>`  |  `/documents/<*>`  |  `permanent redirect (301)`  |  | 

JSON format (JSON 格式)

```
[
  {
    "source": "/docs/<*>", 
    "status": "301", 
    "target": "/documents/<*>", 
    "condition": null
  }
]
```

您可以使用下列範例，將所有流量重新導向至 index.html 作為重寫。在此情況下，重寫會讓使用者以為他們已抵達原始地址。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `/<*>`  |  `/index.html`  |  `rewrite (200)`  |  | 

JSON format (JSON 格式)

```
[
  {
    "source": "/<*>", 
    "status": "200", 
    "target": "/index.html", 
    "condition": null
  }
]
```

您可以使用下列範例來使用重寫來變更顯示給使用者的子網域。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `https://mydomain.com`  |  `https://www.mydomain.com`  |  `rewrite (200)`  |  | 

JSON format (JSON 格式)

```
[
  {
    "source": "https://mydomain.com", 
    "status": "200", "target": "https://www.mydomain.com", 
    "condition": null
  }
]
```

您可以使用下列範例來重新導向至具有路徑字首的不同網域。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `https://mydomain.com`  |  `https://www.mydomain.com/documents`  |  `temporary redirect (302)`  |  | 

JSON format (JSON 格式)

```
[
  {
    "source": "https://mydomain.com",
    "status": "302",
    "target": "https://www.mydomain.com/documents/",
    "condition": null
  }
]
```

您可以使用下列範例，將找不到的資料夾下的路徑重新導向至自訂 404 頁面。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `/<*>`  |  `/404.html`  |  `not found (404)`  |  | 

JSON format (JSON 格式)

```
[
  {
    "source": "/<*>",
    "status": "404",
    "target": "/404.html",
    "condition": null
  }
]
```

**重要**  
不支援以網域為基礎的來源規則 （例如 `"https://domain.com/path"`) 中的路徑元件，這會導致規則被忽略而不會發生錯誤。

## 單一頁面 Web 應用程式 (SPA) 的重新導向
<a name="redirects-for-single-page-web-apps-spa"></a>

大多數 SPA 架構都支援 HTML5 history.pushState() 來變更瀏覽器位置，而無需啟動伺服器請求。這對於從根目錄 (或 */index.html*) 開始導覽的使用者有效，但對於直接導覽至任何其他頁面的使用者則無效。

下列範例使用規則表達式，將所有檔案設定為 index.html 的 200 重寫，但規則表達式中指定的副檔名除外。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `</^[^.]+$\|\.(?!(css\|gif\|ico\|jpg\|js\|png\|txt\|svg\|woff\|woff2\|ttf\|map\|json\|webp)$)([^.]+$)/>`  |  `/index.html`  |  `200`  |  | 

JSON format (JSON 格式)

```
[
  {
    "source": "</^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|woff2|ttf|map|json|webp)$)([^.]+$)/>",
    "status": "200", 
    "target": "/index.html", 
    "condition": null
  }
]
```

## 反向代理重寫
<a name="reverse-proxy-rewrite"></a>

下列範例使用重寫從另一個位置代理內容，讓使用者看到網域未變更。HTTPS 是唯一支援反向代理的通訊協定。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `/images/<*>`  |  `https://images.otherdomain.com/<*>`  |  `rewrite (200)`  |  | 

JSON format (JSON 格式)

```
[
  {
    "source": "/images/<*>", 
    "status": "200", 
    "target": "https://images.otherdomain.com/<*>", 
    "condition": null
  }
]
```

## 追蹤斜線和乾淨的 URLs
<a name="trailing-slashes-and-clean-urls"></a>

若要建立乾淨的 URL 結構，像是 *about* 而不是 *about.html*，Hugo 之類的靜態網站產生器會為具有 index.html 的頁面產生目錄 (*/about/index.html*)。Amplify 會視需要新增結尾斜線，以自動建立乾淨的 URLs。下表重點說明不同的案例：


****  

| 瀏覽器中的使用者輸入 | 地址列中的 URL | 提供的文件 | 
| --- | --- | --- | 
|  `/about`  |  `/about`  |  `/about.html`  | 
|  `/about (when about.html returns 404)`  |  `/about/`  |  `/about/index.html`  | 
|  `/about/`  |  `/about/`  |  `/about/index.html`  | 

## 預留位置
<a name="placeholders"></a>

您可以使用下列範例，將資料夾結構中的路徑重新導向至另一個資料夾中的相符結構。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `/docs/<year>/<month>/<date>/<itemid>`  |  `/documents/<year>/<month>/<date>/<itemid>`  |  `permanent redirect (301)`  |  | 

JSON format (JSON 格式)

```
[
  {
    "source":  "/docs/<year>/<month>/<date>/<itemid>", 
    "status": "301",
    "target": "/documents/<year>/<month>/<date>/<itemid>",
               "condition": null
   }
]
```

## 查詢字串和路徑參數
<a name="query-strings-and-path-parameters"></a>

**警告**  
請勿在 URLs 中包含秘密、登入資料或敏感資料做為路徑或查詢參數。這些值可在 Amplify 應用程式的存取日誌中以純文字顯示。

您可以使用下列範例，將路徑重新導向至名稱符合原始地址中查詢字串元素值的資料夾：


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `/docs?id=<my-blog-id-value`  |  `/documents/<my-blog-post-id-value>`  |  `permanent redirect (301)`  |  | 

JSON format (JSON 格式)

```
[
  {
    "source": "/docs?id=<my-blog-id-value>", 
    "status": "301",
    "target": "/documents/<my-blog-id-value>", 
    "condition": null
  }
]
```

**注意**  
Amplify 會將所有查詢字串參數轉送到 301 和 302 重新導向的目的地路徑。不過，如果原始地址包含設為特定值的查詢字串，如本範例所示，Amplify 不會轉送查詢參數。在此情況下，重新導向僅適用於具有指定查詢值 的目的地地址請求`id`。

您可以使用下列範例，將所有在資料夾結構指定層級找不到的路徑重新導向至指定資料夾中的 index.html。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `/documents/<folder>/<child-folder>/<grand-child-folder>`  |  `/documents/index.html`  |  `not found (404)`  |  | 

JSON format (JSON 格式)

```
[
  {
    "source": "/documents/<x>/<y>/<z>", 
    "status": "404", 
    "target": "/documents/index.html", 
    "condition": null
  }
]
```

## 區域型重新導向
<a name="region-based-redirects"></a>

您可以使用下列範例，根據區域重新導向請求。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `/documents`  |  `/documents/us/`  |  `temporary redirect (302)`  |  `<US>`  | 

JSON format (JSON 格式)

```
[
  {
    "source": "/documents", 
    "status": "302", 
    "target": "/documents/us/", 
    "condition": "<US>"
  }
]
```

## 在重新導向和重寫中使用萬用字元表達式
<a name="wildcard-redirects"></a>

您可以在原始地址`<*>`中使用萬用字元表達式 進行重新導向或重寫。您必須將表達式放在原始地址的結尾，而且必須是唯一的。Amplify 會忽略包含多個萬用字元表達式的原始地址，或在不同的配置中使用它。

以下是具有萬用字元表達式的有效重新導向範例。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `/docs/<*>`  |  `/documents/<*>`  |  `permanent redirect (301)`  |   | 

下列兩個範例示範使用萬用字元表達式的*無效*重新導向。


****  

| 原始地址 | 目的地地址 | 重新導向類型 | 國家代碼 | 
| --- | --- | --- | --- | 
|  `/docs/<*>/content`  |  `/documents/<*>/content`  |  `permanent redirect (301)`  |   | 
|  `/docs/<*>/content/<*>`  |  `/documents/<*>/content/<*>`  |  `permanent redirect (301)`  |   | 