Un utilisateur de mon application a signalé un problème aujourd'hui concernant l'autorisation de l'utilisateur avec Google (à l'aide d'OAuth 2.0). Jusqu'à présent, l'application ouvrait une nouvelle BrowserWindow (intégration de nœud désactivée, la session est séparée de l'application principale). Vous pouvez voir l'implémentation ici puisque la bibliothèque est OSS. J'utilise ceci pour autoriser l'utilisateur à accéder aux données d'application sur Google Drive. Aujourd'hui, après la connexion, je vois le message suivant:
Ce navigateur ou cette application peut ne pas être sécurisé.
Essayez d'utiliser un autre navigateur. Si vous utilisez déjà un navigateur pris en charge, vous pouvez actualiser votre écran et réessayer de vous connecter.
Le lien en savoir plus contient une section pour les développeurs. Cette section comporte 2 liens. La première consiste à mettre à niveau l'application vers PWA. Étant donné que l'application est un outil de test d'API, il ne sera pas possible de l'exécuter dans un navigateur Web. Le deuxième lien pointe vers un document décrivant comment migrer vers l'autorisation pour une application native. Cependant, le flux décrit nécessite une autorisation de code_autorisation. Cela signifie que je dois inclure le secret OAuth dans mon application. L'application Electron, cependant, est toujours une application Web et il n'y a aucune notion de compilation de sources. J'exposerais le secret du client au public qui n'est pas sécurisé. Potentiellement, je pourrais créer une application serveur pour la prendre en charge, mais l'application est un projet OSS. Il n'a pas de financement pour exécuter un serveur d'autorisation.
Ma question est maintenant de savoir comment dois-je implémenter OAuth 2 pour l'application Electron. Je ne peux pas utiliser les PWA et le flux d'autorisation du serveur (octroi de code) est loin d'être idéal dans ce cas.
3 Réponses :
Après avoir fait une supposition sauvage, j'ai décidé de modifier la chaîne de l'agent utilisateur et de supprimer le nom de l'application ainsi que Electron/ avec version. Après cette modification, il a recommencé à fonctionner.
Exemple d'implémentation:
const win = new BrowserWindow(params); let ua = win.webContents.userAgent; ua = ua.replace(/APPLICATION NAME HERE\/[0-9\.-]*/,''); ua = ua.replace(/Electron\/*/,''); win.webContents.userAgent = ua;
Cela suppose que l'application utilise symver et aucune balise de pré-version. Sinon, vous devrez modifier un peu l'expression rationnelle.
Cela n'a pas fonctionné pour moi! J'ai confirmé que mon agent utilisateur a été mis à jour.
@SumeetDarade avez-vous inspecté quel est l'agent utilisateur final? Peut-être que votre expression régulière n'est pas valide et laisse de côté des déchets que Google détecte comme non valides? (juste deviner ici)
A travaillé pour moi! Je n'ai eu qu'à supprimer Electron / * pour le faire fonctionner
Comme PaweÅ ‚l'a expliqué, changer l'agent utilisateur fera l'affaire. Cependant, vous pouvez facilement définir l'agent utilisateur en passant un objet lors du chargement de l'URL
win = new BrowserWindow({width: 800, height: 600});
win.loadURL(authUrl, {userAgent: 'Chrome'})
Je l'ai testé et ça a fonctionné comme un charme
Définir userAgent cette manière a conduit à une boucle avant infinie dans mon cas. Cependant, j'utilise un très ancien électron 1.x avec Chrome 59. Quelle est la version de votre application?
Vous monsieur, êtes un génie!
Attention: cette réponse repose sur le changement de user-agent du navigateur. Depuis janvier 2021, Google désapprouve cela et met en garde de ne pas le faire (voir EDIT4). À utiliser à vos risques et périls!
Les autres réponses n'ont pas fonctionné pour moi (dans Electron 9.0.5), mais j'ai finalement trouvé ceci, qui a fonctionné:
app.userAgentFallback = "Chrome";
EDIT : Deux autres approches, que je n'ai pas testées, mais qui peuvent également fonctionner:
app.on("ready", ()=>{
session.defaultSession.setUserAgent("Chrome");
...
}
app.on("ready", ()=> {
session.defaultSession.webRequest.onBeforeSendHeaders((details, callback) => {
details.requestHeaders["User-Agent"] = "Chrome";
callback({ cancel: false, requestHeaders: details.requestHeaders });
});
CreateMainWindow(); // your regular code to create root browser window
});
EDIT2 : réessayer quelque temps plus tard, l'approche n ° 2 n'a pas fonctionné, mais la n ° 1 l'a toujours fonctionné. Je n'ai pas encore essayé le n ° 3.
EDIT3 : En réessayant plus tard encore, il semble qu'aucune de ces solutions de contournement ne soit plus nécessaire! Google semble accepter à nouveau les fenêtres contextuelles de connexion des applications Electron, sans modification de l'agent utilisateur. (étrange qu'ils reviennent; peut-être que j'ai juste fait quelque chose de mal lors de ma nouvelle tentative)
EDIT4 : Bien que l'approche n ° 1 fonctionne toujours atm, j'ai récemment trouvé ce billet de blog: https://developers.googleblog.com/2020/08/guidance-for-our-effort-to-block-less-secure-browser-and -apps.html Apparemment, Google limite l'utilisation de la connexion à Google dans les navigateurs non standard (qui incluent probablement Electron) à partir de janvier 2021, et avertit les développeurs de ne pas modifier l'agent utilisateur de leur navigateur (ce que les trois possibilités que j'ai mentionner faire). À utiliser à vos risques et périls! (ils n'indiquent pas clairement le résultat, mais pour mon propre usage, je choisis d'utiliser l'alternative ci-dessous à partir de maintenant)
Au lieu d'utiliser une fenêtre contextuelle de connexion Google dans votre application (ce dont certains pourraient se méfier, car les applications Electron pourraient en principe insérer du code dans la fenêtre contextuelle pour lire le mot de passe brut - pas que cela compte beaucoup, car les applications Electron pourrait simplement installer des enregistreurs de frappe ou similaires), vous pouvez à la place ouvrir un onglet dans le navigateur externe normal de l'utilisateur, pointer vers une page spéciale qui déclenche une fenêtre de connexion là-bas, puis envoyer simplement les informations d'identification à votre application Electron par la suite.
Les instructions peuvent être consultées ici (approche 3): https://stackoverflow.com/a/64328193/2441655