【问题标题】:Mobile website "WhatsApp" button to send message to a specific number移动网站“WhatsApp”按钮向特定号码发送消息
【发布时间】:2015-05-26 22:08:56
【问题描述】:

可以自定义移动网站,以允许用户将 WhatsApp 中预先填写的消息分享给手动选择的联系人。正如给定的here 一样,它是使用自定义 URL 方案完成的。一个例子:

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

拨打我们使用的特定号码:

<a href="tel:0123456789">Call</a>

同样,我们能否在不让用户手动选择电话号码的情况下将 WhatsApp 消息发送到特定号码(或至少打开聊天),而是将其作为预定义的参数/属性值之一?

【问题讨论】:

标签: html mobile-website whatsapp


【解决方案1】:

要从网站发送 Whatsapp 消息,请使用以下 URL。

网址:https://api.whatsapp.com/send?phone=XXXXX&text=dummy

这里 phonetext 是参数,其中之一是必需的。

  • 电话:我们需要向谁发送消息
  • 文字:文字需要分享。

这个网址也可以使用。如果没有找到应用程序,它会显示一个空白屏幕!

网址:whatsapp://send?text=要分享的文字!

注意:以上所有内容都可以在网络上运行,前提是安装了 WhatsApp 桌面应用程序

【讨论】:

    【解决方案2】:

    正如其他人所指出的,官方文档可在此处获得:WhatsApp.com FAQ: Android -> Chats -> How to use click to chat。文档指出:

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

    但是!我们为什么不尝试将其复制到浏览器的新标签中并立即前往那里?

    https://wa.me/text=testtesttesttest

    结果:找不到错误页面。

    什么给了???

    使用 THESE 格式之一轻松修复它:

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

    此 URL 中没有 wa.me 域!

    【讨论】:

      【解决方案3】:

      向特定号码发送 WhatsApp 消息的格式(2018 年 11 月更新)

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

      在哪里

      whatsappphonenumber 是国际格式的完整电话号码

      urlencodedtext 是 URL 编码的预填充消息。


      示例:

      1. 创建一个带有预填充消息的链接,该链接将 自动出现在聊天的文本字段中,发送到特定号码

        发送我有兴趣出售您的汽车+001-(555)1234567

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

        注意:

        使用:https://wa.me/15551234567

        不要使用:https://wa.me/+001-(555)1234567

      2. 创建一个仅包含预填充消息的链接,该消息将 自动出现在聊天的文本字段中,号码将由用户选择

        发送我正在询问公寓房源

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

        点击链接后,用户将看到他们的联系人列表 可以将预填的消息发送到。

      欲了解更多信息,请参阅https://www.whatsapp.com/faq/en/general/26000030

      --

      P.S : 旧格式(更新前)供参考

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

      【讨论】:

      【解决方案4】:

      我使用了这个代码,它对我来说很好,只需将 +92xxxxxxxxxx 更改为您的有效 whatsapp 号码,带有国家/地区代码

      <script type="text/javascript">
              (function () {
                  var options = {
                      whatsapp: "+92xxxxxxxxxx", // WhatsApp number
                      call_to_action: "Message us", // Call to action
                      position: "right", // Position may be 'right' or 'left'
      
                  };
                  var proto = document.location.protocol, host = "whatshelp.io", url = proto + "//static." + host;
                  var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = url + '/widget-send-button/js/init.js';
                  s.onload = function () { WhWidgetSendButton.init(host, proto, options); };
                  var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
              })();
          </script> 
      

      【讨论】:

      • 拒绝加载脚本“chrome-extension://static.whatshelp.io/widget-send-button/js/init.js”,因为它违反了以下内容安全策略指令:“脚本-src 'self' blob:文件系统:"。请注意,'script-src-elem' 没有显式设置,因此 'script-src' 用作后备。
      【解决方案5】:

      此答案对于希望在网站中单击聊天whatsapp 以使用默认内容或消息重定向 web.whatsapp.com 以及在移动设备中以默认内容在移动应用程序中打开whatsapp 到应用程序文本栏的他们很有用。

      还添加 jquery 链接。

      <a  target="_blank" title="Contact Us On WhatsApp" href="https://web.whatsapp.com/send?phone=+91xxxxxxxxx&amp;text=Hi, I would like to get more information.." class="whatsapplink hidemobile" style="background-color:#2DC100">
      <i class="fa fa-fw fa-whatsapp" style="color:#fff"></i>
      <span style="color:#fff">
          Contact Us On WhatsApp        </span>
      </a>
      <a  target="_blank" title="Contact Us On WhatsApp" href="https://api.whatsapp.com/send?phone=+91xxxxxxxxx&text=Hi,%20I%20would%20like%20to%20get%20more%20information.." class="whatsapplink hideweb" style="background-color:#2DC100">
      <i class="fa fa-fw fa-whatsapp" style="color:#fff"></i>
      <span style="color:#fff">
          Contact Us On WhatsApp        </span>
      </a>
      
      <script type="text/javascript"> 
      var mobile = (/iphone|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));  
      if (mobile) { 
      
      $('.hidemobile').css('display', 'none'); // OR you can use $('.hidemobile').hide();
      } 
      else 
      { 
      $('.hideweb').css('display', 'none'); // OR you can use $('.hideweb').hide();
      }
      </script>
      

      【讨论】:

        【解决方案6】:

        WhatsApp 现在提供了一个更简单的 API https://wa.me/ 这不是引入任何新功能,只是一种更简单的执行方式。在实现此 API 时无需检查用户代理,因为它还可以与原生应用程序以及桌面上的 whatsapp (web.whatsapp.com) 的 Web 界面一起使用。

        这可以在多个用例中使用

        • 点击聊天按钮:使用https://wa.me/whatsappphonenumber 与指定的whatsapp 用户打开聊天对话框。请注意,whatsappphonenumber 应该是国际格式的有效 whatsapp 号码,没有前导零、“+”、“-”和空格。例如15551234567

          &lt;a href="https://wa.me/15551234567"&gt;Whatsapp Me&lt;/a&gt;

        • 在 whatsapp 上分享按钮:使用 https://wa.me/?text=urlencodedtext 打开带有预设文本的 whatsapp 联系人选择对话框。例如

          &lt;a href="https://wa.me/?text=I%20found%20a%20great%20website.%20Check%20out%20this%20link%20https%3A%2F%2Fwww.example.com%2F"&gt;Share on WhatsApp&lt;/a&gt;

        • 带有预填充文本联系我按钮:以上两者的组合,如果您想从登陆特定的用户那里获得预填充的自定义消息,可能会很有用页。使用格式https://wa.me/whatsappphonenumber/?text=urlencodedtext

          &lt;a href="https://wa.me/15551234567?text=I%20am%20interested%20in%20your%20services.%20How%20to%20get%20started%3F"&gt;I am interested&lt;/a&gt;

        官方文档请访问https://faq.whatsapp.com/en/general/26000030

        【讨论】:

          【解决方案7】:
          【解决方案8】:

          在安卓上,你可以试试

          href="intent://send/[countrycode_without_plus][number]#Intent;scheme=smsto;package=com.whatsapp;action=android.intent.action.SENDTO;end
          

          用数字替换[countrycode_without_plus][number]

          【讨论】:

            【解决方案9】:

            不幸的是,没有选项可以在 whatsapp 协议中输入数字。只有参数 ABID(地址簿 ID)才有可能,但您必须让此联系人具有特定姓名才能执行此操作。 检查WhatsApp Documentation

            【讨论】:

              猜你喜欢
              • 2013-09-04
              • 2015-07-08
              • 1970-01-01
              • 2017-09-17
              • 2018-10-25
              • 2013-09-24
              • 1970-01-01
              • 1970-01-01
              相关资源
              最近更新 更多