已解决430363个问题，去搜搜看，总会有你想问的

后端给了接口文档，vue前端页面axios该如何配置接口地址？

关注

首页猿问后端给了接口文档，vue前端页面a...

后端给了接口文档，vue前端页面axios该如何配置接口地址？

Vue.js WebApp

copy_to 2017-03-22 14:55:07

想定义一个全局变量来放接口地址，然后每次请求都可以直接post请求“/login”。但是不知道怎么实现

查看完整描述

2 回答

Caballarii

TA贡献1123条经验获得超629个赞

把axios调用封装成一个方法，然后option，包括token之类的设置都写好在那个文件里，要用的页面直接import这个方法，然后把"/login"，还有GET/POST，还有参数这些值传到这个方法里去就行了，在这个封装方法里还可以做登录状态检查，调用错误处理等等操作

3 反对回复 2017-03-22

copy_to
我是在webpack下的config的index.js里面设置了 proxyTable: { '/wapp':{ target: 'http://127.0.0.73:28080/wapp', changeOrigin: true, } }, 然后在src文件夹下面建了一个config里面放了这段 import axios from 'axios' import Qs from 'qs' // axios 配置 axios.defaults.timeout = 5000; axios.defaults.baseURL = 'http://127.0.0.73:28080/wapp'; axios.defaults.withCredentials = true; 在main.js 里面 import axios from '@/config/api'; Vue.prototype.$ajax = axios; 最后在组件里用 this.$ajax.get('/indexdata', {}) 获取到到xhr，但是渲染不了，而且还出了这个问题 XMLHttpRequest cannot load http://127.0.0.73:28080/wapp/indexdata?vmethod=2&clientfrom=3. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. 有点懵~

回复 2017-03-22
Caballarii
既然在webpack里设置了proxy了，axios里就不用再加上域名信息了，你发出/wapp这样的请求，webpack-dev-server会自动帮你转发到http://127.0.0.73:28080/wapp的，前提是你这个proxy配对了

回复 2017-03-22

慕瓜9220888

TA贡献868条经验获得超0个赞

VWEJVIRHN

反对回复 2021-10-19

2 回答
0 关注
14121 浏览

关注

添加回答

举报

0/150

提交

取消

意见反馈帮助中心 APP下载