本问题仅限于vue单页应用开发时的讨论。
1、不带参数的网页,如:http://xxx.com/#/CS350001/pray/buddha,分享后打开的网址,
会变成这样:http://xxx.com/?from=singlemessage&isappinstalled=0#/CS350001/pray/buddha,多了一串字符
?from=singlemessage&isappinstalled=0,这不影响,再打开这个链接并分享,还是正常的。
2、带参数的网页,如:http://xxx.com/#/pray/videoDetail?orderId=64,分享后无法显示自定义的分享内容,这是因为url在传递给后台时带有?等特殊字符,直接传会导致验签失败,所以需要url encode下,总结如下代码:
let url = window.location.href;this.$axios({ method:"get", url:'/wx/jssdk/config?url='+(url.indexOf('/?') == '-1'?url:encodeURIComponent(url)),}).then(function (response) {})
其中/wx/jssdk/config是我后台接口地址,代码如下:
@GetMapping("config")public @ResponseBodyJsonResult config() throws Exception { ApiConfigKit.putApiConfig(getApiConfig()); JsTicket jsApiTicket = JsTicketApi.getTicket(JsTicketApi.JsApiType.jsapi); String jsapi_ticket = jsApiTicket.getTicket(); String nonce_str = createNonceStr(); String url = getPara("url"); String timestamp = createTimestamp(); // 这里参数的顺序要按照 key 值 ASCII 码升序排序 //注意这里参数名必须全部小写,且必须有序 String str = "jsapi_ticket=" + jsapi_ticket + "&noncestr=" + nonce_str + "×tamp=" + timestamp + "&url=" + url; String signature = HashKit.sha1(str); Mapmap = new HashMap(); map.put("appId", ApiConfigKit.getApiConfig().getAppId()); map.put("nonceStr", nonce_str); map.put("timestamp", timestamp); map.put("url", url); map.put("signature", signature); map.put("jsapi_ticket", jsapi_ticket); return JsonResult.success(map);}
(ps:微信开发引入了jfinal-weixin)
如此一来,无论分享多少次,都会正常显示自定义的分享内容。