vue3.0跨域配置

1.项目根目录新建vue.config.js文件,把一下代码复制到vue.config.js中

module.exports = {
    lintOnSave: false,
    baseUrl: process.env.NODE_ENV === 'production'
        ? './'
        : '/',
    devServer: {
        proxy: {
            '/api': {
                target: '请求地址',  // target host
                ws: true,  // proxy websockets
                changeOrigin: true,  // needed for virtual hosted sites
                pathRewrite: {
                    '^/api': ''  // rewrite path
                }
            },
        },  // 配置多个代理
    }
};

2.项目根目录新建http.js文件,文件中引入axios

import axios from 'axios'//引入axios
export default axios//导出axios  在main.js中可以引入

3.main.js中加入一下代码

import axios from '../http.js'//引入axios
Vue.prototype.$axios = axios
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

4.安装qs依赖,项目中script 请求引入qs库

 import qs from 'qs'

5.发起请求

 this.$axios.post('请求地址', qs.stringify({
                        后台字段值: 前台传过去的参数
                    }))
                     .then(res => {
                            if (res.data.code == 2000) {
                                window.console.log(res)
                            }
                        })

猜你喜欢

转载自blog.csdn.net/weixin_38201500/article/details/84791835