配置axios跨域访问
今天在vue中安装了axios,通过使用axios来进行数据访问,毫无疑问的遇到了axios的跨域问题,今天折腾一下午,才能解决
确认你的服务启动方式!!!!!
我的服务启动方式是vite启动,并不是vue-cli-service启动,我今天一下午在查看vue-cli配置代理问题,毫无疑问,浪费一下午,换来一个教训,要注意基础的配置,特别是不起眼的内容
我的配置
Vue 3.0.11
vite 2.2.3
node 16.0.0
//cli版本貌似没啥作用,但是还是列出来吧
vue-cli 4.5.12
配置代码
打开vite.config.js
输入下面的代码
import { defineConfig } from ‘vite‘
import vue from ‘@vitejs/plugin-vue‘
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue()],
server:{
proxy:{
//这里是通过请求/api 来转发到 https://api.pingping6.com/
//假如你要请求https://api.*.com/a/a
//那么axios的url,可以配置为 /api/a/a
‘/api‘: ‘https://api.*.com/‘
}
}
})
打开../src/conponents/demo.vue
输入下面的代码
import axios from "axios";
var data=axios(
{
url:"/api/tools/zimi",
type:"get",
data:{
"question":"***"
},
contentType:"text",
processData: false,
dataType:"text"
}
).then(function (response){
console.log(response);})
重启服务
npm run dev 或者 vite