以下为学习react技术栈开发过程中,遇到的问题以及解决方法总结。各位看官请往下瞧!☆〜(ゝ。∂)
如何进行跨域?
方式一
第一步,执行命令
yarn eject
先将react-scripts的配置释放出来。
第二步,配置config/webpackDevServer.config.js
在config/webpackDevServer.config.js中全局搜索proxy,找到
配置成需要代理的接口配置:
(关于proxy的一些参数的含义和配置的规则,不知道的小伙伴可以到网上查阅一下,这里不做说明。)
配置完成后重启,即可生效。
方式二
第二种方式,不需要执行yarn eject,将react-scripts的配置弹射。
需要安装 http-poxy-middleware依赖。
先执行
yarn add http-poxy-middleware -S
执行完成后,再到src目录下新建文件setupProxy.js
配置为
const {createProxyMiddleware} = require("http-proxy-middleware");
module.exports = function(app){
app.use(
createProxyMiddleware("/api",{
target:"你的接口前缀",
changeOrigin:true,
pathRewrite:{
"^/api":""
}
})
)
}
重启,查看是否生效。
第一种方式是我现在用的,验证过已生效。第二种方式,我没验证过是否生效,但是网上有很多篇文章有说明,故我也写上,待之后亲自验证。