vue 使用 axios 跨域请求问题

最新推荐文章于 2023-05-11 19:10:43 发布

flycompany

最新推荐文章于 2023-05-11 19:10:43 发布

阅读量152

点赞数 2

分类专栏： vue 文章标签： vue axios

本文链接：https://blog.csdn.net/flycompany/article/details/90383677

版权

vue 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

1、安装axios

npm install --save axios

2、在main.js 中添加axios 配置

import axios from 'axios'
import Qs from 'qs'

Vue.prototype.axios = axios
Vue.prototype.qs = Qs

3、在config 目录下的index.js 中添加 proxyTable

module.exports = {
  dev: {

    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {
      '/test': {
        target: 'http://t.weather.sojson.com/api',
        changeOrigin: true,
        pathRewrite: {
          '^/test': '/'
        }
      }
    },

    // Various Dev Server settings
    host: '0.0.0.0', // can be overwritten by process.env.HOST

4、在需要访问的页面，添加

created () {
        let that = this
        that.axios.get('/test/weather/city/101030100', this.qs.stringify({'name': 'xiaoming', 'age': 14}), {
            header: {
                'Content-Type': 'application/json'
            },
        })
        .then(function(res){
            console.log("axios success")
            console.log(res)
        })
        .catch(function(error){
            if(error.response) {
                console.log(error.response)
            }
        })
    }

即可