WhatsApp HTML Sharing Ссылка для изображения

Question

Я знаю, что вы можете обмениваться сообщениями с и теперь это работает на Android и IOS:

<a href="whatsapp://send?text=Hello world this is a message and a link http://www.example.com/image.jpg">Share with whatsapp</a> 

Однако я хотел бы поделиться изображение корыта кнопку на своем сайте, как кто-то будет делить изображение с его телефона (галереи). Это так или иначе возможно?

Answer 1

Одним из решений, которое приходит на ум, является загрузка фотографии на ваш сервер через AJAX, возврат ссылки на загруженную фотографию, а затем отправку сообщения со ссылкой на вашу фотографию с использованием метода, описанного в вашем вопросе. Это не довольно то же самое, что и отправка изображения напрямую с помощью Whatsapp, поскольку получатель получит только ссылку, но я сомневаюсь, что когда-нибудь будет возможность отправить изображение в другое приложение из вашей галереи с помощью веб-страницы, поскольку это поднимет некоторые серьезные проблемы.

Грубо говоря, процесс хотел бы это (имейте в виду, что для этого потребуется некоторое тестирование, чтобы получить право и найти решение, которое хорошо работает на всех платформах, или по крайней мере большинство из них):

1. Создать загрузка изображения на ваш сайт. Просто имея <input type="file" accept="image/*"> на вашей странице, на большинстве платформ вы можете создать кнопку, которая откроет диалоговое окно для выбора изображения из галереи вашего телефона при нажатии. Вы можете найти full example here или использовать библиотеку, такую ​​как Plupload, которая содержит множество способов загрузки, включая HTML5, который вам нужен.

2. Создайте простую загрузку на серверной стороне. Это зависит от вашего языка и платформы, но все, что вам нужно сделать, это сохранить изображение где-то и вернуть ссылку на него в ответ. Если вы не хотите хранить эти изображения на своем сервере, вы можете переслать его на Imgur API и загрузить туда.

3. Переадресовать пользователя на ссылку whatsapp://, содержащую ссылку на изображение.

   window.location = 'whatsapp://send?text='+encodeURIComponent(imageURL); 
   

   Это то место, где вам нужно провести тестирование на разных платформах. Возможно, вы не сможете перенаправить ссылку whatsapp:// (так как это похоже на проблему безопасности), поэтому вам может потребоваться обмануть ее (это плохая идея, но я включаю ее для полноты; data-action часть из this answer):

   var fakeLink = document.createElement('a'); 
   fakeLink.setAttribute('href', 'whatsapp://send?text='+encodeURIComponent(imageURL)); 
   fakeLink.setAttribute('data-action', 'share/whatsapp/share'); 
   fakeLink.click(); 
   

   в конце концов, если ни одна из этих работ, лучше всего создает ссылку, как только загрузка будет завершена, для пользователя «подтвердить» отправка, который фактически содержит выше whatsapp:// ссылку в поле href.

Есть много факторов, чтобы проверить и некоторые, которые являются конкретной реализации, так что я должен был держать его расплывчатым без особого кода - если попадается что-нибудь еще при осуществлении этого, пожалуйста, укажите это в комментариях.