react axios 跨域问题
Posted 鹿
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了react axios 跨域问题相关的知识,希望对你有一定的参考价值。
周末又是补充知识点的时候了,用了react axios 跨越问题,貌似是要比vue 稍微麻烦一点
它请求http好像是没有问题的,但是https还是有跨域问题的,
我用的刚好是create-react-app 这个搭建的react 项目,你必须要确保 运行了npm run eject,
把你的webpack暴露出来,好了接着在 package.json 配置下面这段话:
当然是在末尾加入就行了
"proxy": { "/*": { "target": "https://douban.uieee.com", "changeOrigin": true } }
这样还没有解决跨越问题,还必须在axios 文件创建请求判断:
import axios from ‘axios‘ let baseUrl = ‘https://douban.uieee.com‘; if (process.env.NODE_ENV === ‘development‘) { baseUrl = ‘http://localhost:3000‘; } else { // baseUrl = ‘http://localhost:3000‘; } // export const baseUrl = ‘http://localhost:3000‘; let $axios = axios.create({ baseURL: baseUrl + ‘/v2/movie‘, timeout: 10000, responseType: ‘json‘, headers: { ‘Content-Type‘: ‘application/x-www-form-urlencoded; charset=utf-8‘, } });
我是结合Promise 请求数据的这样你就可以在解决跨区问题了,正式环境就配置正式的环境。
好了 ,7月了, 希望7月对我好点,继续加油!
以上是关于react axios 跨域问题的主要内容,如果未能解决你的问题,请参考以下文章
React axios 使用 http-proxy-middleware 解决跨域问题小记
ReactAjax 相关 - axios - 配置代理解决跨域问题 -消息订阅/发布机制 - PubSubJS - Fetch - github用户搜索案例