vue利用axios跨域请求

4 篇文章 0 订阅
3 篇文章 0 订阅

1、找到config文件夹下的index.js打开,修改proxyTable:()部分,代码如下:
proxyTable: {
‘/apis’: {
target: ‘http://localhost:5069’, //后端接口地址
changeOrigin: true, //是否允许跨越
pathRewrite: {
‘^/apis’: ‘/’, //重写,
}
}
},
2、找到mian.js文件,//axios.defaults.baseURL = ''注释,也可以为空,测试是OK的;
3、调用axios两种方法:
3.1、this.KaTeX parse error: Expected 'EOF', got '&' at position 54: …me=' + name + '&̲password=' + pa…http.get("/apis/api/Admin/login", {
params: {
username: name,
password: password
},
}).then(res =>{
//返回解释:res.data则如果login有返回,就是返回的数据,没有返回则为空
//res.status=200则成功返回
console.log(res);
//let {code} = res.data;
var code = res.data;
//返回成功
if (code == ‘成功’)
{
this.KaTeX parse error: Expected 'EOF', got '}' at position 31: …ome'); }̲ }).catch…http({
// method: ‘get’,
// url: ‘/apis/api/Admin/login’,
// params: {
// username: name,
// password: password,
// },
// }).then(function (res) {
// this.ruleForm = this.res;
// console.log(res);
// let { code } = res.data;
// if (code == 200) {
// this.router.push("/home");
// }
// })
// .catch(function (error) {
// console.log(error());
// });
4、注意:
这里的then后面大家都习惯这样使用:
.then(funection(res){
console.log(res)}
如果这样使用,请注意后面的this调用将失败,原因可以百度一下。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Vue中使用axios进行请求,你可以按照以下步骤操作: 1. 安装axios:在命令行中运行 `npm install axios`。 2. 创建一个API请求文件:在src目录下创建一个新的文件夹,比如 `api`,然后在该文件夹下创建一个名为 `index.js` 的文件。 3. 在 `index.js` 文件中导入axios并创建一个实例: ```javascript import axios from 'axios'; const instance = axios.create({ baseURL: 'http://api.example.com', // 设置你的API请求的基本URL timeout: 5000, // 设置请求超时时间 }); export default instance; ``` 4. 在你需要发送请求的组件中导入刚才创建的实例: ```javascript import api from '@/api/index.js'; // 然后使用api进行请求 api.get('/example') .then(response => { console.log(response.data); }) .catch(error => { console.error(error); }); ``` 5. 处理问题:在Vue的配置文件 `vue.config.js` 中进行配置。如果没有该文件,请在项目根目录下创建一个。 ```javascript module.exports = { devServer: { proxy: { '/api': { target: 'http://api.example.com', // 设置你的API请求的基本URL changeOrigin: true, pathRewrite: { '^/api': '', // 如果你的API路径有前缀,可以在这里进行替换 }, }, }, }, }; ``` 以上配置将所有以 `/api` 开头的请求代理到 `http://api.example.com`,并解决问题。 这样就可以在Vue项目中使用axios进行请求了。请注意,实际的API URL和路径需要根据你的项目和后端API进行相应的调整。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

流浪四方

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值