問題:
- 前端請求后端接口出現(xiàn)一下錯誤:
Access to XMLHttpRequest at 'http://6ojq5pvhj0.lb.c1.bhs5.k8s.ovh.net/v1/country_tag/list?page=1&per_page=10' from origin 'http://6ojq416oks.lb.c1.bhs5.k8s.ovh.net' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
- 這是一個跨域訪問問題井厌,可以在后端解決也可以在前端處理,這里就只介紹一下前端處理的方式之一
解決方式之一:
- 在項(xiàng)目根目錄下創(chuàng)建一個json文件器赞,名字自定,例如:proxy.conf.json 墓拜,新增內(nèi)容:
{
"/sso": {
"target": "https://api.gofaster.space",
"secure": false,
"logLevel": "debug",
"changeOrigin": true
}
}
這里的 “/sso” 是后端API子路徑匾浪,target 為 API 域名。
- 在 package.json 文件中修改啟動指令:
"scripts": {
"ng": "ng",
"start": "ng serve --dev --proxy-config proxy.conf.json",
...
},
這里是新增啟動參數(shù) --proxy-config存和,指定為剛剛創(chuàng)建的文件肃晚。這里使用代理文件配置的代理啟動纷责。
說明:
如果原先你需要訪問http://abc.ff:8080/sso/server獲取服務(wù)臣樱,那么現(xiàn)在你只需要把代碼中的“10.4.60.200:8080”改為“l(fā)ocalhost:4200”即可(cli默認(rèn)端口為4200靶擦,根據(jù)自己的啟動端口編寫)雇毫。