Partage
  • Partager sur Facebook
  • Partager sur Twitter

Comment écouter un serveur Mercure via ReactNative

    19 juillet 2021 à 10:49:01

    Bonjour;

    J'ai actuellement une application mobile réalisée avec React Native ainsi qu'une API réalisée avec Symfony grâce à API Platform.

    Les deux applications communiquent bien entre elles.

    Pour créer un système de notification sur l'application, j'ai ajouté et configuré un serveur Mercure.

    Cependant, il semble y avoir un problème de communication entre l'API et l'application depuis l'ajout de Mercure.

    Je tiens à préciser que j'ai testé exactement la même configuration via un projet web avec ReactJS et que je n'ai eu aucun problème.

    Je soupçonne donc un problème d'accès entre Mercure et l'application. (j'utilise expo pour tester mon application en local, ainsi que ngrok pour avoir accès à mon local)


    Voici mon fichier symfony .env

    MERCURE_URL=http://127.0.0.1:3000/.well-known/mercure
    MERCURE_PUBLIC_URL=http://127.0.0.1:3000/.well-known/mercure
    MERCURE_PUBLISH_URL=http://127.0.0.1:3000/.well-known/mercure
    MERCURE_JWT_SECRET=mykeyp
    MERCURE_PUBLISHER_JWT_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJtZXJjdXJlIjp7InB1Ymxpc2giOlsiKiJdfX0.Gvmkhs_Nx9S7yNyNs_TUghfcruiNrNKQBA0D36cGQSA
    MERCURE_SUBSCRIBER_JWT_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJtZXJjdXJlIjp7InB1Ymxpc2giOlsiKiJdfX0.Mzezd1YtkgCmlEDQg4qwNCFql1JXCXk1Vg-tB8UHgSk
    


    Voici la commande utilisée pour lancer le serveur Mercure


    SERVER_NAME=:3000 MERCURE_PUBLISHER_JWT_KEY="mykeyp" MERCURE_SUBSCRIBER_JWT_KEY="mykeys" ./mercure/mercure run -config mercure/Caddyfile.dev CORS_ALLOWED_ORIGINS=https://localhost:8000


    J'utilise ngrok pour contacter mon API via mon application mobile. J'ai également essayé de lancer ngrok sur le port 3000 pour contacter Mercure mais j'ai toujours cette erreur : 401 Unauthorized.


    Voici mon code js :

    const uri = encodeURIComponent(`${api_address}/api/users/3`);
            const eventSource = new RNEventSource(`${mercure_address}/.well-known/mercure?topic=${uri}`);
            eventSource.addEventListener('message', (event) => {
                let data = JSON.parse(event.data);
                console.log(data)
            }
    )

    Je souhaite également préciser que Symfony est lancé sur le port 8000 et Mercure sur le port 3000.

    Merci par avance.

    • Partager sur Facebook
    • Partager sur Twitter

    Comment écouter un serveur Mercure via ReactNative

    × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
    × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
    • Editeur
    • Markdown