Heim > Web-Frontend > js-Tutorial > Hauptteil

Besprechen Sie das Problem des domänenübergreifenden Zugriffs auf einen oder mehrere Domänennamen in React Axios

coldplay.xixi
Freigeben: 2020-08-19 10:05:29
nach vorne
2035 Leute haben es durchsucht

Besprechen Sie das Problem des domänenübergreifenden Zugriffs auf einen oder mehrere Domänennamen in React Axios

【Empfohlene verwandte Artikel: Ajax-Video-Tutorial

1.react + axios domänenübergreifender Zugriff auf einen Domainnamen

Die Konfiguration ist sehr einfach, Sie müssen sie nur im konfigurieren aktuelle package.json-Datei:

"proxy":http://iot-demo-web-dev.autel.com", //Natürlich ist dies eine gefälschte Adresse

So:

Auf diese Weise ist die domänenübergreifende Vervollständigung abgeschlossen. Natürlich können Sie auch ein paar weitere Codeteile wie im Internet hinzufügen, etwa so:

Ich weiß nicht, was passieren wird, wenn Sie diesen Code schreiben . Wie auch immer, ich kann den spezifischen Fehler hier nicht anzeigen, da mein Projekt diesen Befehl bereits ausgeführt hat. Die Bedeutung des Fehlers besteht wahrscheinlich darin, dass der Proxy hofft, eine Zeichenfolge zu erhalten Objekt, also kann ich nur die Methode des ersten Bildes verwenden, um domänenübergreifend zu arbeiten npm run eject

Dann installieren wir Axios. Natürlich sind auch andere Dinge in Ordnung. Erstellen Sie eine API-Datei im src-Verzeichnisprojekt und erstellen Sie dann eine user.js Öffnen Sie die API-Datei und schreiben Sie den folgenden Code:

import axios from 'axios'

export function _user(data) {
 return axios.get('device/detail', data)
}
Nach dem Login kopieren

Ich verwende hier die Art von domänenübergreifender Funktion im ersten Bild Die Daten, die uns der Hintergrund liefert

Was ist mit den oben genannten domänenübergreifenden Daten? Man kann sagen, dass sie sehr praktisch sind, aber was ist, wenn das Backend uns zwei oder sogar drei verschiedene Domänennamen zur Verfügung stellt? ins

2.react +axios, um domänenübergreifend auf mehrere Domänennamen zuzugreifen

Installieren Sie das Plug-in:

Nach der Installation beginnen wir mit der Konfiguration: 1. Führen Sie zunächst vorübergehend den Befehl aus, um ihn verfügbar zu machen die Konfiguration

import { _user } from '../api/user'

 componentDidMount() {
 let res = _user({})
 console.log(res)
 }
Nach dem Login kopieren

Hier kann ein Fehler auftreten: npm install --save http-proxy-middleware

Zu diesem Zeitpunkt können Sie den Fehlerbericht Baidu senden oder mir folgen, um den Vorgang fortzusetzen

Der Grund für den Fehlerbericht liegt darin, dass wir Gerüste zum Bauen verwenden Reagieren Sie, das System fügt uns automatisch eine .gitignore-Datei hinzu. Wenn Sie sie nicht an das Lager übermittelt haben, müssen Sie sie zuerst an das Lager senden

Nach Abschluss dieser beiden Schritte können Sie mit der Benennung fortfahren

. Nachdem die Konfigurationsdatei verfügbar gemacht wurde, müssen Sie sich darüber keine Gedanken machen. Erstellen Sie unter src eine Datei namens setupProxy.js und schreiben Sie den folgenden Code hinein: Suchen Sie den Skriptpfad und öffnen Sie ihn strat.js

Verhandeln Sie den folgenden Code um Zeile 117:

npm run eject
or
yarn eject
Nach dem Login kopieren
npm run eject package.json

So viele Cross-Domains sind erfolgreich. Es ist erwähnenswert, dass dem von Ihnen angeforderten spezifischen Pfad api oder sys vorangestellt werden muss so

Verwandte Lernempfehlungen:

js-Video-Tutorial

Das obige ist der detaillierte Inhalt vonBesprechen Sie das Problem des domänenübergreifenden Zugriffs auf einen oder mehrere Domänennamen in React Axios. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:jb51.net
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!