Wie Vue ProxyTable das Debuggen von schnittstellenübergreifenden Anforderungen implementiert

Dieses Mal zeige ich Ihnen, wie Vue ProxyTable Schnittstelledomänenübergreifende AnforderungDebugging implementiert und welche Vorsichtsmaßnahmen es gibt, damit Vue ProxyTable Schnittstellen-übergreifende Anforderungen implementiert. Debuggen von Domain-Anfragen. Das Folgende ist ein praktischer Fall. Schauen wir uns das an.

Üblicherweise erfolgt der Zugriff zwischen verschiedenen Domänen und der Zugriff auf Remote-Server zum lokalen Debuggen. . . . Dies ist ein Domänenproblem.

VUE wird über ProxyTable aufgelöst:

In config/index.js Konfigurationsdatei

 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
 }

Der Teil mit der roten Linie dient zum Festlegen der Proxy-Parameter:

Erstellen Sie im Konfigurationsverzeichnis und schreiben Sie „proxyConfig.js“ in

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

Fügen Sie

var proxyConfig = require('./proxyConfig')

in die Konfigurationsdatei config/index.js ein

Verwendung:

Der Server stellt eine Schnittstelle bereit: https://goods.footer.com/health/list

Vue-Anfrage

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

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Wie man die Mongodb-Datenbank in Node.js betreibt

Detaillierte Erläuterung der Übergabe von Vue+Query-Parametern Schritte

Das obige ist der detaillierte Inhalt vonWie Vue ProxyTable das Debuggen von schnittstellenübergreifenden Anforderungen implementiert. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!