Votre Tarte aux framboises fonctionne très bien sur votre réseau local et vous pouvez même utiliser un Raspberry Pi comme serveur Web Là. Mais que se passe-t-il si vous souhaitez écrire une application Web qui permettra à quelqu'un d'accéder au matériel de votre Pi, sa caméra par exemple, à partir d'un navigateur Web n'importe où sur Internet? Il est assez facile d’utiliser Anvil, un service Web Python que vous pouvez exécuter localement.
Anvil fournit un moyen puissant mais simple d'écrire des applications Web à pile complète en Python pur et il est avec nous depuis quelques années en tant que service uniquement en ligne, nécessitant l'utilisation des serveurs d'Anvil pour créer des projets. Votre projet est hébergé sur leurs serveurs et il peut communiquer avec une machine distante, par exemple un Raspberry Pi, à l'aide d'un script de liaison montante sur le Pi. Cependant, il n'est plus nécessaire de compter sur les propres serveurs d'Anvil, car l'équipe d'Anvil a récemment ouvert serveur d'application permettant à quiconque de créer ses propres projets à l'aide du service Web Anvil, puis de télécharger et d'exécuter le même projet sur son propre serveur.
Ce tutoriel vous montre comment créer une application de style photobooth à l'aide d'un Raspberry Pi et d'un module de caméra (nous vous recommandons d'utiliser un Raspberry Pi 4 et le nouveau Appareil photo Raspberry Pi de haute qualité). L'application sera accessible à distance en utilisant une application de tunnel facile à configurer qui dirigera le trafic vers notre Pi, même à travers un pare-feu.
Sommaire
De quoi as-tu besoin
- Raspberry Pi (de préférence un Raspberry Pi 4, mais tout autre modèle devrait également fonctionner)
- Appareil photo Raspberry Pi (appareil photo de qualité Pi préféré)
- La dernière version de Raspbian installée sur votre carte microSD
Connexion du module de caméra
1. Insérez le connecteur de la caméra dans le port de la caméra (CSI) qui pour les cartes du modèle B se situe entre le port HDMI et le port composite. Soulevez doucement le couvercle en plastique et insérez le câble avec la languette bleue face aux ports Ethernet / USB. Repoussez le couvercle en plastique pour verrouiller le câble
2. Activer l'interface de la caméra sur votre Raspberry Pi. Lancez simplement l'application Préférences sur votre Pi, allez dans l'onglet Interfaces, activez l'interface de la caméra, puis redémarrez le Pi.
Débuter avec Anvil
3. Installer le serveur d'applications Anvil en tapant ce qui suit à l'invite de commande sur votre Pi.
$ sudo pip3 installe anvil-app-server
4. Créer une nouvelle application vierge à anvil.works. Ouvrez un navigateur Web pour http://anvil.works et cliquez sur «Commencer la construction» pour vous inscrire à un compte gratuit. Créez une nouvelle application vierge et utilisez le thème Material Design.
L'éditeur Anvil s'ouvre maintenant et au centre de l'écran se trouve un formulaire sur lequel nous créons notre interface utilisateur.
Construire votre application photo dans Anvil
5. Faites glisser un bouton de la boîte à outils dans Form1 et placez-le en haut du formulaire.
6. Modifier le texte de ce bouton en modifiant le champ de texte dans Propriétés.
7. Faites glisser une image de la boîte à outils et placez-la sous le bouton. Faites glisser la zone d'image pour redimensionner selon vos besoins. L'image capturée par la caméra sera affichée ici et mise à l'échelle pour s'adapter à la zone d'image.
8. Double-cliquez sur le bouton pour ouvrir l'éditeur de code et mettre en évidence la section de code du bouton.
9. Ajoutez le code suivant à la ligne 3 de votre application.
import anvil.server
Ensuite, à la ligne 15, nous ajoutez le code suivant ce qui changera l'image affichée sur l'application en exécutant du code sur notre serveur d'applications. Ce code est une fonction que nous allons créer plus tard dans le projet. Notez que ce code est automatiquement mis en retrait pour montrer qu'il appartient à l'intérieur de la fonction "button_1_click ()"
self.image_1.source = anvil.server.call ('takepic')
dix. Accédez au CODE SERVEUR sur le côté gauche de votre écran et cliquez sur Camera_Controller, puis cliquez sur "Ajouter un nouveau module serveur" Cela créera une zone où nous pouvons écrire le code qui déclenchera la prise de photo de la caméra.
11. Importez deux modules de code Python sur les lignes 2 et 3. Le premier permettra à Anvil de gérer les images dans notre application. Le second permet d'accéder à la caméra Raspberry Pi.
import anvil.media
de picamera importer PiCamera
12. Ajoutez l'objet caméra. À la ligne 4, nous créer un objet que nous pouvons utiliser pour contrôler la caméra. Ligne 5 configure la caméra pour utiliser la résolution maximale pour la caméra HQ. Si vous utilisez un appareil photo plus ancien, modifiez-le pour refléter vos besoins.
camera = PiCamera ()
camera.resolution = (4056, 3040)
13. Créer la fonction takepic (). La ligne 20 voit un décorateur Python utilisé pour identifier une zone de code qui peut être appelée par le serveur Anvil. Ce code est notre fonction «takepic», appelée lorsque le bouton est cliqué. Cette fonction va capturer une image et l'enregistrer en tant que «foo.jpg», puis à la ligne 23, nous renvoyons ce fichier en tant qu'objet multimédia qu'Anvil peut ensuite afficher dans l'application.
@ anvil.server.callable
def takepic ():
camera.capture ('foo.jpg')
return anvil.media.from_file ('foo.jpg')
Faire fonctionner le code Anvil sur votre Raspberry Pi
14. Cliquez sur l'icône Cog, puis sélectionnez «Partager l'application…» puis cliquez sur «Cloner avec Git». Cela téléchargera tout le code sur notre Raspberry Pi.
15. Copiez l'URL commençant par «git clone» et collez-la dans un terminal, puis appuyez sur Entrée. Vous aurez besoin de l'e-mail et du mot de passe de votre compte Anvil pour vous authentifier.
16. Accédez au répertoire contenant le code Anvil, appelé Camera_Controller, dans la fenêtre de votre terminal.
$ cd Camera_Controller
17. Tapez ce qui suit pour exécuter Anvil App Server et chargez le fichier de configuration de l'application. Notez que cela prendra un certain temps, surtout au début car il doit télécharger ~ 200 Mo de fichiers
$ anvil-app-server --config-file anvil.yaml
Une fois que nous voyons «Downlink authentifié OK», nous savons que le code Anvil a été exécuté avec succès.
18. Ouvrez un navigateur sur localhost: 3030 et vous verrez l'application. Cliquez sur le bouton TakePic et après quelques secondes, l'image apparaîtra dans l'application
Un autre appareil sur le même réseau peut également contrôler l'application dont nous avons juste besoin pour remplacer «localhost» par l'adresse IP de notre Pi. Ce qui peut être trouvé en passant la souris sur l'icône WiFi pour qu'un pop-up apparaisse avec les détails.
Ajout d'un tunnel sécurisé pour l'accès à Internet
Il est maintenant temps de créer un tunnel sécurisé vers notre serveur Raspberry Pi afin que nous puissions y accéder depuis l'extérieur de notre réseau. Si vous ne le souhaitez pas, vous pouvez ignorer ces étapes.
19. Téléchargez et installez l'archive Linux ARM à partir de https://ngrok.com/download.
$ décompressez ngrok-stable-linux-arm.zip
20. Lancez ngrok vers démarrer un tunnel qui créera une URL directement vers notre application. Recherchez l'URL de transfert et en prendre note.
$ ./ngrok http 3030
21. Tapez l'URL dans un navigateur sur un autre appareil (téléphone, ordinateur portable, tablette) et l'interface de l'appareil photo est prête à l'emploi. De n'importe où dans le monde!
Commentaires
Laisser un commentaire