Désactiver le service worker de Create React App

Julien Dussart
Leikir Web
Published in
2 min readOct 3, 2018

Si comme moi vous avez oublié de retirer le service worker ajouté par défaut par Create React App et que vous avez déployé en production, voici comment le retirer proprement.

Le problème

Create React App ajoute par défaut un service worker. S’il est utile dans certains cas (notamment pour réaliser une PWA), il est parfois superflu et peut mener à des comportements non désirés en production. Dans mon cas, une API et une appli React cohabitent sur le même domaine. Quand l’application React fait une requête au back end, tout se passe bien. Ça se complique quand un lien d’un mail est à destination du backend. Il empêche ces requêtes d’atteindre l’API, en cherchant la route en offline. Ce qui bien sûr ne peut pas marcher.

Si vous avez fait l’erreur d’oublier de le retirer avant de mettre en production votre application, un service worker est enregistré pour votre domaine. Vous vous dites que ce n’est pas bien grave et que vous allez le retirer du code, déployer et le tour est joué. Sauf que non, ça ne marchera pas. Les navigateurs compatibles l’ont déjà enregistré et vont le conserver tant que vous ne leurs dites pas gentiment de le supprimer pour votre domaine.

La solution

Pour le retirer c’est simple, il vous suffit d’importer la fonction unregister au lieu de register et bien sûr de l’appeler. Ca se passe dans le fichier src/index.js :

Pour plus d’informations sur le service worker inclut par Create React App, voici la documentation 👈.

Après quelques jours ou semaines, vos utilisateurs n’auront plus de service worker enregistré pour votre domaine. Vous pourrez alors supprimer le fichier du service worker, ainsi que l’import et l’appel à la fonction unregister.

© GIPHY

Comme disait ma grand-mère, quand on n’a pas de tête, on a des jambes. En l’occurrence j’ai cette astuce maintenant.

Originally published at web.leikir.io on October 3, 2018.

--

--