Nicolas Cantu
065ab30828
**Motivations:** - Corriger l'erreur 404 pour favicon.ico demandé par les navigateurs - Corriger l'erreur 500 de l'API NIP-95 upload empêchant les uploads de fichiers **Root causes:** - Fichier favicon.ico manquant dans public/ causant des erreurs 404 répétées - Incompatibilité entre form-data (npm) et fetch() natif de Node.js dans l'API NIP-95 **Correctifs:** - Ajout de favicon.svg et mise à jour des références dans les pages - Remplacement de fetch() par https/http natifs de Node.js dans nip95-upload.ts - Amélioration de la gestion des erreurs et nettoyage des fichiers temporaires **Evolutions:** - Documentation des problèmes et solutions dans fixKnowledge/ **Pages affectées:** - components/HomeView.tsx - pages/docs.tsx - pages/presentation.tsx - pages/api/nip95-upload.ts - features/account-creation-buttons-separation.md - fixKnowledge/favicon-404-error.md (nouveau) - fixKnowledge/nip95-upload-500-error.md (nouveau) - public/favicon.svg (nouveau)
58 lines
2.7 KiB
Markdown
58 lines
2.7 KiB
Markdown
# Problème : favicon.ico retourne 404
|
|
|
|
## Date
|
|
2025-01-27
|
|
|
|
## Problème
|
|
Le navigateur demandait automatiquement `/favicon.ico` mais le fichier n'existait pas dans le dossier `public/`, causant une erreur 404.
|
|
|
|
## Symptômes
|
|
- Console navigateur : `Failed to load resource: the server responded with a status of 404 ()`
|
|
- Erreur répétée sur toutes les pages : `favicon.ico:1 Failed to load resource: the server responded with a status of 404 ()`
|
|
- Aucun favicon affiché dans les onglets du navigateur
|
|
|
|
## Root cause
|
|
Le fichier `favicon.ico` n'existait pas dans le dossier `public/`, mais plusieurs pages référençaient `/favicon.ico` dans leur balise `<Head>` :
|
|
- `components/HomeView.tsx`
|
|
- `pages/presentation.tsx`
|
|
- `pages/docs.tsx`
|
|
|
|
Les navigateurs demandent automatiquement `/favicon.ico` même si une autre icône est spécifiée, ce qui causait l'erreur 404.
|
|
|
|
## Impact
|
|
- Erreurs 404 répétées dans les logs du serveur
|
|
- Aucun favicon affiché dans les onglets du navigateur
|
|
- Expérience utilisateur dégradée
|
|
|
|
## Correctifs
|
|
1. Création d'un fichier `favicon.svg` minimal dans `public/`
|
|
2. Mise à jour des références dans les fichiers pour pointer vers `/favicon.svg` au lieu de `/favicon.ico`
|
|
3. Ajout du type MIME `image/svg+xml` dans les balises `<link>`
|
|
|
|
## Modifications
|
|
- **Fichier créé** : `public/favicon.svg` (SVG minimal avec un rectangle cyan)
|
|
- **Fichiers modifiés** :
|
|
- `components/HomeView.tsx` : `<link rel="icon" href="/favicon.svg" type="image/svg+xml" />`
|
|
- `pages/presentation.tsx` : `<link rel="icon" href="/favicon.svg" type="image/svg+xml" />`
|
|
- `pages/docs.tsx` : `<link rel="icon" href="/favicon.svg" type="image/svg+xml" />`
|
|
|
|
## Modalités de déploiement
|
|
1. Les modifications sont dans le code source
|
|
2. Le fichier `favicon.svg` est servi automatiquement par Next.js depuis le dossier `public/`
|
|
3. Rebuild de l'application : `npm run build`
|
|
4. Redémarrage du service Next.js si nécessaire
|
|
5. Aucune configuration supplémentaire nécessaire
|
|
|
|
## Modalités d'analyse
|
|
Pour vérifier si le problème existe :
|
|
1. Vérifier la présence du fichier `public/favicon.svg`
|
|
2. Vérifier les références dans les fichiers HTML (balises `<link rel="icon">`)
|
|
3. Tester dans le navigateur : accéder à `/favicon.svg` et vérifier qu'il est servi
|
|
4. Vérifier les logs du serveur pour les erreurs 404 sur `/favicon.ico`
|
|
|
|
## Notes
|
|
- Les navigateurs modernes supportent les SVG comme favicon
|
|
- SVG est plus léger et plus flexible qu'un fichier .ico
|
|
- Si nécessaire, on peut créer un fichier `.ico` en plus pour la compatibilité avec les anciens navigateurs
|
|
- Le favicon SVG actuel est minimal (rectangle cyan) et peut être remplacé par un design plus élaboré si nécessaire
|