前端之Vue使用axios跨域正确配置

小咪咪 2022-05-23 09:18 256阅读 0赞

## 组件代码 ##

<script> export default { name: 'App', methods: { getData() { this.$http.get('/api/emojis').then(function (res) { console.log(res) }) } }, mounted(){ this.getData() } } </script>

## proxyTable（config/index.js） ##

dev: {
        // Paths
        assetsSubDirectory: 'static',
        assetsPublicPath: '/',
        proxyTable: {
    
          '/api': {
            target: 'https://www.github.com',
            changeOrigin: true,
            pathRewrite: {
              '^/api': ''
            }
          },
          secure:false
        },

### 注意点： ###

*  proxyTable修改后需要重启！！！
 *  `/api`代表[https://www.github.com][https_www.github.com]，所以组件使用时直接`/api/emojis`，代表的意思：[https://www.github.com/emojis][https_www.github.com_emojis]
 *  `/api/emojis`最前面的`/`可加可不加
 *  `'^/api': ''`前面的尖角号可加可不加
 *  最后一点也是最重要的一点：请求的是用localhost:8080报错就是localhost:8080，实际请求时候会被转到[https://www.github.com][https_www.github.com]，很多人在这个上理解有误差，我差点也被误导了！

[https_www.github.com]: https://www.github.com
[https_www.github.com_emojis]: https://www.github.com/emojis

发表评论取消回复

表情：

评论列表（有 0 条评论，256人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vue axios跨域配置proxyTable404错误

配置的config/index.js proxyTable: { '/apia':{ target:'https://ap

偏执的太偏执、/ 2023年06月05日 11:21/ 0 赞/ 13 阅读

相关 vue前端解决跨域问题（axios）

vue前端解决跨域问题（axios） 1、安装环境 2、配置代理 1.在config文件夹下的index.js文件中的proxyTable字段中，

朴灿烈づ我的快乐病毒、/ 2023年02月18日 01:57/ 0 赞/ 119 阅读

相关 VUE之axios解决跨域方案

跨域示例 ![在这里插入图片描述][20200807172647824.png] Access to XMLHttpRequest at ‘xxxx’ from or

古城微笑少年丶/ 2022年11月25日 10:05/ 0 赞/ 206 阅读

相关前端之Vue使用axios跨域正确配置

组件代码 <script> export default { name: 'App', methods: { getData() { this.$http.get

小咪咪/ 2022年05月23日 09:18/ 0 赞/ 257 阅读

相关【VUE axios】axios跨域方式

1、配置config下的index.js proxyTable: { '/apis': { target: '

爱被打了一巴掌/ 2022年05月19日 06:55/ 0 赞/ 311 阅读

相关 vue-cli使用axios配置跨域

axios.js配置 import axios from 'axios'; import qs from "qs"; axios.defaults.t

àì夳堔傛蜴生んèń/ 2022年04月23日 06:44/ 0 赞/ 226 阅读

相关 Vue使用axios、解决axios跨域

axios [axios文档][axios] > axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端从浏览器中创建 XML

骑猪看日落/ 2022年03月06日 10:38/ 0 赞/ 623 阅读

相关 vue axios + Java 跨域

1.在 vue main.js 的里面 import axios from 'axios'//引入axios,来发送请求 Vue.prototype.axios

女爷i/ 2022年01月22日 00:45/ 0 赞/ 310 阅读

相关前端react/vue跨域拦截 axios

前端react/vue跨域拦截 axios first step import axios from 'axios' inport

秒速五厘米/ 2021年09月15日 16:24/ 0 赞/ 383 阅读

相关 vue axios解决跨域

axios解决跨域 1、在config中的index.js文件中将proxyTable后的内容修改为:

阳光穿透心脏的1/2处/ 2021年07月24日 12:46/ 0 赞/ 493 阅读