Maison  >  Article  >  Opération et maintenance  >  Comment utiliser Nginx pour gérer l'environnement de développement de Vue

Comment utiliser Nginx pour gérer l'environnement de développement de Vue

PHPz
PHPzavant
2023-05-20 17:16:061239parcourir

1. Exigences

Le nom de domaine de test local est le même que le nom de domaine en ligne afin de délivrer correctement les cookies et d'effectuer les tests sso .

Remarque : Étant donné que les cookies pertinents sont ajoutés au nom de domaine de quatrième niveau après la connexion sso, le nom de domaine de test local et le nom de domaine de l'interface en ligne doivent être identiques.

2. Solution

Configurez le fichier hôte pour que le nom de domaine en ligne pointe vers localhost :

# 🎜🎜## 🎜🎜#

127.0.0.1 product.xxx.xxx.com
Configurez nginx pour le transfert correspondant :

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;
  }  
}

Configurez vue.config.js pour éviter les erreurs d'en-tête d'hôte non valides : #🎜🎜 #

{
  devserver: {
    disablehostcheck: true
  }
}

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer