Отправка сообщения с сайта в WhatsApp | Блог веб-разработчика MaxGraph

Отправка сообщения с сайта в WhatsApp

Привет! Как-то недавно меня спросили, как отправлять сообщения не на почту, не в телеграм, а прямо в чат whatsapp. Сам таким не занимался, но, поискав и подумав - нашел решение. Поехали!

Лично на мой взгляд решение не идеальное. Но другого я не вижу, если вы конечно не используете какие-то плагины на WordPress, и то сомнительно)

Собственно, вся суть находится на этой странице. Нужно по сути отправлять запрос по ссылке, передавая номер телефона (обязательно уже зарегистрированного в WhatsApp и текст письма). Конечно, в плане больших данных придется довольствоваться только строчным представлением, типа: Телефон: 123456, Имя: Алексей, email: alexey@gmail.com. По крайней мере пока я не разобрался с переносами)

Итак, нам нужно сперва создать html-разметку:

HTML

1
2
<input type="text">
<a href="#">Отправить</a>
<input type="text">
<a href="#">Отправить</a>

Простая разметка, ссылка (ну или можно взять кнопку) и инпут.

JS

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function sendToWhatsapp(text, phone) {
 
  text = encodeURIComponent(text);
 
  let url = `https://web.whatsapp.com/send?phone=${phone}&text=${text}&source=&data=`;
 
  window.open(url);
}
 
$('a').click(function(e){
  e.preventDefault();
 
  let phoneNumber = '7911352392';
  let text = $('input').val();
 
  sendToWhatsapp(text, phoneNumber);
}); 
function sendToWhatsapp(text, phone) {

  text = encodeURIComponent(text);

  let url = `https://web.whatsapp.com/send?phone=${phone}&text=${text}&source=&data=`;

  window.open(url);
}

$('a').click(function(e){
  e.preventDefault();

  let phoneNumber = '7911352392';
  let text = $('input').val();

  sendToWhatsapp(text, phoneNumber);
});	

Пишем функцию sendToWhatsapp, передавая два параметра — текст и телефон. Внутри обрабатываем текст с помощью encodeURIComponent(), чтобы убрать пробелы и верно закодировать строку для урла.
Далее формируем сам урл, с помощью шаблонных строк вставляем наши текст и телефон. После этого через window.open() переходим по этой ссылке в новой вкладке.

Ниже же получаем при клике на кнопку телефон и текст и вызываем написанную функцию sendToWhatsapp.

 

Собственно, этот код перебросит нас сразу в чат с собеседником, останется только нажать кнопку «отправить». Ну и нужно понимать, что у отправляющего тоже должна быть настроена web-версия. Как я и говорил, способ не идеальный, но самый простой.

 

Всем успехов в применении :)

Метки: , ,

Понравилось? Оцени!
12345 (3 оценок, среднее: 5,00 из 5)
Загрузка...

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *