Vue 访问第三方API跨域问题

Vue访问第三方API时会出现跨域问题,解决方法是在项目目录中congfig文件夹下
index.js文件中proxyTable配置代理。例如:

module.exports = {
  dev: {
    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    //此处配置代理 
    proxyTable: {
      '/api': {
        target: 'http://api.map.baidu.com/geocoder/v2', //访问地址
        changeOrigin: true,
        pathRewrite: {
          '^/api': '/'
        }
      },
      '/direction': {
        target: 'http://api.map.baidu.com/direction/v2/transit',
        changeOrigin: true,
        pathRewrite: {
          '^/direction': '/'
        }
      },
    },

在项目中就可以使用访问代替:
http://api.map.baidu.com/geocoder/v2’接口时可以使用‘/api’代替,
'http://api.map.baidu.com/direction/v2/transit’接口时可以使用‘/direction’代替


import {getHttp} from "../common/httpAxios.js";

export function getAddress(params,successCallBack, errorCallBack) {
 // 此处使用的是get请求,参数传递params
  let url = '/api/';
  getHttp(url, params ,successCallBack ,errorCallBack);
}
export function getBusDirection(params , successCallBack, errorCallBack) {
   let url = '/direction';
   getHttp(url, params ,successCallBack ,errorCallBack);
}

评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值