摘要:折騰了一整天,官方文檔看了好幾遍,網上基本上所有的方法都試了,發現都沒什么卵用,最后打開的分享頁面,再復制分享頁面的鏈接,發現鏈接是這個格式,相比之下只是多了個字段,抱著試一試的心態,在當前鏈接中添加,發現所有問題都迎刃而解。
最近在做某個需要在微信中打開的項目,部分頁面會通過微信分享或復制鏈接分享給其他人,然后就遇到了以下坑:
1.IOS端復制鏈接或在其他瀏覽器中打開時,假如原網站鏈接本來應該是"http://xxx.xxxx.xxx/#/abcd",但復制和在其他瀏覽器中打開的鏈接都是"http://xxx.xxxx.xxx/#/"
2.android端分享頁面時,wx.onMenuShareAppMessage配置沒問題,分享后回調函數顯示調用成功,但分享的鏈接打開依舊是"http://xxx.xxxx.xxx/#/"頁(官方說6.7.2分享用updateAppMessageShareData接口,但是引入1.4.0版本js-sdk還是顯示這個接口沒法用)。
折騰了一整天,官方文檔看了好幾遍,網上基本上所有的方法都試了,發現都沒什么卵用,最后打開IOS的分享頁面,再復制IOS分享頁面的鏈接,發現鏈接是這個格式"http://xxx.xxxx.xxx/?from=singlemessage#/abcd",相比之下只是多了個"?from=singlemessage"字段,抱著試一試的心態,在當前鏈接中添加"?from=singlemessage",發現所有問題都迎刃而解。代碼如下:
.... ....wx.config配置.... .... const ua = window.navigator.userAgent.toLowerCase() const isIOS = !!ua.match(/iphone|ipad/) const isWechat = ua.includes("micromessenger") var firstEnter = true router.beforeEach((to, from, next) => { if (isWechat) { let toPath = location.origin + (location.pathname + (location.hash ? "?from=singlemessage#" : "") + to.fullPath).replace("http://", "/") if (isIOS && location.href !== toPath) { if (firstEnter) { // 他人打開分享頁面后,else中的內容會讓第一個頁面加載兩次(應該是微信默認跳轉引起的,else中明明已經禁用了vue的跳轉) firstEnter = false } else { // 不采用vue默認跳轉方式,使用原生跳轉,解決復制鏈接或在其他瀏覽器中打開時,鏈接錯誤 next(false) location.href = toPath return } } let config = { title: to.meta.title || "", desc: location.href, link: toPath, imgUrl: "", type: "link", dataUrl: "" } wx.ready(function () { wx.onMenuShareTimeline(config) wx.onMenuShareAppMessage(config) }) } next() })
猜測微信內部應該會對域名是mp.weixin.qq.com以外的鏈接進行判斷,若沒有"?from=singlemessage"字段就直接跳轉到首頁?
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/103984.html
摘要:你要是問我為什么會出現這種情況,等我什么時候進微信團隊了,我再給大家解答。。。 很久沒有寫文章了,最近項目是基于微信公眾號的Vue項目,有一個非常重要的分享功能,不搞不知道一搞不得了,發現vue-router和微信SDK配置有很大的兼容性問題,翻遍文檔,社區,博客,都沒有找到可以適合解決我這個問題的方法,最后是我們一起一個一個方法、一個一個api嘗試才找到解決辦法,現在和大家分享一下我...
摘要:微信分享簽名錯誤單頁應用模式下微信分享一直提示簽名錯誤按照微信官網文檔,已經引入,正確的配置安全域名,后臺開發人員生成的簽名也通過微信簽名工具驗證,但是前端的自定義分享一直報簽名錯誤,沒有辦法自定義分享,如果確保了哪些基本配置沒有問題,并且 微信分享簽名錯誤invalid signature vue單頁應用history模式下微信分享一直提示簽名錯誤invalid signature ...
摘要:我個人比較推薦的方法是或者安卓手機的這種方式,比較簡單方便快捷,然后根據具體的環境再選擇更為合適的調試方法。 本文首次發表于本人的個人博客:http://cherryblog.site/ ,歡迎大家到我的博客查看更多文章~ 前言 在開發中前端免不了要進行移動端的開發,然而在電腦上看的樣式和手機上還是有一定的差距的,因為手機上有頂部的狀態欄和底部的菜單欄,特別是在qq內置瀏覽器中打開,差...
閱讀 2664·2021-11-24 09:38
閱讀 1979·2019-08-30 15:53
閱讀 1234·2019-08-30 15:44
閱讀 3229·2019-08-30 14:10
閱讀 3579·2019-08-29 16:29
閱讀 1800·2019-08-29 16:23
閱讀 1099·2019-08-29 16:20
閱讀 1472·2019-08-29 11:13