Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Page de connexion avec callback #5

Open
Nostres25 opened this issue May 12, 2023 · 9 comments
Open

Page de connexion avec callback #5

Nostres25 opened this issue May 12, 2023 · 9 comments

Comments

@Nostres25
Copy link

Bonjour ! Est-ce que c'est possible de faire en sorte de rediriger des utilisateurs vers une page de connexion pronote ou monlycee.net pour éviter qu'en tant que propriétaire du programme, on ai accès aux mots de passes envoyés par les utilisateurs pour la connexion avec la fonction login(...). Un peut comme Microsoft ou google. L'utilisateur se rend sur la page de connexion, il se connecte puis après le programme a accès à sa session comme si on avait fais un login(...).
Je ne sais pas si je suis clair

@Merlode11
Copy link
Owner

Bonjour,

Je vois très bien votre idée et elle n'est pas si mauvaise. Le problème est que Pronote ne possède pas de page de connexion tel que Google, Facebook, Microsoft le proposent. Ce système fonctionne avec un retour au site de la connexion, or Pronote ne peut pas renvoyer au site qui permet la connexion les informations de cette connexion.
Les outils comme Google ou Apple possède leur propre page de connexion extérieure et renvoie au site qui demande la connexion les informations. Ce qui n'est donc pas du tout le cas de Pronote.

La solution serait, comme toutes les propositions de connexion que j'ai vu sur des sites, de faire une page personnelle demandant les identifiants pour ensuite vérifier que ceux-ci sont corrects.

Désolé pour ma solution qui n'est pas à votre demande, mais malheureusement Pronote ne le permet pas du tout.

@HGStyle
Copy link

HGStyle commented Jun 10, 2023

J'ai une potentielle idée...
Je ne suis pas très fort en NodeJS (je n'ai jamais vraiment fait de vrai programme dans ce language) mais il me semble qu'il existe un outil NodeJS nommé Browserify, permettant de "convertir" un programme NodeJS en JavaScript pour navguateur. Ce serai une bonne idée car il y a un second problème à votre serveur, c'est que si Index Education met la main sur l'IP de votre serveur (ce qui est très facile, vous le savez je pense) il peuvent vous bloquer, alors que si c'est la machine des utilisateurs qui envoient les requêtes, c'est impossible à bloquer, Index Education ne vas pas bloquer la machine de tout le monde quand même, car ils ne pourrais plus aller sur ProNote.

J'ai essayé Browserify mais je ne comprends pas très bien comment l'outil fonctionne...
Je sais qu'il faut faire une inititalisation d'NPM, puis installer pronote-api-maintained avec NPM, puis créer un simple script index.js dans lequel on importe avec require le package puis on l'exporte avec module.exports (genre comme code simple: module.exports = require("pronote-api-maintained");) MAIS il y a plusieurs erreures après avoir fait cela:

  1. Le bundle (code généré par Browserify) utilise plusieurs fois delete alors que les naviguateurs ne le supporte pas car ils utilisent un truc appelé le strict-mode... Il faut donc éditer le bundle pour remplacer les instructions delete variable; par variable = null; sauf pour les dictionnaires et les listes, qui, il me semble, supporte delete en strict-mode
  2. Browserify ne détecte pas les autres fichiers importés avec des boucles. Je ne pense pas être très clair, mais en gros, le code suivant: (je ne sais pas si il est valide mais vous comprendrez l'idée)
var modules_importes = [];
var mes_modules = ["module1", "module2", "module3"];
for (let module of mes_modules) { modules_importes.push(require(module)); }

Ce code ne sera pas compris par Browserify car l'importation n'est pas implémenté dans le code comme Browserify l'attends et les modules ne seront pas importés dans le bundle. Ce type de code est utilisé pour importer tout les paramètres de tout les CAS, ce qui était une bonne idée en soi mais ici, il faudra donc modifier avant d'utiliser Browserify le code du module téléchargé et installé via NPM pour inclure les modules.

Je ne me souvient pas si il y a autre chose à préciser, car j'essaye de faire un truc avec une interface web pour ProNote qui utilise sa mais tout dans le naviguateur, et donc j'ai besoin d'un bundle que je n'est pas encore fini.
Je l'enverrai sur ce thread si je réussit à finir le bundle.
A plus tard, HGStyle.

@Nostres25
Copy link
Author

J'ai une potentielle idée...
Je ne suis pas très fort en NodeJS (je n'ai jamais vraiment fait de vrai programme dans ce language) mais il me semble qu'il existe un outil NodeJS nommé Browserify, permettant de "convertir" un programme NodeJS en JavaScript pour navguateur. Ce serai une bonne idée car il y a un second problème à votre serveur, c'est que si Index Education met la main sur l'IP de votre serveur (ce qui est très facile, vous le savez je pense) il peuvent vous bloquer, alors que si c'est la machine des utilisateurs qui envoient les requêtes, c'est impossible à bloquer, Index Education ne vas pas bloquer la machine de tout le monde quand même, car ils ne pourrais plus aller sur ProNote.

J'ai essayé Browserify mais je ne comprends pas très bien comment l'outil fonctionne...
Je sais qu'il faut faire une inititalisation d'NPM, puis installer pronote-api-maintained avec NPM, puis créer un simple script index.js dans lequel on importe avec require le package puis on l'exporte avec module.exports (genre comme code simple: module.exports = require("pronote-api-maintained");) MAIS il y a plusieurs erreures après avoir fait cela:

  1. Le bundle (code généré par Browserify) utilise plusieurs fois delete alors que les naviguateurs ne le supporte pas car ils utilisent un truc appelé le strict-mode... Il faut donc éditer le bundle pour remplacer les instructions delete variable; par variable = null; sauf pour les dictionnaires et les listes, qui, il me semble, supporte delete en strict-mode
  2. Browserify ne détecte pas les autres fichiers importés avec des boucles. Je ne pense pas être très clair, mais en gros, le code suivant: (je ne sais pas si il est valide mais vous comprendrez l'idée)
var modules_importes = [];
var mes_modules = ["module1", "module2", "module3"];
for (let module of mes_modules) { modules_importes.push(require(module)); }

Ce code ne sera pas compris par Browserify car l'importation n'est pas implémenté dans le code comme Browserify l'attends et les modules ne seront pas importés dans le bundle. Ce type de code est utilisé pour importer tout les paramètres de tout les CAS, ce qui était une bonne idée en soi mais ici, il faudra donc modifier avant d'utiliser Browserify le code du module téléchargé et installé via NPM pour inclure les modules.

Je ne me souvient pas si il y a autre chose à préciser, car j'essaye de faire un truc avec une interface web pour ProNote qui utilise sa mais tout dans le naviguateur, et donc j'ai besoin d'un bundle que je n'est pas encore fini.
Je l'enverrai sur ce thread si je réussit à finir le bundle.
A plus tard, HGStyle.

Bonjour !
Ça m'a l'air bien intéressant tout ça.
Browserify fonctionne de cette façon ? :
L'utilisateur va se rendre sur la page de connexion monlycee.net mais avec du code JavaScript supplémentaire qui tourne sur son navigateur, ce qui me permettra de récupérer ensuite l'objet de la session pronote une fois la connexion effectuée ?

@HGStyle
Copy link

HGStyle commented Jun 10, 2023

J'ai une potentielle idée...
Je ne suis pas très fort en NodeJS (je n'ai jamais vraiment fait de vrai programme dans ce language) mais il me semble qu'il existe un outil NodeJS nommé Browserify, permettant de "convertir" un programme NodeJS en JavaScript pour navguateur. Ce serai une bonne idée car il y a un second problème à votre serveur, c'est que si Index Education met la main sur l'IP de votre serveur (ce qui est très facile, vous le savez je pense) il peuvent vous bloquer, alors que si c'est la machine des utilisateurs qui envoient les requêtes, c'est impossible à bloquer, Index Education ne vas pas bloquer la machine de tout le monde quand même, car ils ne pourrais plus aller sur ProNote.
J'ai essayé Browserify mais je ne comprends pas très bien comment l'outil fonctionne...
Je sais qu'il faut faire une inititalisation d'NPM, puis installer pronote-api-maintained avec NPM, puis créer un simple script index.js dans lequel on importe avec require le package puis on l'exporte avec module.exports (genre comme code simple: module.exports = require("pronote-api-maintained");) MAIS il y a plusieurs erreures après avoir fait cela:

  1. Le bundle (code généré par Browserify) utilise plusieurs fois delete alors que les naviguateurs ne le supporte pas car ils utilisent un truc appelé le strict-mode... Il faut donc éditer le bundle pour remplacer les instructions delete variable; par variable = null; sauf pour les dictionnaires et les listes, qui, il me semble, supporte delete en strict-mode
  2. Browserify ne détecte pas les autres fichiers importés avec des boucles. Je ne pense pas être très clair, mais en gros, le code suivant: (je ne sais pas si il est valide mais vous comprendrez l'idée)
var modules_importes = [];
var mes_modules = ["module1", "module2", "module3"];
for (let module of mes_modules) { modules_importes.push(require(module)); }

Ce code ne sera pas compris par Browserify car l'importation n'est pas implémenté dans le code comme Browserify l'attends et les modules ne seront pas importés dans le bundle. Ce type de code est utilisé pour importer tout les paramètres de tout les CAS, ce qui était une bonne idée en soi mais ici, il faudra donc modifier avant d'utiliser Browserify le code du module téléchargé et installé via NPM pour inclure les modules.
Je ne me souvient pas si il y a autre chose à préciser, car j'essaye de faire un truc avec une interface web pour ProNote qui utilise sa mais tout dans le naviguateur, et donc j'ai besoin d'un bundle que je n'est pas encore fini.
Je l'enverrai sur ce thread si je réussit à finir le bundle.
A plus tard, HGStyle.

Bonjour ! Ça m'a l'air bien intéressant tout ça. Browserify fonctionne de cette façon ? : L'utilisateur va se rendre sur la page de connexion monlycee.net mais avec du code JavaScript supplémentaire qui tourne sur son navigateur, ce qui me permettra de récupérer ensuite l'objet de la session pronote une fois la connexion effectuée ?

En fait non, tu devras créer ta propre page de connection qui, quand tu cliques sur le bouton de connection, va en réalité éxécuter du code JavaScript que tu aura codé qui utilise la version pour naviguateur (le fameux bundle) généré avec Browserify pour avoir l'identifiant de session, le sauvegarder en cookie dans le naviguateur par example, puis ton propre code JavaScript redirigera l'utilisateur sur une seconde page qui chargera le cookie, donc l'identifiant de session, ce connectera à ProNote pour faire, via le bundle du package pronote-api (nommé pronote-api-maintained sur NPM) des actions sur le compte de la personne comme voir ses notes (le principe fondamental de ProNote ptdr)
Mais tu aura ta propre page de connection, pas celle de ProNote ou de l'ENT/CAS de l'utilisateur. Mais ce n'est pas grave, il suffit de mettre ton code en open-source sur GitHub par example, mettre sur le site un petit texte "Aucune donnée ne quitte le naviguateur, code source sur [lien] GitHub" et la pluspart des utilisateurs seront OK.
Tu pourrais aussi télécharger le HTML, CSS et potentiel code JavaScript de la page de connection à ProNote de manière à copier le site officiel, mais ceci est une mauvaise idée car pas mal d'utilisateurs penseront qu'il s'agit d'un site de phishing, ou autre type de site malveillant car l'interface est la même que celle de ProNote.
Comme tu l'aura certainement compris, ton site n'utilisera pas un poil de NodeJS mais de pas mal de code en JavaScript pour naviguateur, mais ses deux languages se ressemblent énormément, donc si tu ne connait pas l'un, il y a quand même de grandes chances que ton propre code JavaScript qui utilise le bundle de pronote-api fonctionne.

@HGStyle
Copy link

HGStyle commented Jun 10, 2023

Je viens de remarquer dans le bundle une troisième erreur: SharedArrayBuffer n'est pas défini si le site est non-sécurisé (si le site utilise http:// au lieu de https://)
Il n'y a pas ce problème avec les sites sécurisés (https://).
Aussi, il faut avoir 2 headers spécifiques paramétrés à ces valeures:
Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp
Sinon sa risque de ne pas marcher, y'a plus d'info sur les protections de SharedArrayBuffer ici: https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/SharedArrayBuffer

@Nostres25
Copy link
Author

Ok. Effectivement ça marche étant donné que les utilisateurs peuvent vérifier le code source de la page.
Ça m'aidera probablement pour de futur projet. Merci à toi !

@HGStyle
Copy link

HGStyle commented Jun 10, 2023

De rien ! Je suis en train de créer un bundle fonctionnel, sa prends du temps car y'a pas mal de choses à modifier, pas que du module pronote-api mais aussi des autres modules utilisés par pronote-api...

@HGStyle
Copy link

HGStyle commented Jun 10, 2023

Malheureusement je ne crois pas y arriver... Quand je règle une erreur, une autre arrive, et c'est plustot chiant car elles sont de plus en plus compliqués à résoudre... J'upload le bundle que j'ai modifié même si il ne fonctionne pas, j'ai actuellement 2 erreures incompréhensibles pour moi, car les deux sont des erreures qui disent "Erreur: Cette variable n'existe pas" alors que le code essaye de la définir ! Si quelqu'un a une idée, je veux bien essayer de reprendre le bundle en main, mais je suis à cours d'idées pour régler les problèmes...
pronote-api-browser.zip
Voici un ZIP contenant tout les fichiers que j'ai utilisé. J'ai utilisé un Repl sur https://replit.com/ pour essayer le code en ligne.

@anyoneoruser
Copy link

Pour remplacer les bouts de code par d'autres, Visual Studio Code est un éditeur de code très complet qui peut faire l'affaire. Il peut être téléchargé ici. Il doit y avoir des extensions qui font le travail de Browserify et il est possible de remplacer des occurences.
Il y a des extensions qui utilisent ChatGPT comme ChatGPT AI et l'IA pourrait vous aider pour ce genre de problème.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants