Réagir JS côté Serveur question - fenêtre non trouvé
Salut, je suis en train d'utiliser réagir-rte dans mon reactJS projet. J'ai rendu côté serveur et chaque fois que je veux l'utiliser je reçois:
return /msie [6-9]\b/.test(window.navigator.userAgent.toLowerCase());
^
ReferenceError: window is not defined
Je suppose que le problème vient peut-être isomorphe-outils, mais je ne sais pas comment faire pour reporter l'importation du package pour le client, la fenêtre va être défini déjà.
Vous devez vous connecter pour publier un commentaire.
Si vous êtes en train de faire côté serveur de rendu, il ya une bonne chance que la fenêtre globale de l'objet va être indéfini, parce que c'est seulement quelque chose que le client peut comprendre.
Il y a une solution que j'utilise dans ce cas. C'est ce que j'ai pour mon webpack plugin:
Donc j'utilise
process.env.BROWSER
à mon avantage, car il sera défini commeundefined
si c'est côté serveur, et il seratrue
si le client fait le rendu.Depuis tout s'arrête lorsqu'il n'y a pas un objet de la fenêtre sur le côté serveur, nous pouvons ajouter ceci:
De cette façon, votre console ne criez pas à vous et ne pas arrêter le serveur de rendu côté, à qui vous pouvez maintenant continuer avec votre jour de gloire! Même si je dois admettre que c'est un peu Hacky, mais il fait le travail, parce que tout ce que nous voulons faire est de laisser le côté serveur de rendu de la première DOM chaîne et de laisser le côté client de prendre le dessus.
Ici est un mnp bibliothèque de la poignée de fenêtre de document et objet global pour vous: Mondial.
Ensuite, vous pouvez écrire en toute sécurité:
Quand le faire côté serveur-rendu global comme
window
,document
ne sera pas défini. Et si vous voulez le faire en isomorphe façon, vous avez pour tester ce que l'environnement est lors du rendu componets.https://github.com/DavidWells/isomorphic-react-example
y a de nombreux exemples de codes peut être trouvé sur github, le lien ci-dessus est l'un d'eux, j'espère que ça peut être utile.
J'ai essayé de mettre mon constantes comme une importation globale:
Dans ce cas, elle renvoie fenêtre ou un objet global en fonction de la météo de votre cours d'exécution sur l'application client ou serveur.
Maintenant, vous avez besoin d'importer cette constante partout où vous souhaitez faire usage de l'objet window.
Ex:
Une autre solution que j'ai trouvé, c'est que vous pouvez attribuer à vos variables d'état auprès de votre fenêtre "variables" dans la "componentDidMount de l'événement, et dans le "restituer" la méthode, vous pouvez tester si les variables d'état sont null ou undefined alors retourner la valeur null, jusqu'à ce que la componentDidMount' terminer.
J'ai été en utilisant ReactJS.NET le ciblage de construire pour le client et le serveur, et a obtenu le même problème.
La solution est de mettre
sortie.globalObject
à'this'
.Sans cette option, c'est de revenir à
window
qui travaille sur le client seulement le code.