So verwenden Sie Nginx, um domänenübergreifende Probleme in der Vue-Entwicklungsumgebung zu lösen

1. Anforderungen

Der lokale Testdomänenname muss mit dem Onlinedomänennamen identisch sein, um Cookies korrekt zu übermitteln und SSO-Tests durchzuführen.

Hinweis: Da die relevanten Cookies nach der SSO-Anmeldung zum Domänennamen der vierten Ebene hinzugefügt werden, müssen der lokale Testdomänenname und der Domänenname der Online-Schnittstelle identisch sein.

2. Lösung

Konfigurieren Sie die Hostdatei so, dass der Online-Domänenname auf localhost verweist:

127.0.0.1 product.xxx.xxx.com

Konfigurieren Sie Nginx für die entsprechende Weiterleitung:

server {
  listen    80;
  listen    [::]:80;
  server_name ${product.xxx.xxx.com};

  location /api {
    proxy_pass https://${ip.ip.ip.ip};
    proxy_set_header host $host;
  }

  location / {
    proxy_pass http://localhost:8080;
    proxy_set_header host $host;
  }  
}

Konfigurieren Sie vue.config.js, um ungültige Host-Header zu vermeiden Fehler:

{
  devserver: {
    disablehostcheck: true
  }
}

Das obige ist der detaillierte Inhalt vonSo verwenden Sie Nginx, um domänenübergreifende Probleme in der Vue-Entwicklungsumgebung zu lösen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!