首頁 > web前端 > js教程 > 主體

vue-cli怎樣做出跨域請求

php中世界最好的语言
發布: 2018-05-02 10:28:10
原創
1488 人瀏覽過

這次帶給大家vue-cli怎樣做出跨域請求,vue-cli做出跨域請求的注意事項有哪些,下面就是實戰案例,一起來看一下。

前端開發時,請求後台介面經常需要跨網域,vue-cli實作跨網域請求只需要開啟config/index.js,修改如下內容即可。

//例如要请求的接口url为http://172.3.2.1:8000/look/1
module.exports = {
  dev:{
    proxyTable:{
      '/api':{
        target: 'http://172.3.2.1:8000',
        changeOrigin: true,
        pathRewrite: {
         '^/api': ''
        }
      }
    }
  }
}
登入後複製

 這時在你想請求介面的url處,輸入/api/look/1 即可實現跨域請求。

這時如果打開F12會發現請求的url是localhost:8080/api/look/1,這其實是虛擬從本地請求數據,這樣就不會有跨域的問題產生了。

一般情況下上面的方法是沒有問題的,如果上面的方法行不通,可以試試這樣寫:

//例如要请求的接口url为http://172.3.2.1:8000/look/1
module.exports = {
  dev:{
    proxyTable:{
      '/look':{
        target: 'http://172.3.2.1:8000',
        changeOrigin: true,
        pathRewrite: {
         '^/look': '/look'
        }
      }
    }
  }
}
登入後複製

這時在你想請求接口的url處,輸入/ look/1 即可實現跨域請求。

相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!

推薦閱讀:

JS動態操作HTML標記

#使用JS操作input文字方塊內容

以上是vue-cli怎樣做出跨域請求的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!