Compartilhar link no WhatsApp no ​​site móvel (não aplicativo) para Android


213

Eu desenvolvi um site que é usado principalmente em telefones celulares.
Quero permitir que os usuários compartilhem informações diretamente da página da web no WhatsApp.

Usando a detecção do UserAgent, posso distinguir entre Android e iOS.
Pude descobrir que, para implementar o acima no iOS, posso usar o URL:

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

Ainda estou procurando a solução a ser usada quando o sistema operacional é Android (como o descrito acima não funciona).
Eu acho que está de alguma forma relacionado ao uso de "intenção" no Android, mas não consegui descobrir como fazê-lo como parâmetro para href.


Dessa forma, você se conecta ao aplicativo Whatsapp e há outra maneira de se conectar à opção web.whatsapp.com. Existe alguma maneira de detectar se você tem o aplicativo ou não, para ver ao qual se conectar?
— SrQ

Qual contato receberá esta mensagem?
— Codebeat 24/07/19

Respostas:


321

Acabei de vê-lo em um site e parece funcionar no Android mais recente com o Chrome e WhatsApp mais recentes agora também! Dê uma nova chance ao link!

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

Rechecked hoje (17 th abril 2015):
funciona para mim no iOS 8 (iPhone 6, versões mais recentes) Android 5 (Nexus 5, as últimas versões).

Também funciona no Windows Phone.


1
de fato, parece que o URL original na minha pergunta também funciona agora para Android.
— Yochai

Quem votou sem dúvida no comentário perspicaz de @ MosheL deve ter um conhecimento íntimo do que exatamente é seu "item".
— Dan Dascalescu

6
@Manuel, para que serve data-action = "share / whatsapp / share"?
— user3362364

4
Os dados devem estar em formato codificado por URL. Caso contrário, ele enviará uma mensagem em branco no whatsapp iphone.
— Lijo Abraham

1
Algumas alterações de API podem ser encontradas em documentos recentes - faq.whatsapp.com/en/general/26000030/?category=5245251
— abhishek77in

101

As respostas acima estão um pouco desatualizadas. Embora esses métodos funcionem, mas usando o método abaixo, você pode compartilhar qualquer texto com um número predefinido. O método abaixo funciona para android, WhatsApp web, IOS etc.

Você só precisa usar este formato:

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

UPDATE-- Use isso a partir de agora (nov-2018)

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

Use: https://wa.me/15551234567

Não use: https://wa.me/+001-(555)1234567

Para criar seu próprio link com uma mensagem pré-preenchida que aparecerá automaticamente no campo de texto de um bate-papo, use https://wa.me/whatsappphonenumber/?text=urlencodedtext em que whatsappphonenumber é um número de telefone completo em formato internacional e URL -encodedtext é a mensagem pré-preenchida codificada em URL.

Exemplo: https://wa.me/15551234567?text=I 'm% 20interessou% 20in% 20seu% 20car% 20para% 20sale

Para criar um link com apenas uma mensagem pré-preenchida, use https://wa.me/?text=urlencodedtext

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

Depois de clicar no link, você verá uma lista de contatos para os quais pode enviar sua mensagem.

Para mais informações, consulte https://www.whatsapp.com/faq/en/general/26000030


Eu testei isso em todos os dispositivos. Tudo o que faz é abrir o aplicativo whatsapp. Nada acontece depois. Testou vários dispositivos (iOS, Android, Windows).
— HoldOffHunger

@HoldOffHunger sim, ele abrirá o aplicativo whatsapp e o usuário deverá selecionar o contato com o qual deseja compartilhar o link / conteúdo.
— AD08

@ ad08: Foi assim que a Threema e os outros 40 serviços que testei funcionaram. Viber e WhatsApp, no entanto, não fazem nada, entrei em contato com seus desenvolvedores e ambos admitiram que a API não faz nada. Eu mantive o controle de sua correspondência e os outros 40 de api (que trabalham) aqui: github.com/bradvin/social-share-urls/blob/master/README.md
— HoldOffHunger

Funciona no WhatsApp Desktop no Mojave
— Alchem

6
Os links do wa.me não funcionam corretamente no celular sem um número de telefone. Mesmo que a documentação oficial indique que você pode usá-la, ela apenas fornece um erro. Ele funciona na área de trabalho, usando o WhatsApp web. api.whatsapp.com funciona de maneira confiável em ambos.
— Ricardo BRGWeb

39

Atualmente, é muito fácil conseguir isso. Você só precisa adicionar o seguinte código às suas páginas:

<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 é isso. Não é necessário Javascript, nada mais é necessário. Claro que você pode estilizá-lo como quiser e incluir um bom ícone do Whatsapp.

Eu testei isso no meu dispositivo Android com o Google Chrome. As versões:

  • Android 4.1.2 (Jelly Bean)
  • Chrome Mobile 37.0.2062.117. Também testado no Firefox Mobile 31.0.
  • Whatsapp V 2.11.399

Também funciona no iOS. Fiz um teste rápido em um iPhone 5 com o Safari e também funciona.

Espero que isso ajude alguém. :-)


3
Para codificar seu conteúdo para compartilhar o usoencodeURIComponent()
— nikoskip

1
Ei, isso funcionou para mim. obrigado :) Apenas curioso, se houver uma maneira de verificar se o usuário realmente compartilhou o link ou simplesmente voltou ao site?
— Disse

1
Funciona também no meu Nexus 5 com Android 5.0 (Lollipop) e no iPhone 5 com iOS 8.1.1.
— Narxx

2
@juangalf E se eu quiser compartilhar uma imagem usando esse método? isso também será possível ou apenas texto será suportado?
— elembivos

1
@elembivos Estou perguntando o mesmo. Como o sendparâmetro deve ser formatado? Atualmente, eu tenho whatsapp://send?text=data:image/png;base64,iVBORw0KGgoAAAANS..., mas não tenho certeza quanto dos prefixos para incluir ...
— TMOTTM

27

De acordo com a nova documentação, o link agora é:

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

Se não funcionar, tente este:

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

3
Portanto, também é possível sem um número de telefone. Este documento pode ser encontrado aqui: faq.whatsapp.com/en/general/26000030
— Tim Vermaelen

1
Acabei de descobrir que não está mais funcionando corretamente. Apenas funciona com número de telefone. Sem um número de telefone, é necessário usar api.whatsapp.com
— Ricardo BRGWeb

@RicardoBRGWeb tem certeza disso? Eu apenas tentei em meus navegadores web, funciona para mim sem qualquer número, ele fins me a interface Web Whatsapp e parte para um contato
— Vincent Decaux

O @VincentDecaux funciona em navegadores de desktop, mesmo ao usar o modo de visualização móvel. Mas não funcionará em navegadores móveis para abrir aplicativos de negócios whatsapp ou whatsapp. Provavelmente eles mudaram a interface de interface do usuário interna no aplicativo.
— precisa saber é o seguinte

Ok, você tentou minha segunda opção? bastante eu não tentar em Brower móvel, vou tentar amanhã
— Vincent Decaux

14

Recentemente, o WhatsApp atualizou em seu site oficial que precisamos usar essa tag HTML para torná-la compartilhável para sites para celular:

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

Você pode substituir text=para ter seu link ou qualquer conteúdo de texto


Eu testei isso pessoalmente. Abre o aplicativo, mas nada mais.
— HoldOffHunger 28/03

@HoldOffHunger porque você precisa usar urlencode caso contrário não vai funcionar
— Shiv Singh

@Shiv: Esse não foi o meu problema.
— HoldOffHunger

Isso está funcionando com certeza ... Alguma maneira de inserir quebras de linha (teclas de digitação) no texto da mensagem?
— cht

@cht meio tarde, mas você pode usar% 0D como quebras de linha
— Elro444

11

ÚLTIMA ATUALIZAÇÃO

Agora você pode usar a API mais recente do whatsapp https://wa.me/sem se preocupar com o agente do usuário, a API fará o tratamento do agente do usuário.

Compartilhe texto pré-preenchido com a opção de seleção de contato no respectivo cliente whatsapp (Android / iOS / Webapp):

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

Abra a caixa de diálogo de bate-papo para um determinado usuário do whatsapp no ​​respectivo cliente do whatsapp (Android / iOS / Webapp):

https://wa.me/whatsappphonenumber

Compartilhe texto pré-preenchido com um usuário específico (combine acima de dois):

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

Nota : whatsappphonenumberdeve ser o número de telefone completo em formato internacional. Omita todos os zeros, colchetes ou traços ao adicionar o número de telefone em formato internacional.

Para documentação oficial, visite https://faq.whatsapp.com/en/general/26000030



7

Receio que o WhatsApp para Android atualmente não suporte a chamada de um navegador da web.

Eu tinha o mesmo requisito para o meu projeto atual e, como não consegui encontrar nenhuma informação adequada, acabei baixando o arquivo APK.

No Android, se um aplicativo deseja ser chamado a partir de um navegador da Web, ele precisa definir uma Atividade com a categoria android.intent.category.BROWSABLE.

Você pode encontrar mais informações sobre isso aqui: https://developers.google.com/chrome/mobile/docs/intents

Se você der uma olhada no arquivo AndroidManifest.xml do WhatsApp, a única atividade com a categoria BROWSABLE é essa:

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

Eu brinco com isso há um tempo e não consegui fazê-lo funcionar. O máximo que consegui foi abrir o aplicativo WhatsApp no ​​Chrome, mas não consegui descobrir uma maneira de definir o conteúdo e o destinatário da mensagem.

Como não está documentado pela equipe do WhatsApp, acho que ainda está em andamento. Parece que no futuro o WhatsApp também lidará com SMS.

A única maneira de obter mais informações é entrar em contato com a equipe de desenvolvedores do WhatsApp, o que eu tentei, mas ainda estou esperando por uma resposta.

Saudações!


1
Posso pedir que você compartilhe novas informações sobre esse problema aqui? Seria muito conveniente para mim também. De qualquer forma, obrigado pela resposta exaustiva.
— Ccalboni

Consegui entrar em contato com os desenvolvedores do WhatsApp. Eles admitiram que esse recurso não é suportado.
— HoldOffHunger

7

Em geral, faz sentido exibir apenas o Whatsapp Link nos dispositivos iOS ou Android, usando o script java:

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

O que não funcionou? O link foi exibido em um dispositivo não móvel? No dispositivo móvel, o link não funcionou?
— Weidenrinde 29/03

O aplicativo WhatsApp é aberto. Mas nem um texto nem uma mensagem são exibidos. Testado em vários sistemas operacionais e dispositivos. Enviei um e-mail aos desenvolvedores. Eles oficialmente não suportam esse comportamento "Infelizmente, isso não é suportado no momento. Estamos sempre trabalhando para melhorar nosso aplicativo e levaremos sua sugestão em consideração". (ticket # 172349248330585) Testei ~ 40 outros serviços, apenas o WhatsApp e o Viber não suportam sua própria documentação.
— HoldOffHunger 29/0318

7

Acabei de testar o whatsapp://esquema no meu super antigo Android 2.3.3com Whats App 2.11.301, funciona como um encanto. Parece ser apenas a Whats Appversão. Como Whats Appestá forçando todos a atualizar, deve ser seguro usá-lo.

A Whats Appdocumentação também menciona esse esquema: http://www.whatsapp.com/faq/en/android/28000012

Estou usando isso em um site de produção agora e será atualizado aqui, se eu receber alguma reclamação do usuário.

Editar (14 de novembro): nenhuma reclamação do usuário após algumas semanas.


6

Os documentos oficiais dizem para uso: wa.me. Não use wa.me. Experimente você mesmo: https://wa.me/?text=SomeTexttoShare Resultados para mim:

Não foi possível encontrar a página que você estava procurando

Parece que você está procurando uma página que não existe. Ou uma página que podemos ter excluído. De qualquer forma, volte ou verifique o URL, a ortografia e tente novamente.

Se você deseja compartilhar, use absolutamente um dos dois formatos de URL a seguir:

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

Se você estiver interessado em assistir a um projeto que monitora esses URLs, consulte-nos !: https://github.com/bradvin/social-share-urls#telegramme

URLs de compartilhamento em redes sociais


Usar whatsapp://send?text=funciona para mim, com ou sem codificação de URL. Só testei no iOS
— Snowball

Olá, @Snowball: Obrigado pelo comentário, na verdade, que só funcionará quando o aplicativo whatsapp estiver instalado. Isso é normal para customProtocol://action=?tipos de links. Então, isso não fará nada em um desktop. Para isso, seria necessário detectar o sistema operacional e, em seguida, usar um URL para desktop e outro para iOS. Mas isso é realmente uma questão completamente diferente do que o OP está pedindo.
— HoldOffHunger 18/06

3

Alterne os links de compartilhamento do whatsapp de acordo com a plataforma, seja desktop ou móvel.

Isso funciona com ou sem o fornecimento do número de telefone no link.

Para dispositivos móveis

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

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

Para Desktop

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

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

3

Este código funcionou para mim.

Depois de clicar no link, ele solicitará que você escolha o contato para compartilhar uma mensagem.

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

Você pode adicionar o atributo target = "_ blank" para abri-lo em uma nova janela ou guia.

Não acho que o número de telefone seja necessário quando alguém deseja compartilhar uma mensagem ou artigo específico.


isso pode ser aberto na área de trabalho do navegador? encaminhado para a página web.whatsapp?
— gumuruh

1

use-o como "whatsapp: // send? text =" + encodeURIComponent (seu texto vai aqui), ele definitivamente funcionará.


0

Tente fazer desta maneira:

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

Mesmo você pode enviar mensagens sem inserir o número de telefone no link:

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

Depois de clicar no link, você verá uma lista de contatos para os quais pode enviar sua mensagem.

Mais informações em https://faq.whatsapp.com/en/general/26000030 .

Boa sorte!


whatsapp diz que não conseguimos encontrar a página que você estava procurando
— Reza Mortazavi

Eu não entendo WhatsApp mostra esse erro? Quando?
— Gustavo Cantero
Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.