CORS = Cross origin resource sharing 是跨域分享共享
當我們deploy Ionic 到 Android 或 IOS 是不會有CORS的問題. 但是如果在 development mode 使用 ionic serve
訪問遠端的API就會遇到下面的問題
XMLHttpRequest cannot load http://api.ionic.com/endpoint.
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://localhost:8100' is therefore not allowed access.
通常如果你有權限更改遠端Server的話, 可以設定接受任何來源的請求, 但是當你使用第三方的API,就要另尋他法.
這裡我提供的方法是更改IONIC端的設定.
首先在IONIC的Root 資料夾建立proxy.conf.json
. 裡面的內容:
{
"/endpoint": {
"target": "http://api.ionic.com",
"changeOrigin": true,
"secure": false,
"logLevel": "debug"
}
}
接著在http request 使用相對應的 path
return this.http.get("/endpoint");
最後使用 ionic serve -- --proxy-config proxy.conf.json
開啟本地的伺服器.
以下連結提供更詳細的Angular代理配置
https://juejin.im/post/5d36fe605188255b5620a648