Bonjour à tous,
Pour information j'uitlise un Mac et un Iphone.
J'ai un soucis de communication avec mon API NodeJS et mon application React Native Expo.
Voici mon serveur :
J'ai par exemple une route entreprises qui fonctionne très bien sur Postman et mon navigateur, cependant que j'essaye de l'appeler via expo :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38 import fastify from 'fastify'; import systemesRoutes from './routes/systemesRoute'; import entreprisJesRoutes from './routes/Entreprise/entrepriseRoute'; import fastifySwagger from '@fastify/swagger'; import fastifySwaggerUi from '@fastify/swagger-ui'; import { swaggerOptions, swaggerUiOptions } from './plugins/swagger'; import cors from '@fastify/cors'; const server = fastify(); // Enregistrement des plugins Swagger avec la configuration importée server.register(fastifySwagger, swaggerOptions); server.register(fastifySwaggerUi, swaggerUiOptions); // Configuration de CORS pour Fastify const corsOptions = { origin: '*', // Configurez l'origine selon vos besoins methods: ['GET', 'POST', 'OPTIONS', 'PUT', 'PATCH', 'DELETE'], // Méthodes autorisées allowedHeaders: ['Content-Type', 'Authorization', 'x-access-token', 'Origin', 'X-Requested-With', 'Accept'], // En-têtes autorisés exposedHeaders: ['Content-Range', 'X-Content-Range'], // En-têtes exposés credentials: true, // Autorise l'envoi des cookies }; // Enregistrement du plugin Fastify CORS server.register(cors, corsOptions); // Enregistrement des routes server.register(systemesRoutes); server.register(entreprisesRoutes); // Ecoute du serveur server.listen({ port: 8080 }, (err, address) => { if (err) { console.error('Error starting the server:', err); process.exit(1); } console.log(`Server listening at ${address}`); });
Instance Axios react native :
// Vous pouvez également ajouter d'autres intercepteurs pour les requêtes, les réponses, etc.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29 import axios from 'axios'; const API_URL = 'http://localhost:8080/'; const instanceAxios = axios.create({ baseURL: API_URL, headers: { 'Content-Type': 'application/json', // Autres en-têtes communs... }, }); // Ajouter un intercepteur pour gérer les erreurs instanceAxios.interceptors.response.use( response => response, error => { if (error.response) { // Le serveur a renvoyé une réponse avec un code d'erreur console.error('Server responded with an error:', error.response.status); } else if (error.request) { // La requête a été faite mais aucune réponse n'a été reçue console.error('No response received:', error.request); } else { // Une erreur s'est produite lors de la configuration de la requête console.error('Request failed:', error.message); } return Promise.reject(error); } );
export default instanceAxios;
Mon appel :
Mon erreur :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15 // Méthode pour récupérer les entreprises en tendance async getTrendingEnterprises() { try { console.log('Tendance') //entreprises/tendances //localhost const response = await axiosInstance.get('entreprises/tendance'); console.log('ici') console.log(response) return response.data; } catch (error) { throw new Error(error); } },
Je pensais à un probléme de cors mais je les ai ajouté à mon api mais ça ne fonctionne pas sur iphone mais ça fonctionne sur mon navigateur web sur mac et postmaniOS Bundling complete 52ms
LOG Tendance
ERROR No response received: {"DONE": 4, "HEADERS_RECEIVED": 2, "LOADING": 3, "OPENED": 1, "UNSENT": 0, "_aborted": false, "_cachedResponse": undefined, "_hasError": true, "_headers": {"accept": "application/json, text/plain, */*"}, "_incrementalEvents": false, "_lowerCaseResponseHeaders": {}, "_method": "GET", "_perfKey": "network_XMLHttpRequest_http://localhost:8080/entreprises/tendance", "_performanceLogger": {"_closed": false, "_extras": {}, "_isLoggingForWebPerformance": false, "_pointExtras": {}, "_points": {"initializeCore_end": 241067806.532208, "initializeCore_start": 241067728.404041}, "_timespans": {"network_XMLHttpRequest_http://192.168.0.204:8081/logs": [Object], "network_XMLHttpRequest_http://localhost:8080/entreprises/tendance": [Object]}}, "_requestId": null, "_response": "Could not connect to the server.", "_responseType": "", "_sent": true, "_subscriptions": [], "_timedOut": false, "_trackingName": "unknown", "_url": "http://localhost:8080/entreprises/tendance", "readyState": 4, "responseHeaders": undefined, "status": 0, "timeout": 0, "upload": {}, "withCredentials": true}
ERROR Error fetching trending enterprises: [Error: AxiosError: Network Error]
Avez-vous des pistes ?
Merci d'avance
Partager