在開發環境下，頁面路徑是本地127.0.0.1:8080，然而獲取資料時會用的伺服器介面，所以就導致了開發環境下的跨域，採用proxyTable配置來解決

1，在config/index.js進行如下配置

    proxyTable: {
      '/api': {
        target: 'https://xxxxxx.com', //後端介面地址
        changeOrigin: true,//是否允許跨越
        pathRewrite: {
            '^/api': '/',//重寫,
        }
      }
    },

2，因有封裝一個axios請求方法request

import axios from 'axios'
import store from '@/store'

import { Message} from 'element-ui'
import { getToken } from '@/utils/auth'


const service = axios.create({
    baseURL: process.env.BASE_API,   //注意： 因為這裡
    timeout: 5000                    // request timeout
})

service.interceptors.request.use(
    config => {
        if (store.getters.token) {
            config.headers['X-Token'] = getToken()  // 讓每個請求攜帶token-- ['X-Token']為自定義key 請根據實際情況自行修改
        } 
        return config
    },
    error => {
        Promise.reject(error)
    }
)

service.interceptors.response.use(
    response => response,
    error => {
        Message({
          message: error.message,
          type: 'error',
          duration: 5 * 1000
        })
        return Promise.reject(error)
    }
)

export default service
 

 3，在config/dev.env.js，如此之後就能使之後使用request（）方法的url都是以/api開頭了，

module.exports = merge(prodEnv, {

    NODE_ENV: '"development"',

    BASE_API: '"/api/"'  //注意： 所以這裡這樣

})

4，然後在需要請求資料方法內如下使用就好了

import request from '@/utils/request'

export function fetchList(){
    return request({
        url: '/travel_app/findAllScenic.do',
        method: 'POST'
    })
}
 

比如後臺介面是： https://xxxxxx.comtravel_app/findAllScenic.do

本地頁面是： http://127.0.0.1:8080 

跨域處理後就把訪問後臺的地址改為了：

這樣就拿到了伺服器上的資料啦