Lien de partage sur WhatsApp à partir d'un site Web mobile (pas d'application) pour Android

213

J'ai développé un site Internet principalement utilisé dans les téléphones portables.
Je souhaite permettre aux utilisateurs de partager des informations directement depuis la page Web dans WhatsApp.

En utilisant la détection UserAgent, je peux distinguer entre Android et iOS.
J'ai pu découvrir que pour mettre en œuvre ce qui précède dans iOS, je peux utiliser l'URL:

href="whatsapp://send?text=http://www.example.com"

Je cherche toujours la solution à utiliser lorsque le système d'exploitation est Android (car ce qui précède ne fonctionne pas).
Je suppose que cela est en quelque sorte lié à l'utilisation de "l'intention" dans Android, mais je ne pouvais pas comprendre comment le faire en tant que paramètre pour href.

Yochai
la source
De cette façon, vous vous connectez à l'application Whatsapp, et il existe une autre façon de se connecter à l'option web.whatsapp.com. Existe-t-il un moyen de détecter si vous avez l'application ou non, pour voir à laquelle vous connecter?
SrQ
Quel contact recevra ce message?
Codebeat

Réponses:

321

Je viens de le voir sur un site Web et semble fonctionner sur le dernier Android avec le dernier chrome et WhatsApp maintenant aussi! Donnez un nouveau coup au lien!

<a href="whatsapp://send?text=The text to share!" data-action="share/whatsapp/share">Share via Whatsapp</a>

Revérifié aujourd'hui (17 e Avril 2015):
Travaux pour moi sur iOS 8 (iPhone 6, dernières versions) Android 5 (Nexus 5, les dernières versions).

Il fonctionne également sur Windows Phone.

Manuel
la source
1
en effet, il semble que l'URL d'origine dans ma question fonctionne également maintenant pour Android.
Yochai
Quiconque a voté sur le commentaire de @ MosheL sans aucun doute perspicace doit avoir une connaissance intime de ce qu'est exactement son «article».
Dan Dascalescu
6
@Manuel à quoi sert data-action = "share / whatsapp / share"?
user3362364
4
Les données doivent être sous forme encodée en URL, sinon elles enverront un message vierge dans l'iphone WhatsApp.
Lijo Abraham
1
Certaines modifications de l'API peuvent être trouvées dans un document récent - faq.whatsapp.com/en/general/26000030/?category=5245251
abhishek77in
102

Les réponses ci-dessus sont un peu dépassées. Bien que ces méthodes fonctionnent, mais en utilisant la méthode ci-dessous, vous pouvez partager n'importe quel texte avec un nombre prédéfini. La méthode ci-dessous fonctionne pour Android, WhatsApp Web, IOS, etc.

Il vous suffit d'utiliser ce format:

<a href="https://api.whatsapp.com/send?phone=whatsappphonenumber&text=urlencodedtext"></a>

MISE À JOUR - Utilisez ceci à partir de maintenant (Nov-2018)

<a href="https://wa.me/whatsappphonenumber/?text=urlencodedtext"></a>

Utilisez: https://wa.me/15551234567

N'utilisez pas: https://wa.me/+001-(555)1234567

Pour créer votre propre lien avec un message pré-rempli qui apparaîtra automatiquement dans le champ de texte d'un chat, utilisez https://wa.me/whatsappphonenumber/?text=urlencodedtext où whatsappphonenumber est un numéro de téléphone complet au format international et URL -encodedtext est le message prérempli encodé en URL.

Exemple: https://wa.me/15551234567?text=I% 20intested% 20in% 20your% 20car% 20for% 20sale

Pour créer un lien avec juste un message pré-rempli, utilisez https://wa.me/?text=urlencodedtext

Exemple: https://wa.me/?text=I% 20inquiring% 20about% 20the% 20apartment% 20listing

Après avoir cliqué sur le lien, une liste de contacts à laquelle vous pouvez envoyer votre message s'affichera.

Pour plus d'informations, voir https://www.whatsapp.com/faq/en/general/26000030

ad08
la source
J'ai testé cela sur tous les appareils. Il ne fait qu'ouvrir l'application WhatsApp. Rien ne se passe après. Testé plusieurs appareils (iOS, Android, Windows).
HoldOffHunger
@HoldOffHunger oui, il ouvrira l'application WhatsApp et l'utilisateur devra sélectionner le contact avec lequel il souhaite partager le lien / contenu.
ad08
@ ad08: C'est ainsi que Threema et les 40 autres services que j'ai testés ont fonctionné. Viber et WhatsApp, cependant, ne font rien, j'ai contacté leurs développeurs et ils ont tous deux admis que l'API ne faisait rien. J'ai gardé une trace de leur correspondance et des 40 autres API (qui fonctionnent) ici: github.com/bradvin/social-share-urls/blob/master/README.md
HoldOffHunger
Fonctionne sur WhatsApp Desktop sous Mojave
Alchem
6
Les liens wa.me ne fonctionnent pas correctement sur mobile sans numéro de téléphone. Même si la documentation officielle indique que vous pouvez l'utiliser, cela donne juste une erreur. Cela fonctionne sur le bureau, en utilisant WhatsApp Web. api.whatsapp.com fonctionne de manière fiable sur les deux.
Ricardo BRGWeb
39

Actuellement, il est très facile d'y parvenir. Il vous suffit d'ajouter le code suivant à vos pages:

<a href="whatsapp://send?text=<<HERE GOES THE URL ENCODED TEXT YOU WANT TO SHARE>>" data-action="share/whatsapp/share">Share via Whatsapp</a>

Et c'est tout. Pas besoin de Javascript, rien d'autre. Bien sûr, vous pouvez le styler comme vous le souhaitez et inclure une belle icône Whatsapp.

J'ai testé cela sur mon appareil Android avec Google Chrome. Les versions:

  • Android 4.1.2 (Jelly Bean)
  • Chrome Mobile 37.0.2062.117. Également testé sur Firefox Mobile 31.0.
  • Whatsapp V 2.11.399

Il fonctionne également sur iOS. J'ai fait un test rapide sur un iPhone 5 avec Safari et ça marche aussi.

J'espère que cela aide quelqu'un. :-)

juangalf
la source
3
Pour encoder votre contenu à partager, utilisezencodeURIComponent()
nikoskip
1
hé, cela a fonctionné pour moi. merci :) Juste curieux, s'il y a moyen si je peux vérifier si l'utilisateur a réellement partagé le lien ou est simplement revenu sur le site?
Sayed
1
Fonctionne également sur mon Nexus 5 avec Android 5.0 (Lollipop) et iPhone 5 avec iOS 8.1.1.
Narxx
2
@juangalf Et si je veux partager une image en utilisant cette méthode? cela sera-t-il possible aussi, ou seul le texte est pris en charge?
elembivos
1
@elembivos, je demande la même chose. Comment le sendparamètre doit-il être formaté? Actuellement, je whatsapp://send?text=data:image/png;base64,iVBORw0KGgoAAAANS...ne sais pas combien de préfixes inclure ...
TMOTTM
27

Selon la nouvelle documentation, le lien est désormais:

<a href="https://wa.me/?text=urlencodedtext">Share this</a>

Si cela ne fonctionne pas, essayez celui-ci:

<a href="whatsapp://send?text=urlencodedtext">Share this</a>
Vincent Decaux
la source
3
C'est donc également possible sans numéro de téléphone. Ce document peut être trouvé ici: faq.whatsapp.com/en/general/26000030
Tim Vermaelen
1
Je viens de découvrir qu'il ne fonctionne plus correctement. Cela fonctionne simplement avec le numéro de téléphone. Sans numéro de téléphone, vous devez utiliser api.whatsapp.com
Ricardo BRGWeb
@RicardoBRGWeb en êtes-vous sûr? Je viens d'essayer mes navigateurs web, travaille pour moi sans aucun numéro, ça me sert d'interface Web Whatsapp et de partager avec un contact
Vincent Decaux
@VincentDecaux, il fonctionne dans les navigateurs de bureau, même lorsque vous utilisez le mode d'affichage mobile. Mais cela ne fonctionnera pas dans les navigateurs mobiles pour ouvrir WhatsApp ou les applications professionnelles Whatsapp. Ils ont probablement changé l'URI de liaison interne dans l'application.
Ricardo BRGWeb
Ok, avez-vous essayé ma 2ème option? honnêtement je n'ai pas essayé sur brower mobile, j'essaierai demain
Vincent Decaux
14

WhatsApp a récemment mis à jour sur son site officiel que nous devons utiliser cette balise HTML afin de la partager avec les sites mobiles:

<a href="whatsapp://send?text=Hello%20World!">Hello, world!</a>

Vous pouvez remplacer text=pour avoir votre lien ou tout contenu textuel

Aadil Keshwani
la source
Je l'ai testé personnellement. Il ouvre l'application, mais rien d'autre.
HoldOffHunger
@HoldOffHunger car vous devez utiliser le code url sinon cela ne fonctionnera pas
Shiv Singh
@Shiv: Ce n'était pas mon problème.
HoldOffHunger
Cela fonctionne à coup sûr ... Une façon d'insérer des sauts de ligne (entrez les touches) dans le texte du message?
cht
@cht un peu en retard, mais vous pouvez utiliser% 0D comme sauts de ligne
Elro444
11

DERNIÈRE MISE À JOUR

Maintenant, vous pouvez utiliser la dernière API de WhatsApp https://wa.me/sans vous soucier de l'agent utilisateur, l'API effectuera la gestion de l'agent utilisateur.

Partagez du texte pré-rempli avec l'option de sélection des contacts dans le client Whatsapp respectif (Android / iOS / Webapp):

https://wa.me/?text=urlencodedtext

Ouvrez la boîte de dialogue de discussion pour un utilisateur Whatsapp particulier dans le client Whatsapp respectif (Android / iOS / Webapp):

https://wa.me/whatsappphonenumber

Partagez du texte pré-rempli avec un utilisateur particulier (combinez-les ci-dessus):

https://wa.me/whatsappphonenumber/?text=urlencodedtext

Remarque : whatsappphonenumberdoit être un numéro de téléphone complet au format international. Omettez tous les zéros, crochets ou tirets lors de l'ajout du numéro de téléphone au format international.

Pour la documentation officielle, visitez https://faq.whatsapp.com/en/general/26000030

Shri
la source
wa.me/whatsappphonenumber/?text=urlencodedtext ne fonctionne pas, il semble
Kiran
7

Je crains que WhatsApp pour Android ne prenne actuellement en charge les appels à partir d'un navigateur Web.

J'avais la même exigence pour mon projet actuel, et comme je n'ai pas trouvé d'informations appropriées, j'ai fini par télécharger le fichier APK.

Sous Android, si une application souhaite être appelée à partir d'un navigateur Web, elle doit définir une activité avec la catégorie android.intent.category.BROWSABLE.

Vous pouvez trouver plus d'informations à ce sujet ici: https://developers.google.com/chrome/mobile/docs/intents

Si vous jetez un œil au fichier WhatsApp AndroidManifest.xml, la seule activité avec la catégorie BROWSABLE est celle-ci:

<activity android:name="com.whatsapp.Conversation"   android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|uiMode|screenSize|smallestScreenSize" android:windowSoftInputMode="stateUnchanged">
        <intent-filter>
            <action android:name="android.intent.action.SENDTO" />
            <category android:name="android.intent.category.DEFAULT" />
            <category android:name="android.intent.category.BROWSABLE" />
            <data android:scheme="sms" />
            <data android:scheme="smsto" />
        </intent-filter>
    </activity>

Je joue avec ça depuis un moment et je n'ai pas pu le faire fonctionner. Le plus que j'ai obtenu était d'ouvrir l'application WhatsApp à partir de Chrome, mais je n'ai pas réussi à définir le contenu et le destinataire du message.

Puisqu'il n'est pas documenté par l'équipe WhatsApp, je pense que ce travail est toujours en cours. Il semble qu'à l'avenir, WhatsApp gère également les SMS.

La seule façon d'obtenir plus d'informations est de contacter l'équipe de développement de WhatsApp, ce que j'ai essayé, mais j'attends toujours une réponse.

Cordialement!

oliferna
la source
1
Puis-je vous demander de partager ici de nouvelles informations sur ce problème? Ce serait très pratique pour moi aussi. Quoi qu'il en soit, merci pour la réponse exhaustive.
ccalboni
J'ai pu entrer en contact avec les développeurs WhatsApp. Ils ont admis que cette fonctionnalité n'est pas prise en charge.
HoldOffHunger
7

En général, il est logique d'afficher uniquement le lien Whatsapp sur les appareils iOS ou Android, à l'aide du script java:

   if (navigator.userAgent.match(/iPhone|Android/i)) {
      document.write('<a href="whatsapp://send?text=See..">Share on WhatApp</a>');
   }
Weidenrinde
la source
Ce qui n'a pas fonctionné? Le lien a été affiché sur un appareil non mobile? Sur l'appareil mobile, le lien n'a pas fonctionné?
Weidenrinde
L'application WhatsApp s'ouvre. Mais ni texte ni message affiché. Testé sur plusieurs OS et appareils. J'ai envoyé un e-mail aux développeurs. Ils ne soutiennent officiellement pas ce comportement "Malheureusement, cela n'est pas pris en charge pour le moment. Nous travaillons toujours pour améliorer notre application et nous tiendrons compte de votre suggestion." (ticket # 172349248330585) J'ai testé ~ 40 autres services, seuls WhatsApp et Viber ne prennent pas en charge leur propre documentation.
HoldOffHunger
7

Je viens de tester le whatsapp://schéma sur mon super vieux Android 2.3.3avec Whats App 2.11.301, ça marche comme un charme. Il semble que ce soit juste la Whats Appversion. Puisque Whats Appforce tout le monde à mettre à jour, il devrait être sûr de l'utiliser.

La Whats Appdocumentation mentionne également ce schéma: http://www.whatsapp.com/faq/en/android/28000012

J'utilise cela sur un site de production maintenant et je mettrai à jour ici, si je reçois des plaintes d'utilisateurs.

Edit (14 novembre): Aucune plainte des utilisateurs après quelques semaines.

JonasB
la source
6

Les documents officiels disent utiliser: wa.me. Ne pas utiliser wa.me. Essayez-le par vous-même: https://wa.me/?text=SomeTexttoShare Résultats pour moi:

Nous n'avons pas trouvé la page que vous cherchiez

On dirait que vous recherchez une page qui n'existe pas. Ou une page que nous venons de supprimer. Quoi qu'il en soit, revenez en arrière ou assurez-vous de vérifier l'URL, votre orthographe et réessayez.

Si vous souhaitez partager, vous devez absolument utiliser l'un des deux formats d'URL suivants:

https://api.whatsapp.com/send?text=YourShareTextHere
https://api.whatsapp.com/send?text=YourShareTextHere&phone=123

Si vous êtes intéressé à regarder un projet qui garde une trace de ces URL, alors consultez-nous!: Https://github.com/bradvin/social-share-urls#telegramme

URL de partage social

HoldOffHunger
la source
L'utilisation whatsapp://send?text=fonctionne pour moi, avec ou sans encodage d'URL. Testé uniquement sur iOS
Snowball
Hé, @Snowball: Merci pour le commentaire, en fait, cela ne fonctionnera que lorsque l'application WhatsApp sera installée. C'est normal pour les customProtocol://action=?types de liens. Donc, cela ne fera rien sur un bureau. Pour l'utiliser, il faudrait détecter le système d'exploitation, puis utiliser une URL pour le bureau et une autre pour iOS. Mais c'est vraiment une tout autre chose que ce que le PO demande.
HoldOffHunger
3

Basculez les liens de partage Whatsapp selon la plate-forme, que ce soit sur ordinateur ou sur mobile.

Cela fonctionne avec ou sans fournir le numéro de téléphone dans le lien.

Pour mobile

   vm.LinkTextToShare = 'https://api.whatsapp.com/send?text=' + encodeURIComponent(window.location.href) ;

   window.open(vm.LinkTextToShare,"_blank");

Pour le bureau

   vm.LinkTextToShare = 'https://web.whatsapp.com/send?l=en&text=' + encodeURIComponent(window.location.href) ;

   window.open(vm.LinkTextToShare,"_blank");
Sitaram
la source
3

Ce code a fonctionné pour moi.

Après avoir cliqué sur le lien, il vous demandera de choisir le contact pour partager un message.

<a href="https://api.whatsapp.com/send?text=enter message here">Click here to share on Whatsapp</a>

Vous pouvez ajouter l'attribut target = "_ blank" pour l'ouvrir dans une nouvelle fenêtre ou un nouvel onglet.

Je ne pense pas que le numéro de téléphone soit nécessaire lorsque quelqu'un veut partager un message ou un article particulier.

Rachit Mangi
la source
cela peut-il être ouvert dans le bureau du navigateur? ainsi transmis à la page web.whatsapp?
gumuruh
1

utilisez-le comme "whatsapp: // send? text =" + encodeURIComponent (votre texte va ici), cela fonctionnera certainement.

Jitendra Pal - JP
la source
0

Essayez de le faire de cette façon:

<a href="https://wa.me/(phone)?text=(text URL encoded)">Link</a>

Même vous pouvez envoyer des messages sans entrer le numéro de téléphone dans le lien:

<a href="https://wa.me/?text=Hello%20world!">Say hello</a>

Après avoir cliqué sur le lien, une liste de contacts à laquelle vous pouvez envoyer votre message s'affichera.

Plus d'informations sur https://faq.whatsapp.com/en/general/26000030 .

Bonne chance!

Gustavo Cantero
la source
WhatsApp dit Nous n'avons pas trouvé la page que vous recherchez
Reza Mortazavi
Je ne comprends pas. WhatsApp montre cette erreur? Quand?
Gustavo Cantero