web-dev-qa-db-fra.com

En-tête d'hôte non valide lorsque ngrok tente de se connecter au serveur de développement de React

J'essaie de tester mon application React sur un appareil mobile. J'utilise ngrok pour mettre mon serveur local à la disposition d'autres périphériques et le fait fonctionner avec une variété d'autres applications. Cependant, lorsque j'essaie de connecter ngrok au serveur de développement de React, le message d'erreur suivant s'affiche:

Invalid Host Header

Je crois que React bloque par défaut toutes les demandes provenant d’une autre source. Des pensées?

reactjslocalhostngrok
75
Patrick Connors

je rencontre un problème similaire et trouve deux solutions qui fonctionnent aussi loin que de visualiser l'application directement dans un navigateur

ngrok http 8080 -Host-header="localhost:8080"
ngrok http --Host-header=rewrite 8080

évidemment remplacer 8080 avec quel que soit le port que vous exécutez

cette solution soulève toujours une erreur lorsque je l'utilise dans une page intégrée, qui extrait le bundle.js de l'application react. Je pense que depuis qu'il réécrit l'en-tête de localhost, quand cela est intégré, il cherche à localhost, sur lequel l'application ne fonctionne plus

249
textual

J'ai utilisé cette installation dans une application de réaction qui fonctionne. J'ai créé un fichier de configuration nommé configstrp.js qui contient les éléments suivants:

module.exports = {
ngrok: {
// use the local frontend port to connect
enabled: process.env.NODE_ENV !== 'production',
port: process.env.PORT || 3000,
subdomain: process.env.NGROK_SUBDOMAIN,
authtoken: process.env.NGROK_AUTHTOKEN
},   }

Exiger le fichier sur le serveur. 

const configstrp      = require('./config/configstrp.js');
const ngrok = configstrp.ngrok.enabled ? require('ngrok') : null;

et se connecter comme tel

if (ngrok) {
console.log('If nGronk')
ngrok.connect(
    {
    addr: configstrp.ngrok.port,
    subdomain: configstrp.ngrok.subdomain,
    authtoken: configstrp.ngrok.authtoken,
    Host_header:3000
  },
  (err, url) => {
    if (err) {

    } else {

    }
   }
  );
 }

Ne passez pas un sous-domaine si vous n'avez pas de domaine personnalisé

1
FlyingSnowGhost