blocked by cors policy about CORS-RFC1918

問題描述 CORS

has been blocked by cors policy 
the request client is not a secure context 
and resource is in more-private address space private

解決方案

同源策略Same-origin policy禁止浏览器跨域访问,解决方法有CORS和JSONP 两种。CORS:Cross-origin resource sharing,用于让网页的受限资源能够被其他域名的页面访问的一种机制。有关Chrome浏览器,跨域调用JS的问题。

跨域资源共享(CORS)是 JSONP 模式的现代版。与 JSONP 不同,CORS 除了 GET 请求方法以外也支持其他的 HTTP 请求。用 CORS 可以让网页设计师用一般的 XMLHttpRequest,这种方式的错误处理比 JSONP 要来的好。另一方面,JSONP 可以在不支持 CORS 的老旧浏览器上运作。现代的浏览器都支持 CORS[12]。

升級服務器端

Update 2021: A few months after I posted this question, 
the flag I referenced in my original answer was removed, 
and instead of disabling a security feature 
I was forced to solve the problem more satisfactorily.

Private Network Access (formerly CORS-RFC1918) is 
a specification that forbids requests 
from less private network resources to more private network resources. 
Like HTTP to HTTPS, or a remote host to localhost.

The ultimate solution was to add a self-signed certificate, 
and Access-Control-* headers, 
which enabled requests from my remote dev server 
to my localhost webpack-dev-server for assets.
conf.https = {
          
   
  key: readFileSync(./.ssl/cert.key),
  cert: readFileSync(./.ssl/cert.crt),
  cacert: readFileSync(./.ssl/ca.crt),
}

conf.headers = {
          
   
  Access-Control-Allow-Private-Network: true,
  Access-Control-Allow-Origin: *,
}

屏蔽客戶端設置

chrome://flags/#block-insecure-private-network-requests

chrome插件Allow-Control-Allow-Origin

临时解决办法,通过安装插件Allow-Control-Allow-Origin,打开开关即可。

CORS-RFC1918

Private Network Access (formerly known as CORS-RFC1918) 
restricts the ability of websites to send requests to servers on private networks. 
It allows such requests only from secure contexts. 
The specification also extends the Cross-Origin Resource Sharing (CORS) protocol 
so that websites now have to explicitly request a grant from servers on private networks 
before being allowed to send arbitrary requests.

其它的解決方案

【https://wicg.github.io/private-network-access/】,通過在MegaCorp 設置上做代理和控制。僅供參考,沒有驗證,希望有能力的同行來補充。

[^1] [^2] [^3] [^4] https://junyiseo.com/qita/792.html [^5]

经验分享 程序员 微信小程序 职场和发展