Aller hop !! Suite au live coding de Pierre-Gilles, remotivation, c’est reparti :
Merci @pierre-gilles ^^
Ca sent la nuit blanche😅
7 « J'aime »
Cool! Pense à ce que j’ai dis dans le stream: commence par un petit MVP, quitte à itérer ensuite.
Si tu gère qu’un seul type de device dans une première release, c’est déjà très bien.
Commence par faire tout le process de bout en bout (front, back, test, etc…) pour que la PR soit lisible et facile à tester.
Ensuite tu pourras itérer avec d’autres appareils dans un second temps 
1 « J'aime »
Merci pour ton message !!
Oui je fais ca en parallele du revisionnage de la session et j’ai toujours en tete nos echanges précédent.
Je suis parti sur les vannes comme prévu. J’ai fais mon whimsical en 1h30 et la j’ai presque fini le primo front.
C’est clairement plus agréable y a pas !!
Vraiment c’est ça qu’il me manquait (meme si je pense que je vais galèrer sur le test, avec ta video à côté tout est plus clair !!
4 « J'aime »
Hello !!
Bon … j’ai « bien » avancé … malgré m’être frotté à la nouvelle methode d’authentification Netatmo !!
Je viens enfin de reussir la connexion en OAuth2… mais en trichant. J’aurais besoin de conseils pour ne pas faire d’usine à gaz…
@pierre-gilles, @AlexTrovato ? Auriez-vous une methode simple pour configurer le redirect_uri sur un environnement local ?
Je l’ai configuré en dur côté server pour reussir (donc ${@ip de gladys}) mais ne devrais-je pas juste recuperer les infos côté server et faire ensuite le tout côté front ? Mais comment récupérer l’adresse de depart pour remplir le redirect_uri ?
Merci par avance. Je n’ai pas trouvé d’autre exemple actuellement ecrit dans Gladys …
J’ai la même problématique sur ewelink, dès que je rentre, je te montre ma technique 
Merci beaucoup pour ta réponse @AlexTrovato
Top j’attends ton retour. Meme si j’ai avancé du coup ^^
Je pose là comme ça ce que j’avais commencé à écrire avant ta reponse ^^ on en reparle !! :
J’ai trouvé window.location.origin qui me retourne bien le href en cours. Est-ce que cela convient ? Ou bien on a déjà un objet qui retourne ça dans gladys et accessible
Dans mon front pour accéder à la page de connexion je fais un ‹ window.location.href = authUrl; › avec 'authUrl = ‹ https://api.netatmo.net/oauth2/authorize?client_id=xxxxxxxxxxxxxxxxxxxxxx&scope=read_thermostat&state=c041b83e32dd3c20f1dae2c97b8384bb&redirect_uri=http%3A%2F%2F172.26.50.62%3A1444%2Fdashboard%2Fintegration%2Fdevice%2Fnetatmo%2Fsetup ›
Ca marche bien, mais ai-je le droit ? Ou on a un outil pour le faire côté front ?
Ensuite ça redirige bien vers ‹ http://172.26.50.62:1444/dashboard/integration/device/netatmo/setup?state=9e60560558955bfb320655f145dde6d5&code=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx › avec un code que l’on récupère bien. Je compare ensuite le state de retour avec le state de départ pour valider la ‹ transaction ›.
Ensuite je dois faire une nouvelle requete par le serveur pour obtenir le ‹ access_token › et le ‹ refresh_token ›.
Pour maintenir le token on est d’accord que je fais un ‹ poll › toutes les 10000s par exemple pour { "access_token":"2YotnFZFEjr1zCsicMWpAA", "expires_in":10800, "refresh_token":"tGzv3JOkF0XG5Qx2TlKWIA", }
Edit:
Pour info j’ai push le front et ouvert une nouvelle PR. Je ferais du propre dans le server pour push demain.
Wah sacré message 
J’utilise la même astuce. Mais il faut donc bien déclarer cette URL du côté OAuth Netatmo/eWeLink.
J’ai même ajouté la vérification qu’on n’utilise pas Gladys Plus (et qu’on est bien sur une instance locale) avec cette astuce this.props.session.gatewayClient !== undefined, je me suis inspiré du service enedis :
Alors, toujours en me basant sur enedis, j’ai choisis l’option d’ouvrir un nouvel onglet qui redirige vers la page de connexion eWeLink :
Le target="_blank"permet l’ouverture d’un nouvel onglet vers le liendu href.
C’est bien ça, du coup pour mon dev en cours sur eWeLink, j’ai créé une nouvelle page qui correspond à ma redirectUrl après connexion OAuth.
Celle-ci récupère le code, le state, les envoie au serveur Gladys afin de générer le token.
Afin de récupérer les paramètres query reçus lors du redirect, je fais ça :
const { search: queryString, origin, pathname } = window.location;
const queryParams = new URLSearchParams(queryString);
// Map query params to JSON Object
const params = {};
for (const [key, value] of queryParams.entries()) {
params[key] = value;
}
Et params['code'] me fournit le code d’autorisation OAuth.
On dira, plutôt que toutes les 10000s, la durée de expires_in.
Et il faut également gérer le cas de l’erreur 401 lors de l’appel aux APIs Netatmo. Si tu reçois 401, tu tentes un refresh_token OAuth 1 seule fois. Si tu as une autre 401, alors il faudra demander à l’utilisateur Gladys de se reconnecter.
1 « J'aime »
Un grand merci d’avoir pris du temps pour tes multiples réponses à mes interrogations !!
Content d’être parti dans le bon sens, je regarde/test tout ça demain et te tiens au courant.
En effet … l’ouverture dans un nouvel onglet !! Ca m’a complètement échappé ^^
Bonne soirée
Bonsoir @AlexTrovato ,
Bon j’ai tout regardé et j’étais également parti sur le nouvel onglet … mais … pour le moment je suis revenu en arrière.
Je voulais gérer tout les états de connexion mais impossible d’obtenir les bon états avec un nouvel onglet… même avec les websockets (je me suis demandé si ça n’était pas impacté par le fait de ne plus être sur l’onglet… je n’ai rien réussi)
Pour le moment je suis revenu sur le même onglet.
J’ai push le serveur et les modifications du front.
Voilà ce que ça donne :
Tu peux voir dedans qu’à l’enregistrement les messages auraient dû passer en bleu avec un message de connection … mais il n’en ai rien. Au retour ça marche car refresh de la page 
Je despère sur la propagation des events ^^
Au début j’avais pensé afficher l’access_token au retour pour « être sûr » de la connexion, mais je me dis que le passer côté front c’est pas top.
Egalement, je pense ajouter une 2ème méthode de connexion par la suite avec possibilité de créer les tokens dans dev.netatmo et de les copier/coller.
Ah oki !! Je pensais qu’il fallait que ce soit avant la fin ^^ Merci pour l’info !!
En effet !! Merci beaucoup !
Connexion fonctionnelle !! Tests liés avancés (les 1ers sont push)
@pierre-gilles, moi qui n’y comprenais vraiment rien auparavant, ton live coding est une vrai révélation (même si y a encore des choses qui n’iront probablement pas ^^). Merci !!
Je finis les tests sur cette partie comme conseillé et je passe à la découverte des devices.
Edit : Ca avance !!
Mais je me fais vraiment ch… avec axios 
Edit 2 : Finiiii !! 
4 « J'aime »
Salut @pierre-gilles,
Est-ce qu’il ne pourrait pas être bénéfique de faire une première review pour cette partie qui est nouvelle (je veux parler notamment de la connexion OAut2). En sachant que tous les tests sont écrits pour cette partie et que visiblement si je ne m’avance pas trop, tout passe (les tests front sont en train de finir).
Ca permettrait en plus de ne pas faire une review trop longue.
Et également à moi de ne pas aller bosser sur autre chose si ce début n’est pas valable.
Merci par avance.
Edit : En sachant que je peux egalement créer une image et partager un acces api a mon compte pour ceux qui voudraient m’aider en testant la connexion pour la partie fonctionnelle (voir tester avec leur compte pour ceux qui en ont un).
J’ai parcouru rapidement la PR, et franchement c’est le jour et la nuit avec les PR que tu faisais avant, là on est clairement dans l’esprit du projet 
Est-ce que tu pourrais:
- Ajouter la gestion d’un seul type d’appareil
- Proposer un build Docker ici
Et ensuite, si on a au moins un utilisateur en réel qui dit que ça fonctionne bien chez lui, on fait une première review + un merge sur master.
L’idée, c’est de valider petit à petit ton travail tant que c’est « chaud » et ensuite de faire des mini PR pour ajouter d’autres compatibilités.
Tu penses quoi de ça ?
Trop cool si le live t’as donné des ailes, ça fait plaisir à lire !
3 « J'aime »
J’ai un thermostat NetAtmo. Prêt à tester si besoin.
1 « J'aime »
Moi j’ai des caméras Netatmo.
2 « J'aime »
Ca fait vraiment plaisir à lire !!^^
Et oui je ressens vraiment la différence !!^^
Comme je te l’avais dit, c’est vraiment la chose qui « me » manquait, notamment pour les passionnés de code qui ne sont pas codeur de métier. Comme tu me l’avais conseillé j’ai regardé beaucoup de videos / suivi des tutos. Mais je ne retrouvais rien de comparable à Gladys et difficile de se faire une comprehension générale pour le coup (je parle pour moi tout du moins)
Comme je le disais, ton live est une révélation et je pense sincèrement que ca peut booster du monde.
Ok je fais ça. C’est ce que j’avais en tete, je n’ai ciblé que le thermostat pour le moment.
J’ai lancé une image ce matin, mais du coup je vais attendre d’avoir mis ca en place.
Cela me convient parfaitement ^^
2 « J'aime »
Parfait c’est la 1ere étape ^^
Yes, je sais ^^
Ce sera la 3eme étape les cameras. La 2eme étant les vannes.
Ensuite 4eme étape les stations meteo - module principal
Etc.
Toutefois pourrais-je au moins te demander quand ce sera pret de tester la connexion et comme je prevois dans la page decouverte un petit message « compte connecté mais pas d’appareils compatibles trouvé » tu seras parfait pour tester ce message ^^
Pas de problème mon Pi est dispo pour ton image maintenant que j’ai fini avec Sonos.
1 « J'aime »
Hello,
Dans les starting blocks pour aider aux tests.
J’ai une station météo complète (incluant pluviomètre et anémomètre).
Merci d’avoir pris le dev de cette fonctionnalité
1 « J'aime »