How vue proxyTable implements interface cross-domain request debugging

This time I will show you how to implement vue proxyTableInterfaceCross-domain requestDebugging, vue proxyTable implements interface cross-domain request debuggingWhat are the precautions , the following is a practical case, let’s take a look.

It is more common to access between different domains, and access remote servers during local debugging. . . . This is a domain problem.

VUE is resolved through proxyTable:

In config/index.js Configuration file

 dev: {
  env: require('./dev.env'),
  port: 8080,
  autoOpenBrowser: true,
  assetsSubDirectory: 'static',
  assetsPublicPath: '/',
  //proxyTable: {},
  proxyTable: proxyConfig.proxyList,
  // css Sourcemaps off by default because relative paths are "buggy"
  // with this option, according to the CSS-Loader README
  // (https://github.com/webpack/css-loader#sourcemaps)
  // In our experience, they generally work as expected,
  // just be aware of this issue when enabling this option.
  cssSourceMap: false
 }

The red line part is to set the proxy parameters:

Create in the config directory and write proxyConfig.js

module.exports = {
 proxyList: {
    '/apis': {
      // 测试环境
      target: 'https://goods.footer.com', // 接口域名
      changeOrigin: true, //是否跨域
      pathRewrite: {
        '^/apis': ''  //需要rewrite重写的,
      }       
    }
 }
}

Introduce

var proxyConfig = require('./proxyConfig')

in the config/index.js configuration file

use:

The server provides an interface: https://goods.footer.com/health/list

Vue request

var obj = {
  pageSize: 20
}
this.$http.get( '/apis/health/list',{params: obj})
      .then(function(res){
    // 成功回调
      },function(){
       alert("error")
      })

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

How to operate the mongodb database in Node.js

detailed explanation of the vue query parameter passing steps

The above is the detailed content of How vue proxyTable implements interface cross-domain request debugging. For more information, please follow other related articles on the PHP Chinese website!