Egg.js跨域訪問需使用egg-cors插件,典型的應(yīng)用場景是前后端分離的項目中,前端與后臺在不同的域下,此時若前端通過AJAX訪問后端接口,此時就首先解決跨域問題。
安裝egg-cors插件
$ npm i -S egg-cors
開啟egg-cors插件
$ vim config/plugin.js
module.exports = {
cors:{enable:true, package:"egg-cors"}
}
配置跨域參數(shù)
$ vim config/config.default.js
//cors
config.cors = {
origin:"*",
allowMethods:"GET, HEAD, PUT, POST, DELETE, PATCH",
credentials:true
};
| 配置 | 描述 |
|---|---|
| orgin | 允許請求的來源,為*表示允許所有IP的請求。 |
| allowMethods | 允許請求的方式 |
| credentials | - |
egg-cors在Egg框架內(nèi)部與egg-security插件協(xié)同工作,通過在配置對象安全性上定義domainWhiteList白名單域?qū)傩?,當從客戶端發(fā)出請求時,Egg框架會返回包含Access-Control-Allow-Origin的響應(yīng)頭,其中會包括傳入的域、負載、狀態(tài)碼。
$ vim config/config.default.js
config.security = {
domainWhiteList:["*"]
};
egg-cors插件配置origin選項后,egg-cors插件會在響應(yīng)頭中添加Access-Control-Allow-Origin字段以設(shè)置訪問控制所允許的來源,同時會排除白名單security.domainWhiteList選項中設(shè)置的域名。
當前端發(fā)送AJAX請求時,需在請求頭中添加
header:{'Access-Control-Allow-Origin':'*'}