以下為學習react技術棧開發(fā)過程中,遇到的問題以及解決方法總結眯停。各位看官請往下瞧!☆?(ゝ涩嚣。?)
如何進行跨域伦忠?
方式一
第一步省核,執(zhí)行命令
yarn eject
先將react-scripts的配置釋放出來。
第二步昆码,配置config/webpackDevServer.config.js
在config/webpackDevServer.config.js中全局搜索proxy气忠,找到
配置成需要代理的接口配置:
(關于proxy的一些參數(shù)的含義和配置的規(guī)則,不知道的小伙伴可以到網(wǎng)上查閱一下赋咽,這里不做說明旧噪。)
配置完成后重啟,即可生效冬耿。
方式二
第二種方式,不需要執(zhí)行yarn eject萌壳,將react-scripts的配置彈射亦镶。
需要安裝 http-poxy-middleware依賴日月。
先執(zhí)行
yarn add http-poxy-middleware -S
執(zhí)行完成后,再到src目錄下新建文件setupProxy.js
配置為
const {createProxyMiddleware} = require("http-proxy-middleware");
module.exports = function(app){
app.use(
createProxyMiddleware("/api",{
target:"你的接口前綴",
changeOrigin:true,
pathRewrite:{
"^/api":""
}
})
)
}
重啟缤骨,查看是否生效爱咬。
第一種方式是我現(xiàn)在用的,驗證過已生效绊起。第二種方式精拟,我沒驗證過是否生效,但是網(wǎng)上有很多篇文章有說明虱歪,故我也寫上蜂绎,待之后親自驗證。