vue-cli3以上框架解决跨域问题

事实上,3以上的版本安装好以后没有主配置文件,它不像2的版本有专门的config文件夹可以处理配置,所以我们需要新建vue.config.js  【默认情况下,3以上的版本可以直接识别这个js文件,把它当做自己的配置文件】

步骤如下:

1、在项目框架的根目录下新建文件:vue.config.js

2、重启项目,这样的话新建的文件就可以被识别了

3、给新建的文件内添加解决跨域的代码部分



module.exports = {

    outputDir: 'serve',  //build输出目录

    assetsDir: 'assets', //静态资源目录(js, css, img)

    lintOnSave: false, //是否开启eslint

    devServer: {

        open: true, //是否自动弹出浏览器页面

        host: "localhost",

        port: '8081',

        https: false,  //是否使用https协议

        hotOnly: false, //是否开启热更新

        proxy: {

            '/api': {

                target: 'http://www.1707laravel.com/api', //API服务器的地址

                ws: true,  //代理websockets

                changeOrigin: true, // 虚拟的站点需要更管origin

                pathRewrite: {  //重写路径 比如'/api/aaa/ccc'重写为'/aaa/ccc'

                    '^/api': ''

                }

            }

        }

    }

}


配置好以后就可以执行请求了,例如post请求是:


this.$axios.post('/api/register',{

    name:this.user_name,

    email:this.user_email,

    pwd:this.user_pwd,

    rpwd:this.user_rpwd,

    phone:this.user_phone,

    sex:this.user_sex

})

  .then(function (res) {

      console.log(res);

  })

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • pyspark.sql模块 模块上下文 Spark SQL和DataFrames的重要类: pyspark.sql...
    mpro阅读 9,828评论 0 13
  • vue-cli3脚手架创建完毕不会有config文件,需要我们自己配置,并且官网有详细的配置列表。 在根目录下创建...
    雾里看花_5b5b阅读 786评论 0 0
  • 一. Java基础部分.................................................
    wy_sure阅读 3,967评论 0 11
  • 一直说去西安,十三朝古都,好吃的肉夹馍。因为几百块钱的车票和来回近一天的时间,一直没去成。老张打电话联系我,“刘大...
    沙滩红楼阅读 711评论 3 1
  • 背景:昨天开始智齿疼,今天请假一天去看牙 医生:你的智齿刚开始冒出来,要开刀把它扒出来,不然会影响其他牙齿。 我:...
    一介草莽书生阅读 568评论 2 1

友情链接更多精彩内容