简体   繁体   English

在最新的 iOS 更新到 12.2 后,如何修复 iOS 主屏幕 Chrome 快捷方式中的“whatsapp://”协议点击中断?

[英]How to fix the "whatsapp://" protocol click in iOS Homescreen Chrome Shortcut broken after latest iOS update to 12.2?

Previous / Working State:以前/工作状态:

Javascript was fetching some simple date/time values from HTML form & was setting string "whatsapp://send?text="+encodeURIComponet(str) as href of an a element. Javascript 从 HTML 表单中获取一些简单的日期/时间值,并将字符串"whatsapp://send?text="+encodeURIComponet(str)设置为a元素的 href。

On iOS, I opened the link on Safari, selected Bookmarks -> Add to Home Screen.在 iOS 上,我在 Safari 上打开链接,选择书签 -> 添加到主屏幕。 All was working ie on pressing "Go", javascript ran, fetched values, generated string, & then Safari Autoredirected to Whatsapp App with a list of contacts to choose for message, as well as Share link worked if clicked manually.一切正常,即按下“Go”,javascript 运行,获取值,生成字符串,然后 Safari 自动重定向到 Whatsapp 应用程序,其中包含可供选择消息的联系人列表,以及如果手动单击则共享链接有效。

href.value = whatsapp://send?text=Apr-21%3A%20Dav%20OUT%20at%2007%3A19pm href.value = whatsapp://send?text=Apr-21%3A%20Dav%20OUT%20at%2007%3A19pm

After I updated the iPhone 8 to latest iOS 12.2 three days ago:三天前我将 iPhone 8 更新到最新的 iOS 12.2 后:

Same setup, but now after clicking button "Go", Safari shows the following URL in address/status bar & a white page showing相同的设置,但现在单击“Go”按钮后,Safari 会在地址/状态栏中显示以下 URL,并显示一个白页

Safari cannot open the page because it
cannot redirect to locations starting
with "whatsapp:"

Manual click & element.click() both gives above error.手动点击和 element.click() 都给出了上述错误。 Same everyhting in iOS Chrome or iOS Safari browser are working as intented, but gives error only when used from Add to Homescreen App. iOS Chrome 或 iOS Safari 浏览器中的所有内容都按预期工作,但仅在从“添加到主屏幕应用程序”中使用时才会出错。

My Code我的代码

HTML HTML

<form>
<label for="date">Date</label><input id="date" name="date" type="date" required>
<label for="what">In/Out</label>
<select id="what" name="what" required>
  <option value="tIn">IN</option>
  <option value="tOut">OUT</option>
</select>
<label for="when">Time</label>
<input id="when" name="when" type="time" step=60 required><!-- step=60 will show only HH:MM -->
<input type="submit" onClick="process()" value="Go">
<a id="share">Share</a>

JS JS

function process(){
  var date = document.getElementById("date").value;
  var what = document.getElementById("what").value;
  var when = document.getElementById("when").value;
  var waStr = waFormat(date,what,when);

  var share = document.getElementById("share");
  share.href = "whatsapp://send?text=" + encodeURIComponent(waStr);
  share.click();
}

//return string for whatsapp link
function waFormat(waDate,waWhat,waWhen){
  var sp = " ";
  waDate = waDate.split("-");
  var mon = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
  waDate = mon[(waDate[1]-1)] + "-" + waDate[2]; 
  waWhat = (waWhat == "tIn") ? "IN" : "OUT";
  waWhen = waWhen.split(":");
  var apm = "am";
  if(waWhen[0]>12){
    waWhen[0] = waWhen[0]-12;
    apm = "pm";
  }
  waWhen = ("0" + waWhen[0]).slice(-2) + ":" + waWhen[1] + apm;
  return waDate + ": "+ waWhat + sp + "at" + sp + waWhen;
}

I switched between encode()/encodeURI()/encodeURIComponent, but no avail.我在 encode()/encodeURI()/encodeURIComponent 之间切换,但无济于事。

Please help.请帮忙。 Where could be the problem for that whatsapp:// not working in HomeScreen Safari App? whatsapp:// 在 HomeScreen Safari 应用程序中不起作用的问题在哪里? I could use https://wa.me link but would also like to find if whatsapp:// has stopped working?我可以使用https://wa.me链接,但也想知道 whatsapp:// 是否已停止工作?

It works when same page is opened from Safari/Any, does NOT work when opened from HomeScreen App in iOS从 Safari/Any 打开同一页面时有效,从 iOS 中的 HomeScreen App 打开时无效

I've ran into this problem too.我也遇到过这个问题。 For my it worked to move away from the url scheme whatsapp:// and use the following guide https://faq.whatsapp.com/en/android/26000030/ .对于我来说,它可以摆脱 url 方案whatsapp://并使用以下指南https://faq.whatsapp.com/en/android/26000030/

To create your own link with a pre-filled message that will automatically appear in the text field of a chat, use https://wa.me/whatsappphonenumber/?text=urlencodedtext where whatsappphonenumber is a full phone number in international format and URL-encodedtext is the URL-encoded pre-filled message.要使用将自动出现在聊天文本字段中的预填充消息创建您自己的链接,请使用https://wa.me/whatsappphonenumber/?text=urlencodedtext其中whatsappphonenumber是国际格式和URL-encodedtext的完整电话号码URL-encodedtext是 URL 编码的预填充消息。

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

To create a link with just a pre-filled message, use https://wa.me/?text=urlencodedtext要创建仅包含预填充消息的链接,请使用https://wa.me/?text=urlencodedtext

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

After clicking on the link, you will be shown a list of contacts you can send your message to.单击链接后,您将看到可以向其发送消息的联系人列表。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 如何链接到iOs上的“固定到主屏幕”webapp? - How to link to a “pinned to homescreen” webapp on iOs? 如何通过 Javascript 检查 iOS.12.2+ 中的运动/方向权限状态? - How to check motion/orientation permissionState in iOS.12.2+ by Javascript? 如何在主屏幕上清除IOS Web App的缓存? - How can I clear the cache of an IOS Web App on the Homescreen? 试图在iOS 10中发送短信,“sms:”协议是否已损坏? - Trying to send sms in iOS 10, Is “sms:” protocol broken? 如何使用HTML和CSS创建Facebook iOS主屏幕版本? - How can I create a version of the Facebook iOS homescreen in HTML and CSS? PWA:如何以编程方式触发:“添加到主屏幕”? 在 iOS Safari - PWA: How to programmatically trigger : "Add to homescreen"? on iOS Safari 如何解决 iOS (Safari / Chrome) 上 3D 动画 CSS 的问题 - How to fix the problem with 3D animation CSS on iOS (Safari / Chrome) 自动完成功能要求您在更新到1.11.0后在iOS中单击两次 - Autocomplete requires you to click twice in iOS after update to 1.11.0 在iOS 12.2上的safari中使用JavaScript请求动态访问 - Request motion access with JavaScript in safari on iOS 12.2 RTCPeerConnection IOS 12.2到Android 7.X - RTCPeerConnection IOS 12.2 to Android 7.X
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM