webpack中代理配置(proxyTable)


注:用axios請求

1,下載axios

npm i axios --save

2,在config文件下的index.js中配置代理地址

   參考:https://vuejs-templates.github.io/webpack/proxy.html
  舉例:localhost:8080/api/xxx 代理到 http://192.168.10.183:8103/api/xxx,如果用pathRewrite重寫則代理到http://192.168.10.183:8103/xxx
  將'/api'轉為'/'
  proxyTable: {
'/api': {// '/api':匹配項 target: 'http://192.168.10.183:8103',// 接口的域名
     // secure: false,// 如果是https接口,需要配置這個參數
changeOrigin: true,// 如果接口跨域,需要進行這個參數配置
     // pathRewrite: {// 如果接口本身沒有/api需要通過pathRewrite來重寫了地址
     // '^api': ''
// }

} }

3.用axios請求資源

參考:https://www.npmjs.com/package/axios
// 引入axios
import axios from 'axios' export function getProductTree() {
 // 用axios.get()請求資源
return axios.get('/api/pageblock/getProductCategoryTree') }

4.頁面中請求資源

<script>
import { getProductTree } from 'api/product-tree.js'

export default {
  created() {
    this._getProductTree()
  },
  methods: {
    _getProductTree() {
      // 頁面加載時請求資源
      getProductTree().then(data => {
        console.log(data)
      })
    }
  }
}
</script>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM