Dernièrement, tout le monde parle du potentiel du code QR. Il est devenu l’équivalent sur Internet des codes-barres traditionnels (comme ceux que vous trouverez sur les biens physiques de votre magasin de détail préféré).
Quelqu’un peuvent prendre un instantané rapide d’un code QR avec leur smartphone et avoir immédiatement un site Web opérationnel et chargé, afin que nous puissions imprimer des codes QR sur papier et sur des biens physiques tels que des cartes de visite, des publicités dans les magazines et des affiches afin de diriger les gens vers notre site.
Mais, le plus souvent, les développeurs Web n’utilisent pas de codes QR pour leurs plein potentiel. Dans cet article, nous aborderons une technique qui permettra de libérer tout le potentiel des codes QR grâce aux schémas URI.
Comment fonctionnent les codes QR en bref
Apprenons comment fonctionne réellement le mécanisme du code QR.
Les codes QR, à la base, sont des images spécialement générées qui fonctionnent comme des codes-barres. Certain commandes (appelées réponses) sont intégrés, et lorsqu’un code QR est capturé par une caméra (généralement un sur un smartphone ou une tablette), l’image du QR code est traitée et puis la réponse intégrée est exécutée.
UN La réponse courante au code QR consiste à ouvrir un certain site Web dans un navigateur Web. sur l’appareil qui capture le code QR.
Les codes QR ressemblent à celui ci-dessus et contiennent des informations qui peuvent être capturées par une caméra et interprétées par un smartphone, une tablette ou un ordinateur.
Lecteurs de codes QR
C’est là que les choses deviennent intéressantes.
Les lecteurs de codes QR – les applications qui scannent les codes et effectuent les actions – ne sont pas égaux en termes de fonctionnalités.
Certains sont capables de reconnaître les codes QR et de faire toutes sortes de choses étonnantes, tandis que d’autres peuvent simplement ouvrir des URL ou afficher du texte.
La plupart les smartphones disposent du même ensemble de fonctionnalités de base (carnet d’adresses, calendrier, fonctionnalité d’envoi de SMS, alertes et navigation Internet), et un un bon lecteur de code QR peut répondre à tous ces besoins.
Cependant, avec des applications peu fonctionnelles, l’ouverture d’URL est probablement la seule fonction fiable dont nous pouvons nous attendre à ce que la plupart des lecteurs de codes QR aient.
Voici une liste de fonctionnalités dont les lecteurs de codes QR sont généralement équipés:
- Affichage du texte
- Paramètre activer les alertes système
- Ajouter événements aux calendriers
- Ouverture URL dans un navigateur
- Collecte coordonnées (y compris v Cards)
- Envoi en cours e-mail
- Envoi en cours messages texte (SMS)
- Géolocalisation
- Appel autres téléphones
- Connexion au Wi-Fi
L’idée : utiliser des schémas d’URI
Étant donné que les navigateurs peuvent déjà lancer des clients de messagerie par défaut via une simple URL mailto (les navigateurs prennent en charge de tels schémas d’URI depuis des années), la même technique pourrait-elle être utilisée pour offrir des fonctionnalités dans l’application à d’autres produits dotés de schémas d’URI non natifs et qu’un Le lecteur QR ne prendrait pas en charge par défaut ?
Le la réponse est oui !
Si l’application prenait en charge le schéma et si l’utilisateur avait installé l’application représentée par le QR, cela fonctionnerait à merveille – et peu importe le lecteur de code QR utilisé.
Les possibilités
Voici une liste de quelques choses intéressantes qui sont possibles :
- Lancement d’applications Apple natives (Mail, Téléphone, FaceTime, Texte, Carte, YouTube et iTunes)
- En cours d’exécution
- Signets JavaScript
- Ouverture certains clients de messagerie instantanée (Skype, AIM, MSN, GTalk, ICQ et Yahoo)
- Ouverture applications spéciales (IRC outils, lecteurs de flux, clients FTP et référentiels SVN)
- Ouverture de toute application qui enregistre un schéma d’URI lors de son installation sur une plate-forme
Ce qui rend cette technique si étonnante, c’est qu’elle ne nécessite pas que le lecteur de code QR soit très avancé ; tout ce dont il a besoin est que le créateur de l’application (que ce soit Skype, Evernote ou Angry Birds) que vous souhaitez lancer et avec lequel vous interagissez utilise l’API de développement du système pour enregistrer un schéma d’URI.
Dans dans le cas d’Apple, c’est la méthode Cocoa Touch OpenURL du objet UIApplication partagé, et pour d’autres plateformes (comme Android), il y aura un équivalent quelque part dans la documentation. Du scanner au navigateur en passant par l’application, les possibilités sont infinies !
Vous trouverez ci-dessous une liste de quelques schémas d’URI non-http courants :
| Application | URI Scheme or Protocol | Query Strings |
| Default e-mail application | mailto:<email>?query | Subject |
| CC | ||
| BCC | ||
| Body | ||
| Default phone application | tel:<number> | N/A |
| Default SMS application | sms:<number> | N/A |
| Chat Room client | irc://<url>:query | port |
| channel | ||
| password | ||
| Syndication feed reader | feed:<url> | N/A |
| Apple FaceTime | facetime:<number> | N/A |
| Skype client | skype:<username|number>?query | add |
| call | ||
| chat | ||
| sendfile | ||
| userinfo | ||
| Google Talk client | gtalk:query?<email> | chat |
| call | ||
| Windows Live Messenger client | msnim:query?<email> | add |
| chat | ||
| voice | ||
| video | ||
| Yahoo! Messenger client | ymsgr:query?<email|number> | sendim |
| addfriend | ||
| sendfile | ||
| call | ||
| callPhone | ||
| chat | ||
| im | ||
| customstatus | ||
| getimv | ||
| AOL Instant Messenger client | aim:query?<username> | goim |
| goaway | ||
| addbuddy |
Qu’est ce que cela veut dire pour nous? À l’heure actuelle, il existe en fait un certain nombre d’applications pour ordinateur de bureau (ainsi que pour mobile) qui utilisent déjà des schémas d’URI.
Prendre Skype, par exemple. Voulez-vous que les gens puissent capturer un QR code qui amène leurs téléphones à vous appeler via Skype sur leur des combinés ?
Cela peut être fait (au moins sur iOS) dès maintenant. Il peut également être utilisé pour exécuter plusieurs applications natives, lancer JavaScript bookmarklets (y compris peut-être des applications qui s’exécutent dans les navigateurs) et accéder aux protocoles FTP et IRC habituels (s’ils sont associés à quelque chose).
Voici quelques liens utiles pour les développeurs :
Maintenant que vous en savez un peu plus sur les codes QR et que vous avez eu un bref aperçu des choses que vous devez savoir pour commencer, je vais décrire les étapes de la technique ci-dessous.
Remarque : La technique que je vais décrire ci-dessous peut même être utilisée pour exécuter du code JavaScript, donc avec un mauvais jeu de doigts pour écrire du code, cela pourrait être exploité.
Étape 1 : Choisissez la réponse que vous souhaitez effectuer
Tout d’abord, décidez de ce que vous souhaitez que le code QR accomplisse. Évidemment, vous pouvez utiliser le générateur de code QR habituel, comme l’envoi de messages texte à des téléphones ou l’envoi d’e-mails, mais essayons quelque chose de plus délicat.
Nous allons créer un code QR Skype qui lancera automatiquement l’application et passera un appel vocal à un contact Skype. (Cela ne fonctionnera que si l’utilisateur qui scanne le code QR a Skype installé).
Étape 2 : Créer une URL à l’aide d’un service de raccourcissement d’URL
De nombreux générateurs de codes QR souffrent d’un problème particulier : si vous essayez d’y insérer un mailto ou un autre lien non-http, ils pensent parfois qu’une erreur s’est produite (cela affecte également certaines applications de lecture).
Ceci, bien sûr, ne permettra pas à notre lanceur Skype d’être compatible avec les lecteurs de codes QR croisés, nous avons donc besoin d’une autre solution – et, heureusement, il en existe une commune qui peut aider à insérer cette URL dans le navigateur (et aidez également les développeurs Web à surveiller les statistiques de clics) !
Nous allons utiliser un service de raccourcissement d’URL.
Ces services sont rarement pointilleux sur ce que vous y insérez, et ils génèrent des URL bien formées avec l’en-tête HTTP requis pour la meilleure compatibilité possible (la plupart des lecteurs QR savent comment ouvrir les URL de base).
Un service de raccourcissement d’URL tel que TinyURL transformera cette URL non conventionnelle en une URL généralement acceptable.
Pour ce QR, nous appellerons le contact Skype nommé echo123 : ce contact est le contact gratuit de test de qualité vocale proposé par Skype.
Pour notre service de raccourcissement d’URL, j’utiliserai TinyURL, mais vous pouvez utiliser l’un des nombreux autres services de raccourcissement d’URL là comme bitly, is.gd et bientôt.
Juste entrez le schéma URI que vous avez choisi dans le raccourcisseur. Voici le résultat de ma conversion de lien TinyURL :
| URL | skype:echo123?call |
| To | http://tinyurl.com/echo123skype |
Si vous cliquez sur l’URL ci-dessus, vous pourriez voir quelque chose comme ce qui suit (si vous utilisez Google Chrome sous Windows) :
Étape 3 : générer le code QR
Prenez maintenant cette URL générée – qui fonctionnera réellement si la version de bureau de Skype est installée pour Windows ou Mac – et générez un code QR fonctionnel à partir de celle-ci. Vérifier que l’URL raccourcie fonctionne dans votre navigateur Web ; le lien devrait lancez Skype. Là il existe une multitude de choix en matière de moyens de générer des QR codes; des outils gratuits existent partout sur le Web. Vous trouverez ci-dessous quelques générateurs gratuits :
Après avoir généré votre code QR, testez-le. Téléchargez l’une des applications disponibles pour votre appareil mobile (si vous n’en possédez pas déjà une) et prenez un instantané du code QR que vous avez produit.
Vous trouverez ci-dessous quelques produits de lecture QR gratuits pour les plateformes mobiles :
- Scan (iOS)
- QR Droid (Android)
- QR Code Scanner Pro (Blackberry)
est-ce: Ton Le code QR sera identifié par l’application QR Reader Le L’application de lecture QR remarquera que le code QR contient une URL (il ignorera les bizarreries de compatibilité des lecteurs)
Le lien TinyURL s’ouvrira dans le navigateur par défaut Il redirigera vers le schéma URI d’appel Skype et lancera Skype Joli des trucs incroyables pour une image intelligente ! Le il ne reste plus qu’à télécharger votre merveilleuse création sur le Web (comme je l’ai fait avec l’exemple terminé ci-dessous). Je recommande, comme une bonne pratique, que vous envisagiez de fournir un lien vers l’URL étant capturé dans l’image QR elle-même (pour les utilisateurs de bureau).
Au-delà de cela, vous pouvez embellir vos codes QR avec un peu de couleur ou des illustrations limitées si vous vous sentez très créatif.
Des trucs assez étonnants pour une image intelligente !
Le il ne reste plus qu’à télécharger votre merveilleuse création sur le Web (comme je l’ai fait avec l’exemple terminé ci-dessous).
Je recommande, comme une bonne pratique, que vous envisagiez de fournir un lien vers l’URL étant capturé dans l’image QR elle-même (pour les utilisateurs de bureau).
Au-delà de cela, vous pouvez embellir vos codes QR avec un peu de couleur ou des illustrations limitées si vous vous sentez très créatif.
Le code QR terminé
Le code QR ci-dessus appellera echo123 sur Skype si l’application est installée.
Conclusion
La puissance de cette technique réside dans l’opportunité qu’elle offre aux concepteurs et aux développeurs. Un schéma d’URI existe entre les développeurs d’applications et les navigateurs qui les prennent en charge (heureusement, c’est tous !).
En utilisant une simple redirection (fournie par vous ou un tiers) et celles-ci fonctionnalités déjà existantes et bien prises en charge, vous pouvez lancer applications, interagissez via des codes de requête, exécutez JavaScript et faites tout des sortes de choses merveilleusement créatives.
Les codes QR sont de plus en plus adoptés et n’ont jamais été aussi largement utilisés. Avec cette seule technique, vous pouvez dépasser la plupart des limitations existantes.
