CDN to blame: the first use of OSS in mind to set cross-domain resource sharing (CORS) does not take effect problems

original:

https://www.lastupdate.net/4669.html

Yesterday H5 group developed a feedback problem, says the browser can not receive cross-domain configuration tips: Failed to the Load HTTPS: // nnmjstore.xxx.com / Records / 34e38a6b-0aaf-4bc3-af73-1d9dffcdb6f8_cdhzmj_15: No ' --Control-the Allow Access Origin 'header IS ON Present at The requested Resource Origin.' HTTP: // cdhzmjstore.xxx.com 'IS THEREFORE Access not allowed.

Namely: cdhzmjstore.xxx.com using Ajax (I did not specifically ask guess it might be uploaded files) to access files on nnmjstore.xxx.com failed.

The nnmjstore.xxx.com files are stored in the cloud Ali oss above, I remember already set up cross-domain, and immediately went to check and found no problem. To solve the problem, simply let go of all sources, as follows:

CDN to blame: the first use of OSS in mind to set cross-domain resource sharing (CORS) does not take effect problems

 

But more sad reminder that, or receive the same prompt an error. . .

So he turned the next Ali cloud OSS documents, are summarized as follows:

Same Origin Policy

Cross-domain access, or cross-domain access issues JavaScript, the browser is a limit set for security reasons, that same-origin policy. When A page from the website of JavaScript code wants to access the B site, the browser will reject the visit, because A, B two sites belong to different domains.

In practical applications, there is often a demand for cross-domain access, such as the user's site www.a.com, the back-end using the OSS. Provides the use of JavaScript to achieve upload feature in Web pages, but in this page, you can only send a request to www.a.com, a request is sent to the other sites will be refused browser. This leads users to upload data must transit from www.a.com. If you set up cross-domain access, users can upload directly to OSS from www.a.com without transit.

Cross-Origin Resource Sharing achieve

Cross-domain resource sharing (Cross-Origin Resource Sharing), referred to as CORS, HTML5 provides a standard cross-domain solutions, OSS support CORS standards to achieve cross-domain access. Specific rules may CORS reference the W3C specifications CORS . Its implementation is as follows:

  1. CORS comes Origin of Header by HTTP request to indicate their source domain, such as the example above, the Header Origin is www.a.com.
  2. After the server receives the request, it determines whether the request according to certain rules allowing the source domain. If allowed, the server returns the response will be included with the Access-Control-Allow-Origin this Header, content to allow the views expressed www.a.com cross-domain access. If the server allows all of the cross-domain requests the Access-Control-Allow-Origin Header is set to *,
  3. Browser to determine the cross-domain request is successful, if no additional corresponding Header, the browser will intercept the request based on whether or not to return the corresponding Header. If a non-simple request, the browser will first send an OPTIONS request to the server to get the CORS configuration, the next operation if the server does not support, the browser will intercept the next request.

CORS OSS provides configuration rules to allow or deny the request according to the corresponding cross-domain requirements. The rules are configured in Bucket level. For more information please refer to PutBucketCORS .

Here are a few key points:

  • CORS related Header additional browsers are all done automatically, users do not need any additional operations. CORS operation is meaningful only in a browser environment.
  • Authenticated or not, and OSS is completely independent, that is, the OSS CORS CORS request only rule is used to determine whether additional CORS related to a rule of Header. Whether intercepts the request is completely determined by the browser.
  • When using cross-domain requests need to focus on whether to open a browser Cache function. When running on the same browser page are from two www.a.com and www.b.com are simultaneously request the same cross-domain resource, if www.a.com request to reach the server, the server bring resource Access-Control-Allow-Origin Header is returned to the user as www.a.com. This time www.b.com has launched a request, a request on the browser Cache will be returned to the user, then Header and CORS content requirements do not match, it will lead to subsequent requests fail.

 

Suddenly remembered this time, in order to speed up access, we use Ali cloud CDN service at the front end of the OSS, this is the case, it is possible to cover the OSS CDN settings, that is, cross-domain settings needs to be done on the CDN.

Half past one partner can not find the document, it will not set up, it made a work order inquiry. Super fast response technical engineers, faster than ever, every time, and tell the method, and I guess really the same.

In CDN console, found nnmjstore.xxx.com, set points - "Cache-Control -" Set HTTP, add an HTTP header, parameters Access-Control-Allow-Origin, is *, can be, as shown below:

CDN to blame: the first use of OSS in mind to set cross-domain resource sharing (CORS) does not take effect problems

 

After adding the entry into force, after testing, problem solved!

 

Guess you like

Origin www.cnblogs.com/itfat/p/11351070.html