diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:43:23 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:43:23 -0500 |
commit | 218934fa2ed1c702a6d3923d2aa2cc6b43c48684 (patch) | |
tree | a9ef8ac1e1b8fe4207b6d64d3841bfb8990b6fd0 /files/zh-tw/web/http/cors/errors | |
parent | 074785cea106179cb3305637055ab0a009ca74f2 (diff) | |
download | translated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.tar.gz translated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.tar.bz2 translated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.zip |
initial commit
Diffstat (limited to 'files/zh-tw/web/http/cors/errors')
4 files changed, 178 insertions, 0 deletions
diff --git a/files/zh-tw/web/http/cors/errors/corsdidnotsucceed/index.html b/files/zh-tw/web/http/cors/errors/corsdidnotsucceed/index.html new file mode 100644 index 0000000000..b265a0ca1c --- /dev/null +++ b/files/zh-tw/web/http/cors/errors/corsdidnotsucceed/index.html @@ -0,0 +1,22 @@ +--- +title: 原因:CORS 請求未成功 +slug: Web/HTTP/CORS/Errors/CORSDidNotSucceed +translation_of: Web/HTTP/CORS/Errors/CORSDidNotSucceed +--- +<div>{{HTTPSidebar}}</div> + +<h2 id="原因">原因</h2> + +<pre class="syntaxbox">Reason: CORS request did not succeed</pre> + +<h2 id="哪邊出錯了?">哪邊出錯了?</h2> + +<p>使用 CORS 的 {{Glossary("HTTP")}} 請求失敗,因為 HTTP 連線在網路或協定層級失敗。這個錯誤和 CORS 沒有直接關係,but is a fundamental network error of some kind.</p> + +<h2 id="參見">參見</h2> + +<ul> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors">CORS errors</a></li> + <li>Glossary: {{Glossary("CORS")}}</li> + <li><a href="/en-US/docs/Web/HTTP/CORS">CORS introduction</a></li> +</ul> diff --git a/files/zh-tw/web/http/cors/errors/corsmissingalloworigin/index.html b/files/zh-tw/web/http/cors/errors/corsmissingalloworigin/index.html new file mode 100644 index 0000000000..fde9e0e0bd --- /dev/null +++ b/files/zh-tw/web/http/cors/errors/corsmissingalloworigin/index.html @@ -0,0 +1,48 @@ +--- +title: 原因:缺少 CORS 標頭 'Access-Control-Allow-Origin' +slug: Web/HTTP/CORS/Errors/CORSMissingAllowOrigin +translation_of: Web/HTTP/CORS/Errors/CORSMissingAllowOrigin +--- +<div>{{HTTPSidebar}}</div> + +<h2 id="原因">原因</h2> + +<pre class="syntaxbox">Reason: CORS header 'Access-Control-Allow-Origin' missing</pre> + +<h2 id="What_went_wrong">What went wrong?</h2> + +<p>The response to the {{Glossary("CORS")}} request is missing the required {{HTTPHeader("Access-Control-Allow-Origin")}} header, which is used to determine whether or not the resource can be accessed by content operating within the current origin.</p> + +<p>If the server is under your control, add the origin of the requesting site to the set of domains permitted access by adding it to the <code>Access-Control-Allow-Origin</code> header's value.</p> + +<p>For example, to allow a site at https://amazing.site to access the resource using CORS, the header should be:</p> + +<pre>Access-Control-Allow-Origin: https://amazing.site</pre> + +<p>You can also configure a site to allow any site to access it by using the <code>"*"</code> wildcard. You should only use this for public APIs. Private APIs should never use <code>"*"</code>, and should instead have a specific domain or domains set. In addition, the wildcard only works for requests made with the {{htmlattrxref("crossorigin")}} attribute set to <code>"anonymous"</code>.</p> + +<pre>Access-Control-Allow-Origin: *</pre> + +<div class="warning"> +<p><strong>Warning:</strong> Using the wildcard to allow all sites to access a private API is a bad idea for what should be obvious reasons.</p> +</div> + +<p> </p> + +<p>For example, in Apache, add a line such as the following to the server's configuration (within the appropriate <code><Directory></code>, <code><Location></code>, <code><Files></code>, or <code><VirtualHost></code> section). The configuration is typically found in a <code>.conf</code> file (<code>httpd.conf</code> and <code>apache.conf</code> are common names for these), or in an <code>.htaccess</code> file.</p> + +<pre>Header set Access-Control-Allow-Origin '<em>origin-list</em>'</pre> + +<p>For Nginx, the command to set up this header is:</p> + +<pre>add_header 'Access-Control-Allow-Origin' '<em>origin-list</em>'</pre> + +<p> </p> + +<h2 id="參見">參見</h2> + +<ul> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors">CORS errors</a></li> + <li>Glossary: {{Glossary("CORS")}}</li> + <li><a href="/en-US/docs/Web/HTTP/CORS">CORS introduction</a></li> +</ul> diff --git a/files/zh-tw/web/http/cors/errors/corsnotsupportingcredentials/index.html b/files/zh-tw/web/http/cors/errors/corsnotsupportingcredentials/index.html new file mode 100644 index 0000000000..8c971d93f5 --- /dev/null +++ b/files/zh-tw/web/http/cors/errors/corsnotsupportingcredentials/index.html @@ -0,0 +1,32 @@ +--- +title: 原因:CORS 'Access-Control-Allow-Origin' 設定為「*」時不支援使用帳號密碼 +slug: Web/HTTP/CORS/Errors/CORSNotSupportingCredentials +translation_of: Web/HTTP/CORS/Errors/CORSNotSupportingCredentials +--- +<div>{{HTTPSidebar}}</div> + +<h2 id="原因">原因</h2> + +<pre class="syntaxbox">Reason: Credential is not supported if the CORS header ‘Access-Control-Allow-Origin’ is ‘*’</pre> + +<h2 id="What_went_wrong">What went wrong?</h2> + +<p>The {{Glossary("CORS")}} request was attempted with the credentials flag set, but the server is configured using the wildcard (<code>"*"</code>) as the value of {{HTTPHeader("Access-Control-Allow-Origin")}}, which doesn't allow the use of credentials.</p> + +<p>To correct this problem on the client side, simply ensure that the credentials flag's value is <code>false</code> when issuing your CORS request.</p> + +<ul> + <li>If the request is being issued using {{domxref("XMLHttpRequest")}}, make sure you're not setting {{domxref("XMLHttpRequest.withCredentials", "withCredentials")}} to <code>true</code>.</li> + <li>If using <a href="/en-US/docs/Web/API/Server-sent_events">Server-sent events</a>, make sure {{domxref("EventSource.withCredentials")}} is <code>false</code> (it's the default value).</li> + <li>If using the <a href="/en-US/docs/Web/API/Fetch_API">Fetch API</a>, make sure {{domxref("Request.credentials")}} is <code>"omit"</code>.</li> +</ul> + +<p>If, instead, you need to adjust the server's behavior, you'll need to change the value of <code>Access-Control-Allow-Origin</code> to grant access to the origin from which the client is loaded.</p> + +<h2 id="參見">參見</h2> + +<ul> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors">CORS errors</a></li> + <li>Glossary: {{Glossary("CORS")}}</li> + <li><a href="/en-US/docs/Web/HTTP/CORS">CORS introduction</a></li> +</ul> diff --git a/files/zh-tw/web/http/cors/errors/index.html b/files/zh-tw/web/http/cors/errors/index.html new file mode 100644 index 0000000000..d1dd12dc75 --- /dev/null +++ b/files/zh-tw/web/http/cors/errors/index.html @@ -0,0 +1,76 @@ +--- +title: CORS errors +slug: Web/HTTP/CORS/Errors +tags: + - CORS + - Errors + - HTTP + - HTTPS + - Messages + - NeedsTranslation + - Same-origin + - Security + - TopicStub + - console + - troubleshooting +translation_of: Web/HTTP/CORS/Errors +--- +<div>{{HTTPSidebar}}</div> + +<p><span class="seoSummary"><a href="/en-US/docs/Web/HTTP/CORS">Cross-Origin Resource Sharing</a> ({{Glossary("CORS")}}) is a standard that allows a server to relax the <a href="/en-US/docs/Web/Security/Same-origin_policy">same-origin policy</a>. This is used to explicitly allow some cross-origin requests while rejecting others.</span> For example, if a site offers an embeddable service, it may be necessary to relax certain restrictions. Setting up such a CORS configuration isn't necessarily easy and may present some challenges. In these pages, we'll look into some common CORS error messages and how to resolve them.</p> + +<p>If the CORS configuration isn't setup correctly, the browser console will present an error like <code>"Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at $somesite"</code> indicating that the request was blocked due to violating the CORS security rules. This might not necessarily be a set-up mistake, though. It's possible that the request is in fact intentionally being disallowed by the user's web application and remote external service. However, If the endpoint is meant to be available, some debugging is needed to succeed.</p> + +<h2 id="Identifying_the_issue">Identifying the issue</h2> + +<p>To understand the underlying issue with the CORS configuration, you need to find out which request is at fault and why. These steps may help you do so:</p> + +<ol> + <li>Navigate to the web site or web app in question and open the <a href="/en-US/docs/Tools">Developer Tools</a>.</li> + <li>Now try to reproduce the failing transaction and check the <a href="/en-US/docs/Tools/Web_Console">console</a> if you are seeing a CORS violation error message. It will probably look like this:</li> +</ol> + +<p><img alt="Firefox console showing CORS error" src="https://mdn.mozillademos.org/files/16050/cors-error2.png"></p> + +<p>The text of the error message will be something similar to the following:</p> + +<pre>Cross<span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">-Origin Request Blocked: The Same Origin Policy disallows +reading the remote resource at <em>https://some-url-here</em>. (<em>Reason: +additional information here</em>).</span></span></span></pre> + +<div class="note"> +<p><span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body"><strong>Note:</strong> For security reasons, specifics about what went wrong with a CORS request <em>are not available to JavaScript code</em>. All the code knows is that an error occurred. The only way to determine what specifically went wrong is to look at the browser's console for details.</span></span></span></p> +</div> + +<h2 id="CORS_error_messages">CORS error messages</h2> + +<p>Firefox's console displays messages in its console when requests fail due to CORS. Part of the error text is a "reason" message that provides added insight into what went wrong. The reason messages are listed below; click the message to open an article explaining the error in more detail and offering possible solutions.</p> + +<ul> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSDisabled">Reason: CORS disabled</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSDidNotSucceed">Reason: CORS request did not succeed</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSOriginHeaderNotAdded">Reason: CORS header ‘Origin’ cannot be added</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSExternalRedirectNotAllowed">Reason: CORS request external redirect not allowed</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSRequestNotHttp">Reason: CORS request not http</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSMissingAllowOrigin">Reason: CORS header ‘Access-Control-Allow-Origin’ missing</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSAllowOriginNotMatchingOrigin">Reason: CORS header ‘Access-Control-Allow-Origin’ does not match ‘xyz’</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSNotSupportingCredentials">Reason: Credential is not supported if the CORS header ‘Access-Control-Allow-Origin’ is ‘*’</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSMethodNotFound">Reason: Did not find method in CORS header ‘Access-Control-Allow-Methods’</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSMissingAllowCredentials">Reason: expected ‘true’ in CORS header ‘Access-Control-Allow-Credentials’</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSPreflightDidNotSucceed">Reason: CORS preflight channel did not succeed</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSInvalidAllowMethod">Reason: invalid token ‘xyz’ in CORS header ‘Access-Control-Allow-Methods’</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSInvalidAllowHeader">Reason: invalid token ‘xyz’ in CORS header ‘Access-Control-Allow-Headers’</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSMissingAllowHeaderFromPreflight">Reason: missing token ‘xyz’ in CORS header ‘Access-Control-Allow-Headers’ from CORS preflight channel</a></li> + <li><a href="/en-US/docs/Web/HTTP/CORS/Errors/CORSMultipleAllowOriginNotAllowed">Reason: Multiple CORS header ‘Access-Control-Allow-Origin’ not allowed</a></li> +</ul> + +<h2 id="See_also">See also</h2> + +<ul> + <li>Glossary: {{Glossary("CORS")}}</li> + <li><a href="/en-US/docs/Web/HTTP/CORS">CORS introduction</a></li> + <li><a href="/en-US/docs/Web/HTTP/Server-Side_Access_Control">Server-side CORS settings</a></li> + <li><a href="/en-US/docs/Web/HTML/CORS_enabled_image">CORS enabled image</a></li> + <li><a href="/en-US/docs/Web/HTML/CORS_settings_attributes">CORS settings attributes</a></li> + <li><a href="https://www.test-cors.org">https://www.test-cors.org</a> – page to test CORS requests</li> +</ul> |