So verwenden Sie die Vue-CLI-Entwicklungsumgebung, um domänenübergreifende Anforderungen zu implementieren

Dieses Mal zeige ich Ihnen, wie Sie die Vue-CLI-Entwicklungsumgebung zum Implementieren domänenübergreifender Anforderungen verwenden. Was sind die Vorsichtsmaßnahmen für die Verwendung der Vue-CLI-Entwicklungsumgebung zum Implementieren domänenübergreifender Anforderungen? , lass uns einen Blick darauf werfen.

Während der Front-End-Entwicklung müssen Anforderungen an die Backend-Schnittstelle häufig domänenübergreifend sein. Um domänenübergreifende Anforderungen mit vue-cli zu implementieren, müssen Sie nur config/index.js öffnen und Folgendes ändern Inhalt.

//例如要请求的接口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': ''
        }
      }
    }
  }
}

Geben Sie zu diesem Zeitpunkt /api/look/1 an der URL der Schnittstelle ein, die Sie anfordern möchten, um domänenübergreifende Anforderungen zu erreichen.

Wenn Sie zu diesem Zeitpunkt F12 öffnen, werden Sie feststellen, dass die angeforderte URL „localhost:8080/api/look/1“ lautet. Dies ist tatsächlich eine virtuelle Anforderung für Daten vom lokalen Standort, sodass keine vorhanden ist domänenübergreifende Probleme.

Unter normalen Umständen gibt es kein Problem mit der oben genannten Methode. Wenn die obige Methode nicht funktioniert, können Sie versuchen, Folgendes zu schreiben:

//例如要请求的接口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'
        }
      }
    }
  }
}

Geben Sie zu diesem Zeitpunkt / an der URL ein der Schnittstelle, die Sie anfordern möchten. Look/1 kann domänenübergreifende Anforderungen implementieren.

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 JS verwendet, um das maximale Element eines Arrays vom Typ „Zahl“ zu finden

Wie man damit umgeht mit Vue-Router Lazy Loading Das erstmalige Laden zu vieler Ressourcen führt zu langsamer Geschwindigkeit

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die Vue-CLI-Entwicklungsumgebung, um domänenübergreifende Anforderungen zu implementieren. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!