Flutter Web CORS
- CORS 相关概念
- 协议请求跨域问题
- App2Web
- CodingApp
CORS 相关概念
关于 CORS
概念,可参考 mozilla 的相关文档资料:
- Cross-Origin Resource Sharing (CORS)
- Reason: CORS header ‘Access-Control-Allow-Origin’ missing
An example of a cross-origin request: the front-end JavaScript code served from https://domain-a.com
uses XMLHttpRequest
to make a request for https://domain-b.com/data.json
.
For security reasons, browsers restrict cross-origin HTTP requests initiated from scripts. For example, XMLHttpRequest
and the Fetch API follow the same-origin policy. This means that a web application using those APIs can only request resources from the same origin the application was loaded from unless the response from other origins includes the right CORS headers.
The CORS mechanism supports secure cross-origin requests and data transfers between browsers and servers. Modern browsers use CORS in APIs such as XMLHttpRequest
or Fetch to mitigate the risks of cross-origin HTTP requests.
相关 issues 讨论:
- #43809 - [web] How to start a ‘normal’ Chrome instance? Chrome extensions are needed for development
- #46904 - Disable Origin Policy CORS in Flutter web
- stackoverflow - solve flutter web api cors error
协议请求跨域问题
App2Web
在将App改造适配Web实验时,执行 flutter run -d chrome
启动 Chrome 访问调试 flutter web app,首页 localhost 域请求 coding.net 域名下的 access 协议
- https://coding.net/api/access/json
- https://coding.net/api/access/pb
报 CORS 错误:
CodingApp
在调试基于 FlutterWeb 的 CodingApp 时,本地启动 web server,在Chrome打开形如 http://localhost:51362
的 url 链接访问首页;桌面端Google Chrome浏览器、手机端MOA开启远程办公和内网IP访问、内网域名解析之后,通过IP链接( http://10.20.89.64/ )访问首页。
但是,从首页 Origin(localhost 或 10.20.89.64)向 Host(xxx.coding.net)发起协议请求,存在 CORS 跨域问题。
首页一直刷新中:
IP访问报错 CORS error:
首页拉取 我关注的流水线 报错 CORS error: