溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

vue-cli3跨域配置的簡(jiǎn)單方法

發(fā)布時(shí)間：2020-09-01 07:38:11 來源：腳本之家 閱讀：402 作者：zs_staria 欄目：web開發(fā)

vue-cli3跨域配置：

在vue-resource的數(shù)據(jù)請(qǐng)求中，一般我們會(huì)將請(qǐng)求方式GET/POST修改為jsonp的請(qǐng)求方式就可以實(shí)現(xiàn)跨域。

但是對(duì)于只支持GET/POST兩種請(qǐng)求方式的api，修改jsonp，就會(huì)出錯(cuò)。需要進(jìn)行跨域的配置。

(1)在文件根目錄下，創(chuàng)建vue.config.js配置文件，具體配置如下：

module.exports={

//將baseUrl：'/api',改為baseUrl：'/'
baseUrl:'/',
devServer:{
  '/api':{
    target:'http://apis.juhe.cn/',
    changeOrigin:true,
    ws:true,
    pathRewrite:{
      '^/api':'' 
    }
     
  }
}}

(2)在文件根目錄下,創(chuàng)建.env.development 用作開發(fā)環(huán)境變量設(shè)置。

在.env.development文件下設(shè)置變量 VUE_APP_BASE_API=/api 即可將devServer的proxy重寫的url賦值給VUE_APP_BASE_API

(3)讀取配置的變量，通過process.env.VUE_APP_XX(process.env.VUE_APP_BASE_API)來讀取。

總結(jié)

以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，謝謝大家對(duì)億速云的支持。

向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手