Collegamento di condivisione su WhatsApp dal sito Web mobile (non applicazione) per Android


223

Ho sviluppato un sito web che viene utilizzato principalmente nei telefoni cellulari.
Voglio consentire agli utenti di condividere le informazioni direttamente dalla pagina web in WhatsApp.

Utilizzando il rilevamento di UserAgent posso distinguere tra Android e iOS.
Sono stato in grado di scoprire che per implementare quanto sopra in iOS posso utilizzare l'URL:

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

Sto ancora cercando la soluzione da utilizzare quando il sistema operativo è Android (poiché quanto sopra non funziona).
Immagino sia in qualche modo correlato all'uso di "intent" in Android, ma non sono riuscito a capire come farlo come parametro per href.


In questo modo si connette all'app Whatsapp e c'è un altro modo per connettersi all'opzione web.whatsapp.com. C'è un modo per rilevare se hai l'app o meno, per vedere a quale connetterti?
SrQ

Quale contatto riceverà questo messaggio?
Codebeat

Risposte:


331

L'ho appena visto su un sito Web e sembra funzionare anche sull'ultimo Android con le ultime Chrome e Whatsapp ora! Dai una nuova possibilità al collegamento!

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

Ricontrollato oggi (17 ° aprile 2015):
per me funziona su iOS 8 (iPhone 6, le versioni più recenti di Android) 5 (Nexus 5, tutte le versioni).

Funziona anche su Windows Phone.


1
in effetti sembra che l'URL originale nella mia domanda ora funzioni anche per Android.
Yochai

Chiunque abbia votato per il commento indubbiamente perspicace di @ MosheL deve avere una conoscenza profonda di quale sia esattamente il suo "oggetto".
Dan Dascalescu

7
@Manuel a cosa serve data-action = "share / whatsapp / share"?
user3362364

4
I dati dovrebbero essere in formato URL codificato. Altrimenti invierà un messaggio vuoto in whatsapp iphone.
Lijo Abraham

1
Alcune modifiche all'API sono disponibili nel documento recente: faq.whatsapp.com/en/general/26000030/?category=5245251
abhishek77in

106

Le risposte di cui sopra sono un po 'obsolete. Sebbene questi metodi funzionino, ma utilizzando il metodo seguente, puoi condividere qualsiasi testo con un numero predefinito. Il metodo seguente funziona per Android, WhatsApp web, IOS ecc.

Hai solo bisogno di usare questo formato:

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

AGGIORNAMENTO - Usa questo da ora (novembre 2018)

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

Usa: https://wa.me/15551234567

Non utilizzare: https://wa.me/+001-(555)1234567

Per creare il tuo collegamento con un messaggio precompilato che apparirà automaticamente nel campo di testo di una chat, usa https://wa.me/whatsappphonenumber/?text=urlencodedtext dove whatsappphonenumber è un numero di telefono completo in formato internazionale e URL -encodedtext è il messaggio precompilato con codifica URL.

Esempio: https://wa.me/15551234567?text=I 'm% 20interested% 20in% 20your% 20car% 20for% 20sale

Per creare un collegamento con solo un messaggio precompilato, utilizzare https://wa.me/?text=urlencodedtext

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

Dopo aver cliccato sul collegamento, ti verrà mostrato un elenco di contatti a cui puoi inviare il tuo messaggio.

Per ulteriori informazioni, vedere https://www.whatsapp.com/faq/en/general/26000030


L'ho testato su tutti i dispositivi. Tutto ciò che fa è aprire l'applicazione whatsapp. Dopo non succede niente. Testato su più dispositivi (iOS, Android, Windows).
HoldOffHunger

@HoldOffHunger si aprirà l'applicazione whatsapp e l'utente dovrà selezionare il contatto a cui desidera condividere il link / contenuto.
ad08

@ ad08: è così che hanno funzionato Threema e gli altri 40 servizi che ho testato. Viber e WhatsApp, tuttavia, non fanno nulla, ho contattato i loro sviluppatori ed entrambi hanno ammesso che l'API non fa nulla. Ho tenuto traccia della loro corrispondenza e delle altre 40 API (che funzionano) qui: github.com/bradvin/social-share-urls/blob/master/README.md
HoldOffHunger

Funziona su WhatsApp Desktop sotto Mojave
Alchem

8
I collegamenti wa.me non funzionano correttamente su dispositivi mobili senza un numero di telefono. Anche se la documentazione ufficiale afferma che puoi usarlo, dà solo un errore. Funziona sul desktop, utilizzando WhatsApp web. api.whatsapp.com funziona in modo affidabile su entrambi.
Ricardo BRGWeb

41

Attualmente è molto facile ottenere questo risultato. Devi solo aggiungere il seguente codice alle tue pagine:

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

E questo è tutto. Nessun Javascript necessario, nient'altro necessario. Ovviamente puoi modellarlo come desideri e includere una bella icona di Whatsapp.

L'ho testato sul mio dispositivo Android con Google Chrome. Le versioni:

  • Android 4.1.2 (Jelly Bean)
  • Chrome Mobile 37.0.2062.117. Testato anche su Firefox Mobile 31.0.
  • Whatsapp V 2.11.399

Funziona anche su iOS. Ho fatto un rapido test su un iPhone 5 con Safari e funziona anche.

Spero che questo aiuti qualcuno. :-)


3
Per codificare i tuoi contenuti per uso in comuneencodeURIComponent()
nikoskip

1
hey, ha funzionato per me. grazie :) Sono solo curioso, se posso controllare se l'utente ha effettivamente condiviso il collegamento o semplicemente è tornato sul sito?
Detto

1
Funziona anche sul mio Nexus 5 con Android 5.0 (Lollipop) e iPhone 5 con iOS 8.1.1.
Narxx

2
@juangalf E se volessi condividere un'immagine usando questo metodo? sarà possibile anche questo o sarà supportato solo il testo?
elembivos

1
@elembivos sto chiedendo la stessa cosa. Come senddeve essere formattato il parametro? Al momento, ho whatsapp://send?text=data:image/png;base64,iVBORw0KGgoAAAANS...ma non sono sicuro di quanti prefissi includere ...
TMOTTM

26

Secondo la nuova documentazione, il collegamento ora è:

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

Se non funziona, prova questo:

<a href="whatsapp://send?text=urlencodedtext">Share this</a>

3
Quindi è possibile anche senza numero di telefono. Questo documento può essere trovato qui: faq.whatsapp.com/en/general/26000030
Tim Vermaelen

2
Ho appena scoperto che non funziona più correttamente. Funziona solo con il numero di telefono. Senza un numero di telefono è necessario utilizzare api.whatsapp.com
Ricardo BRGWeb

@RicardoBRGWeb sicuro di questo? Ho appena provato sul mio browser web, funziona per me senza alcun numero, mi propone l'interfaccia Web Whatsapp e da condividere con un contatto
Vincent Decaux

@VincentDecaux funziona nei browser desktop, anche quando si utilizza la modalità di visualizzazione mobile. Ma non funziona nei browser mobili per aprire whatsapp o app aziendali whatsapp. Probabilmente hanno cambiato l'uri di collegamento interno nell'app.
Ricardo BRGWeb

Ok, hai provato la mia seconda opzione? abbastanza non ho provato sul browser mobile, proverò domani
Vincent Decaux

13

Di recente WhatsApp ha aggiornato sul suo sito web ufficiale che dobbiamo utilizzare questo tag HTML per renderlo condivisibile con i siti mobili:

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

Puoi sostituire text=per avere il tuo link o qualsiasi contenuto di testo


L'ho provato personalmente. Apre l'applicazione, ma nient'altro.
HoldOffHunger

@HoldOffHunger perché devi usare urlencode altrimenti non funzionerà
Shiv Singh

@ Shiv: non era un mio problema.
HoldOffHunger

Funziona sicuramente ... Qualche modo per inserire interruzioni di riga (tasti di invio) nel testo del messaggio?
cht

@cht è un po 'in ritardo, ma puoi usare% 0D come interruzioni di riga
Elro444

11

La documentazione ufficiale dicono uso: wa.me. Non usare wa.me. Mi scuso per la lunghezza di questi risultati, ma è stata una questione in rapida evoluzione ...

Risultati aprile 2020

Condividi il link

Questo collegamento non è corretto. Chiudi questa finestra e prova un collegamento diverso.

Risultati maggio 2020

Condividi link GitHub Ticket: il link breve di WhatsApp senza numero di telefono non funziona più

Non siamo riusciti a trovare la pagina che stavi cercando

Sembra che tu stia cercando una pagina che non esiste. O una pagina che potremmo aver appena cancellato. In ogni caso, torna indietro o assicurati di controllare l'URL, l'ortografia e riprova.

Risultati agosto 2020

Condividi il link

Funziona come previsto!

ULTIMI - Risultati di ottobre 2020

Condividi il link

(Di nuovo rotto!) Le og:image anteprime dei tag sono disabilitate durante l'utilizzowa.me.

Sulla base di alcuni dei commenti che sto vedendo, sembra che questo sia ancora un problema intermittente, quindi, andando avanti, ti consiglio di attenersi api.whatsapp.comall'URL!

Se vuoi condividere, devi assolutamente utilizzare uno dei due seguenti formati di URL:

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

Se sei interessato a guardare un progetto che tiene traccia di questi URL, dai un'occhiata !: https://github.com/bradvin/social-share-urls#telegramme

URL di condivisione sociale


L'utilizzo whatsapp://send?text=funziona per me, con o senza codifica URL. Testato solo su iOS
Snowball

Ehi, @ Snowball: grazie per il commento, in realtà, funzionerà solo quando l'app whatsapp è installata. È normale per i customProtocol://action=?tipi di link. Quindi, questo non farà nulla su un desktop. L'utilizzo di questo richiederebbe il rilevamento del sistema operativo, quindi l'utilizzo di un URL per desktop e un altro per iOS. Ma questa è davvero una questione completamente diversa da ciò che chiede l'OP.
HoldOffHunger

1
Questa è la soluzione migliore se desideri includere un'immagine OpenGraph (og: image) nella condivisione.
Marcio Duarte

@HoldOffHunger come possiamo condividere le immagini con questo collegamento api.whatsapp?
GaurangDhorda

@GuarangDhorda: usa il og:imagetag.
HoldOffHunger

10

ULTIMO AGGIORNAMENTO

Ora puoi utilizzare l'ultima API di whatsapp https://wa.me/senza preoccuparti dello user agent, l'API farà la gestione dello user agent.

Condividi il testo precompilato con l'opzione di selezione del contatto nel rispettivo client whatsapp (Android / iOS / Webapp):

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

Apri finestra di dialogo chat per un particolare utente whatsapp nel rispettivo client whatsapp (Android / iOS / Webapp):

https://wa.me/whatsappphonenumber

Condividi il testo precompilato con un particolare utente (Combina due precedenti):

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

Nota : whatsappphonenumberdovrebbe essere il numero di telefono completo in formato internazionale. Ometti zeri, parentesi o trattini quando aggiungi il numero di telefono in formato internazionale.

Per la documentazione ufficiale, visita https://faq.whatsapp.com/en/general/26000030



@Kiran È necessario sostituire whatsappphonenumbercon il numero di telefono completo in formato internazionale, ad esempio 919999999999
Shri

7

Temo che WhatsApp per Android non supporti attualmente la chiamata da un browser web.

Avevo lo stesso requisito per il mio progetto attuale e, poiché non riuscivo a trovare alcuna informazione corretta, ho finito per scaricare il file APK.

In Android, se un'applicazione vuole essere chiamata da un browser web, deve definire un'attività con la categoria android.intent.category.BROWSABLE.

Puoi trovare ulteriori informazioni su questo qui: https://developers.google.com/chrome/mobile/docs/intents

Se dai un'occhiata al file WhatsApp AndroidManifest.xml, l'unico Activiy con categoria BROWSABLE è questo:

<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>

Ci gioco da un po 'e non sono riuscito a farlo funzionare. Il massimo che ho ottenuto è stato aprire l'applicazione WhatsApp da Chrome, ma non sono riuscito a trovare un modo per impostare il contenuto del messaggio e il destinatario.

Poiché non è documentato dal team di WhatsApp, penso che sia ancora in corso. Sembra che in futuro WhatsApp gestirà anche gli SMS.

L'unico modo per avere maggiori informazioni è contattare il team di sviluppo di WhatsApp, cosa ho provato, ma sto ancora aspettando una risposta.

Saluti!


1
Posso chiederti di condividere qui qualche nuova informazione su questo problema? Sarebbe molto conveniente anche per me. Comunque, grazie per la risposta esauriente.
ccalboni

Sono riuscito a entrare in contatto con gli sviluppatori di WhatsApp. Hanno ammesso che questa funzione non è supportata.
HoldOffHunger

7

In generale ha senso visualizzare il collegamento Whatsapp solo su dispositivi iOS o Android, utilizzando lo script java:

   if (navigator.userAgent.match(/iPhone|Android/i)) {
      document.write('<a href="whatsapp://send?text=See..">Share on WhatApp</a>');
   }

Cosa non ha funzionato? Il collegamento è stato visualizzato su un dispositivo non mobile? Sul dispositivo mobile il collegamento non ha funzionato?
Weidenrinde

Si apre l'applicazione WhatsApp. Ma non viene visualizzato né un testo né un messaggio. Testato su diversi sistemi operativi e dispositivi. Ho inviato un'e-mail agli sviluppatori. Ufficialmente non supportano questo comportamento "Sfortunatamente, al momento non è supportato. Lavoriamo sempre per migliorare la nostra app e terremo conto dei tuoi suggerimenti". (ticket # 172349248330585) Ho testato circa 40 altri servizi, solo WhatsApp e Viber non supportano la propria documentazione.
HoldOffHunger

7

Ho appena testato lo whatsapp://schema sul mio super vecchio Android 2.3.3con Whats App 2.11.301, funziona come un fascino. Sembra essere solo la Whats Appversione. Dal momento che Whats Appsta costringendo tutti ad aggiornare, dovrebbe essere sicuro usarlo.

La Whats Appdocumentazione menziona anche questo schema: http://www.whatsapp.com/faq/en/android/28000012

Lo sto usando su un sito di produzione ora e aggiornerò qui, se ricevo reclami da parte degli utenti.

Modifica (14 novembre): nessun reclamo degli utenti dopo un paio di settimane.


3

Cambia i link di condivisione di whatsapp in base alla piattaforma, sia desktop che mobile.

Funziona con o senza fornire il numero di telefono nel collegamento.

Per dispositivi mobili

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

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

Per desktop

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

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

Nota per chi utilizza il protocollo OpenGraph per la condivisione delle immagini (og: image): la soluzione desktop non include l'immagine, ma solo il collegamento. Se desideri includere l'immagine nella condivisione, devi sempre utilizzare la versione mobile:https://api.whatsapp.com/send?text=
Marcio Duarte

3

Questo codice ha funzionato per me.

Dopo aver fatto clic sul collegamento, ti verrà chiesto di scegliere il contatto per condividere un messaggio.

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

Puoi aggiungere l'attributo target = "_ blank" per aprirlo in una nuova finestra o scheda.

Non credo che il numero di telefono sia necessario quando qualcuno vuole condividere un particolare messaggio o articolo.


può essere aperto nel desktop del browser? così inoltrato alla pagina web.whatsapp?
gumuruh

2

usalo come "whatsapp: // send? text =" + encodeURIComponent (il tuo testo va qui), funzionerà sicuramente.


0

Prova a farlo in questo modo:

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

Anche tu puoi inviare messaggi senza inserire il numero di telefono nel link:

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

Dopo aver cliccato sul collegamento, ti verrà mostrato un elenco di contatti a cui puoi inviare il tuo messaggio.

Maggiori informazioni in https://faq.whatsapp.com/en/general/26000030 .

In bocca al lupo!


whatsapp dice Non siamo riusciti a trovare la pagina che stavi cercando
Reza Mortazavi

Non capisco. WhatsApp mostra quell'errore? Quando?
Gustavo Cantero

0

Usa: https://wa.me/1XXXXXXXXXX

Non utilizzare: https://wa.me/+001-(XXX)XXXXXXX

Il messaggio precompilato apparirà automaticamente nel campo di testo di una chat. Utilizza https://wa.me/whatsappphonenumber?text=urlencodedtext dove whatsappphonenumber è un numero di telefono completo in formato internazionale e urlencodedtext è il messaggio precompilato con codifica URL.

Esempio: https://wa.me/1XXXXXXXXXX?text=I'm%20interested%20in%20your%20car%20for%20sale

Per creare un collegamento con solo un messaggio precompilato, utilizzare https://wa.me/?text=urlencodedtext

Esempio: https: //wa.me/? Text = Sto% 20 richiedendo% 20 circa% 20il% 20appartamento% 20listing`

Dopo aver fatto clic sul collegamento, ti verrà mostrato un elenco di contatti a cui puoi inviare il tuo messaggio.


Nota per chi utilizza il protocollo OpenGraph per la condivisione delle immagini (og: image): questa soluzione non include l'immagine, ma solo il collegamento. Se desideri includere l'immagine nella condivisione, devi utilizzarla https://api.whatsapp.com/nel link.
Marcio Duarte
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.