最近在做一个vue项目：

首先默认获取当前城市信息，包括城市名称，经纬度等等。

方式：

1.首先在工程目录index.html中引入

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>

密钥可以通过百度开发者平台申请

2.在build/webpack.base.conf.js中与entry同级配置：

3.配置完成之后重新启动一下，npm run dev

4.在公共文件中如创建一个utils.js文件，代码如下：

5.在需要使用的文件中引入即可

import {getCityInfo} from './utils/utils.js'

getCityInfo().then((res) => {

   具体操作代码

}).catch(_ => {});

需求二：通过切换城市，获取当前城市经纬度，地图需要定位到当前切换城市（需要调用百度api通过城市名称获取城市经纬度接口）http://api.map.baidu.com/geocoder/v2/?address=北京市&output=json&ak=您的密钥

方式：（最佳方式通过jsonp,下面会详细介绍）

在用jsonp之前用了很多其他的方式，都尝试失败，使用了通过在config/index.js下面添加proxyTable代理的方式，但是这个方式只能在开发环境下有效，打包后代理就失效了，跨域问题依然存在,如下方式用于开发环境调试接口是ok的：

vue页面中请求方式如下：

       ps:请求的url如下即可

        axios({
          url: "/v2/?address=成都市&output=json&ak=您的密钥",   
        }).then(res => {
           具体操作
        })

接下来说说简单直接很暴力的方式：

直接npm install vue-jsonp --save 安装依赖

然后在main.js中引入

vue页面中使用：

完美解决跨域问题！