Skip to content

Commit

Permalink
2024/07/26 時点の英語版に基づき更新
Browse files Browse the repository at this point in the history
  • Loading branch information
mfuji09 committed Oct 14, 2024
1 parent ea0b454 commit a6eced5
Show file tree
Hide file tree
Showing 4 changed files with 53 additions and 31 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
title: "Reason: CORS header 'Access-Control-Allow-Origin' does not match 'xyz'"
slug: Web/HTTP/CORS/Errors/CORSAllowOriginNotMatchingOrigin
l10n:
sourceCommit: 45c7ae13178203b4ee58842efbe2a27deab274a6
sourceCommit: ef46a4ac6bfec3e33c9209244e7cb1a9206165d6
---

{{HTTPSidebar}}
Expand All @@ -13,7 +13,7 @@ l10n:
Reason: CORS header 'Access-Control-Allow-Origin' does not match 'xyz'
```

## 何が悪いのか
## エラーの原因

リクエストを作成しているオリジンが、 {{HTTPHeader("Access-Control-Allow-Origin")}} ヘッダーによって許可されたオリジンのいずれにも一致しないことを表します。このエラーは、レスポンスに複数の `Access-Control-Allow-Origin` ヘッダーが含まれていると発生することがあります。

Expand All @@ -24,13 +24,13 @@ Reason: CORS header 'Access-Control-Allow-Origin' does not match 'xyz'
> [!WARNING]
> オリジンの一部として HTTPS または HTTP プロトコルを記載する必要があります。
```
```apacheconf
Header set Access-Control-Allow-Origin 'origin'
```

Nginx では、このヘッダーを設定するコマンドは次の通りです。

```
```nginx
add_header 'Access-Control-Allow-Origin' 'origin'
```

Expand All @@ -39,4 +39,4 @@ add_header 'Access-Control-Allow-Origin' 'origin'
- [CORS のエラー](/ja/docs/Web/HTTP/CORS/Errors)
- 用語集: {{Glossary("CORS")}}
- [CORS 入門](/ja/docs/Web/HTTP/CORS)
- [Enable CORS: I want to add CORS support to my server](https://enable-cors.org/server.html)
- [CORS の有効化: CORS 対応をサーバーに追加したい](https://enable-cors.org/server.html)(英語)
15 changes: 9 additions & 6 deletions files/ja/web/http/cors/errors/corsmethodnotfound/index.md
Original file line number Diff line number Diff line change
@@ -1,31 +1,34 @@
---
title: "Reason: Did not find method in CORS header Access-Control-Allow-Methods"
title: "Reason: Did not find method in CORS header 'Access-Control-Allow-Methods'"
slug: Web/HTTP/CORS/Errors/CORSMethodNotFound
l10n:
sourceCommit: ef46a4ac6bfec3e33c9209244e7cb1a9206165d6
---

{{HTTPSidebar}}

## 理由

```
Reason: Did not find method in CORS header Access-Control-Allow-Methods
```plain
Reason: Did not find method in CORS header 'Access-Control-Allow-Methods'
```

## 何が悪いのか
## エラーの原因

{{Glossary("CORS")}} リクエストで使われている HTTP メソッドが、レスポンスの {{HTTPHeader("Access-Control-Allow-Methods")}} ヘッダーで指定されたメソッドの一覧に含まれていません。このヘッダーは、 CORS を使用してリクエストで指定された URL にアクセスする時に使われる HTTP メソッドのコンマ区切りのリストを指定します。リクエストが他のメソッドを使用していると、このエラーが発生します。

例えば、レスポンスに以下の行が含まれていると、

```
```http
Access-Control-Allow-Methods: GET,HEAD,POST
```

{{HTTPMethod("PUT")}} リクエストを使おうとすると、リクエストが失敗し、このエラーが発生します。

コードからサービスにアクセスするときは、許可された HTTP メソッドのみを使用するように確認してください。

**メモ:** サーバーが `Access-Control-Allow-methods` ヘッダーに理解できない又は未定義のメソッド名を含めた場合、別なエラー [`Reason: invalid token ‘xyz' in CORS header ‘Access-Control-Allow-Methods’`](/ja/docs/Web/HTTP/CORS/Errors/CORSInvalidAllowMethod) が発生します。
> [!NOTE]
> サーバーが `Access-Control-Allow-methods` ヘッダーに理解できないまたは未定義のメソッド名を含めた場合、別なエラー [Reason: invalid token 'xyz' in CORS header 'Access-Control-Allow-Methods'](/ja/docs/Web/HTTP/CORS/Errors/CORSInvalidAllowMethod) が発生します。
## 関連情報

Expand Down
30 changes: 19 additions & 11 deletions files/ja/web/http/cors/errors/corsmissingalloworigin/index.md
Original file line number Diff line number Diff line change
@@ -1,29 +1,31 @@
---
title: "Reason: CORS header 'Access-Control-Allow-Origin' missing"
slug: Web/HTTP/CORS/Errors/CORSMissingAllowOrigin
l10n:
sourceCommit: ef46a4ac6bfec3e33c9209244e7cb1a9206165d6
---

{{HTTPSidebar}}

## 理由

```
```plain
Reason: CORS header 'Access-Control-Allow-Origin' missing
```

## 何が悪いのか
## エラーの原因

{{Glossary("CORS")}} リクエストへのレスポンスが、リソースが現在のオリジン内で操作しているコンテンツによってアクセスできるかどうかを判断するために使われる、必須の {{HTTPHeader("Access-Control-Allow-Origin")}} ヘッダーを欠いています。

サーバーを自分で制御できる場合は、要求しているサイトのオリジンを `Access-Control-Allow-Origin` ヘッダーの値に追加して、アクセスが許可されているドメインの一覧に追加してください。
サーバーを自分で制御できる場合は、リクエストしているサイトのオリジンを `Access-Control-Allow-Origin` ヘッダーの値に追加して、アクセスが許可されているドメインの一覧に追加してください。

例えば、 `https://example.com` のサイトが CORS を使用したリソースにアクセスできるよう許可するためには、ヘッダーを以下のようにしてください。
例えば、`https://example.com` のサイトが CORS を使用したリソースにアクセスできるよう許可するためには、ヘッダーを以下のようにしてください。

```http
Access-Control-Allow-Origin: https://example.com
```

`*` を使用することで、あらゆるサイトにアクセスを許可するようサイトを構成することもできます。これは公開 API にのみ使用してください。非公開の API には `*` を使用するべきではなく、代わりに具体的なドメインやドメインの一覧を設定してください。加えて、ワイルドカードは [`crossorigin`](/ja/docs/Web/HTML/Attributes/crossorigin) 属性が `anonymous` に設定された要求にのみ動作し、リクエストでは Cookie のような資格情報の送信を抑制します。
`*` ワイルドカードを使用することで、あらゆるサイトにアクセスを許可するようサイトを構成することもできます。これは公開 API にのみ使用してください。非公開の API には `*` を使用するべきではなく、代わりに具体的なドメインやドメインの一覧を設定してください。加えて、ワイルドカードは [`crossorigin`](/ja/docs/Web/HTML/Attributes/crossorigin) 属性が `anonymous` に設定されたリクエストにのみ動作し、リクエストでは Cookie のような資格情報の送信を抑制します。

```http
Access-Control-Allow-Origin: *
Expand All @@ -34,16 +36,22 @@ Access-Control-Allow-Origin: *
何らかのサイトが CORS リクエストを `*` ワイルドカードを使用すること*なく* (たとえば資格情報を有効にする場合) 利用できるようにするには、サーバーにリクエストの `Origin` ヘッダーの値を読み取り、その値を `Access-Control-Allow-Origin` に設定することに加えて、一部のヘッダーがオリジンに応じて動的に設定されることを示すために `Vary: Origin` ヘッダーを設定する必要があります。

例えば Apache では、サーバー構成 (の中の `<Directory>`, `<Location>`, `<Files>`, `<VirtualHost>` のうち適切な節) に次のような行を追加してください。構成はふつう、 `.conf` ファイル又は (一般的な名前は `httpd.conf``apache.conf`) 又は `.htaccess` ファイルにあります。
## 一般的なウェブサーバーでの例

```
Header set Access-Control-Allow-Origin 'origin-list'
```
ウェブサーバーによって、ヘッダーを設定するための正確なディレクティブは異なります。

Nginx では、このヘッダーを設定するコマンドは次の通りです。
下記の例では、

**Apache**[ドキュメントはこちら](https://httpd.apache.org/docs/2.4/mod/mod_headers.html#header))では、サーバー構成(適切な `<Directory>`, `<Location>`, `<Files>`, `<VirtualHost>` 節内)に以下の行を追加します。構成は通常、`.conf` ファイル(一般的な名前は `httpd.conf``apache.conf` です)または `.htaccess` ファイルにあります。

```apacheconf
Header set Access-Control-Allow-Origin 'https://example.com'
```
add_header 'Access-Control-Allow-Origin' 'origin-list'

**Nginx**[ドキュメントはこちら](https://nginx.org/en/docs/http/ngx_http_headers_module.html#add_header))では、このヘッダーをセットアップするコマンドは次の通りです。

```nginx
add_header 'Access-Control-Allow-Origin' 'https://example.com' always;
```

## 関連情報
Expand Down
29 changes: 20 additions & 9 deletions files/ja/web/http/cors/errors/corsrequestnothttp/index.md
Original file line number Diff line number Diff line change
@@ -1,31 +1,42 @@
---
title: "Reason: CORS request not HTTP"
slug: Web/HTTP/CORS/Errors/CORSRequestNotHttp
l10n:
sourceCommit: ef46a4ac6bfec3e33c9209244e7cb1a9206165d6
---

{{HTTPSidebar}}

## 理由

```
```plain
Reason: CORS request not HTTP
```

## 何が悪いのか
## エラーの原因

{{Glossary("CORS")}} リクエストは URL スキームが HTTPS の場合のみ利用できますが、リクエストで指定された URL が異なる種類のものです。
これは、ローカルファイルを指定する URL が、 `file:///` スキームを使用している場合によく起こります。

この問題を修正するには、CORS が関わるリクエスト、例えば {{domxref("Window/fetch", "fetch()")}}、{{domxref("XMLHttpRequest")}}、ウェブフォント (`@font-face`)、[WebGL textures](/ja/docs/Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL)、XSL スタイルシートなどを発行させるには、必ず HTTPS の URL を使用してください。

{{Glossary("CORS")}} リクエストは URL スキームが HTTPS の場合のみ利用できますが、リクエストで指定された URL が異なる種類のものです。これは、ローカルファイルを指定する URL が、 `file:///` の URL を使用している場合によく起こります。
### ローカルファイルの読み込み

この問題を修正するには、単純に CORS に関するリクエストを発行する際に HTTPS の URL を使用するようにしてください。
同じディレクトリーおよびサブディレクトリーにあるローカルファイルは、以前は[同一オリジン](/ja/docs/Web/Security/Same-origin_policy)から取得されたものとして扱われていました。
つまり、テスト中にファイルとそのリソースすべてを、CORS エラーが発生することなく、ローカルディレクトリ-またはサブディレクトリ-から読み込むことができたということです。

### Firefox 68 におけるローカルファイルセキュリティ
残念ながら、この問題にはセキュリティ上の問題があり、勧告([CVE-2019-11730](https://www.mozilla.org/en-US/security/advisories/mfsa2019-21/#CVE-2019-11730))で指摘されています。
Firefox や Chrome を含む多くのブラウザーは現在、(既定では)すべてのローカルファイルを不透明なオリジンとして扱います。
その結果、ローカルリソースが含まれたローカルファイルを読み込むと、CORS エラーが発生します。

Firefox 67 以前ではユーザが `file:///` URI を用いてページを開いたとき、ページのオリジンはその開かれたページのあるディレクトリとして定義されていました。同じディレクトリやそのサブディレクトリにあるリソースは、CORS 同一オリジンルールを適用する際には同一オリジンとみなされていました。
テストをローカルで実行する必要がある開発者は、[ローカルサーバーを構築する](/ja/docs/Learn/Common_questions/Tools_and_setup/set_up_a_local_testing_server)必要がでてきました。
すべてのファイルが同じスキームとドメイン (`localhost`) から提供されるため、すべて同じオリジンを持ち、オリジン間エラーは発生しません。

Firefox 68 以降では [CVE-2019-11730](https://www.mozilla.org/en-US/security/advisories/mfsa2019-21/#CVE-2019-11730) の対策として、 `file:///` URI を用いて開かれたページのオリジンは、それだけのものとして定義されます。つまり、同じディレクトリやそのサブディレクトリにあるリソースは、CORS 同一オリジンルールを満たさなくなりました。この新たな振る舞いは、`privacy.file_unique_origin` 設定を用いてデフォルトで有効になっています。
> [!NOTE]
> この変更は、[URL 仕様](https://url.spec.whatwg.org/#origin)と一致しており、ファイルのオリジンの動作は実装に委ねられますが、疑わしい場合はファイルのオリジンは不透明として扱うことが推奨されています。
## 関連情報

- [CORS のエラー](/ja/docs/Web/HTTP/CORS/Errors)
- 用語集: {{Glossary("CORS")}}
- [CORS 入門](/ja/docs/Web/HTTP/CORS)
- [URL とは](/ja/docs/Learn/Common_questions/What_is_a_URL)
- [URL とは](/ja/docs/Learn/Common_questions/Web_mechanics/What_is_a_URL)

0 comments on commit a6eced5

Please sign in to comment.