4
votes

Jeton inattendu Manifest.json

Bonjour, j'ai poussé un projet react / express jusqu'à heroku ( https: // polar-oasis- 57801.herokuapp.com/ ) et a reçu les erreurs suivantes dans la console: Messages d'erreur de la console Chrome

J'ai essayé de rechercher cette erreur et il semble que je besoin de changer quelque chose dans mon fichier manifest.json mais je ne suis pas sûr. Tout conseil aiderait. Voici mon fichier manifeste:

{
  "short_name": "React App",
  "name": "Create React App Sample",
  "icons": [
    {
      "src": "favicon.ico",
      "sizes": "64x64 32x32 24x24 16x16",
      "type": "image/x-icon"
    }
  ],
  "start_url": ".",
  "display": "standalone",
  "theme_color": "#000000",
  "background_color": "#ffffff"
}

Et aussi mon projet sur Github: https://github.com/bernar83/cat-cards

javascript reactjs node.js express manifest.json

3 commentaires

Habituellement, de telles erreurs signifient que le JSON analysé n'est pas un JSON valide. Une vérification rapide du fichier que vous avez lié semble suggérer qu'il s'agit d'un JSON valide. Est-il possible que manifest.json soit modifié d'une manière ou d'une autre pendant le processus de déploiement?

"Jeton inattendu <" signifie généralement que vous essayez d'analyser du HTML au lieu de JSON. Examen des données renvoyées par le serveur pour polar-oasis-57801.herokuapp .com / cat-cards / manifest.json vous pouvez voir que c'est exactement ce qui se passe. Le serveur renvoie un document HTML au lieu de votre fichier JSON. (Il fait la même chose pour vos fichiers .js et .css .)

Je viens de recevoir la même erreur et après quelques heures, je l'ai corrigée en changeant le start_url dans le manifest.json en "start_url": "./index.html" ,

6 Réponses :

9
votes

Cette erreur signifie que la requête adressée à manifest.json ne renvoie pas de réponse JSON valide. Il renvoie probablement un HTML, étant donné qu'il échoue à cause d'un de départ.

Assurez-vous de lier correctement le manifest.json et assurez-vous de conserver son l'intégrité dans le processus de déploiement. Essayez de naviguer vers http: //yoururl/manifest.json et vérifiez le résultat.

  EDIT1: il semble que votre lien vers le manifeste est rompu. Dans  https://github.com/bernar83/cat- cards / blob / master / client / public / index.html , essayez de remplacer 
 <link rel="manifest" href="manifest.json" />
  par 
 <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
  EDIT2: il suffit de vérifier votre lien Heroku et de confirmer l'erreur. Votre page essaie de trouver le  manifest.json  sous le chemin  /cat-cards/manifest.json  qui est faux. Il ne doit s'agir que de manifest.json

4 commentaires

J'ai changé le lien en juste manifest.json et cela a supprimé le message d'erreur concernant le fichier manifeste, mais en regardant la console maintenant dans mon site heroku récemment déployé, j'obtiens toujours les deux premières erreurs dans cette image: < a href = "https://i.stack.imgur.com/ZyMuL.png" rel = "nofollow noreferrer"> i.stack.imgur.com/ZyMuL.png . Des idées sur la façon de supprimer l'erreur de syntaxe non interceptée?

vous devez également corriger les liens vers vos fichiers javascript

Je ne sais pas si je cherche au bon endroit, mais pouvez-vous préciser où je peux trouver ces liens javascript? Je suppose que c'est dans le fichier client / build / index.html où se trouvait le lien manifeste, mais je n'ai pas pu y trouver de liens javascript.

En fait, la suppression de la page d'accueil de package.json le corrige.

0
votes

J'ai ajouté cette modification "/ cat-cards /" dans mon fichier server.js donc maintenant c'est app.use ("/ cat-cards /", express.static (" client / build ")); . Ajouter ce changement et pousser vers Heroku a fait fonctionner mon site Web. Cela m'a aidé: https://github.com/facebook/ create-react-app / issues / 1812 # issuecomment-286511320

0 commentaires

0
votes

J'ai eu un problème similaire. Je vais l'ajouter car c'est le message SO où je me suis retrouvé en essayant de le comprendre. J'avais inclus du balisage favicon généré dans mon fichier "JS non autorisé". Mon manifest.json est dans mon répertoire src /, donc le balisage collé faisait référence à un manifeste qui n'était pas dans ma racine publique. Le code standard a ensuite renvoyé le HTML EJS "JS non autorisé ici" comme valeur de retour réelle pour le fichier manifest.json , de sorte que le navigateur l'a vu comme un JSON malformé ... Pas idéal.

Donc, si votre routeur va renvoyer ce genre de chose pour de mauvaises requêtes HTTP, comme le fait Ant Design Pro, cela pourrait être votre problème.

0 commentaires

0
votes

" rel = "nofollow noreferrer"> https://github.com/facebook/create-react-app/issues/1812#issuecomment-286511320 lien. ça marche vraiment. Je remercie la personne qui partage ce lien.

1 commentaires

Bienvenue dans Stack Overflow! Bien que ce lien puisse répondre à la question, il est préférable d'inclure un certain contexte et les parties essentielles de la réponse ici, puis de fournir le lien à titre de référence. Les réponses aux liens uniquement deviennent invalides lorsque la page liée change ou se déconnecte. Voir Comment rédiger une bonne réponse? pour plus d'informations.

0
votes

J'ai eu le même problème que je le résolve en:

Accédez au fichier package.json dans votre application react.
Vous verrez l'attribut de la page d'accueil en haut, supprimez-le ou copiez cette URL.

Si vous le supprimez, créez à nouveau une compilation et utilisez cette compilation dans votre express.static ('./ build') .
Si vous le copiez, utilisez cette URL dans votre app.use ("that copied url", express.static ('./ build')) dans votre fichier de serveur express.

0 commentaires

0
votes

Vérifiez l'index.html dans la compilation et dans votre dossier public. J'ai eu les mêmes problèmes et je viens de constater que ce problème était avec Html rien d'autre.

Merci Binod Singh

0 commentaires