需求:有一个做好的微信公众号项目(vue框架搭建的),还要做一个小程序版的,为了减少开发工作,全部使用web-view嵌入网页。
但要能分享,有二种分享情况
1、小程序分享出当前打开的页面
2、部分页面要求,分享指定页面,而不是当前的页面
以下是代码部分
一、web-view内嵌公众号网页中添加代码
1.引入js
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>2.跳转到小程序中页面----在 分享页面是指定页面,而不是分享当前页面的网页中 加入
var isMiniprogram = false// 判断是否是小程序打开wx.miniProgram.getEnv((res) => { if (res.miniprogram) {//在小程序中 isMiniprogram = true }});var url=要打开的网页链接url// 是小程序打开,并且不是小程序已经重新加载过的网址--避免死循环if (isMiniprogram && this.$route.query.platform != "miniprogram") { url = encodeURIComponent(url); // 注意需要urlencode // 跳转到小程序页面,并在小程序中打开url页 // 注意要使用wx.miniProgram.redirectTo,其它方法试了不行 wx.miniProgram.redirectTo({url: '/pages/index/index?return_url='+url+'&share_url=要分享的链接(当要分享的页面不是要打开的页面时使用)&share_title=要分享标题' })} // 非小程序打开正常跳转else { window.location.href=url;}二、小程序中代码处理
1、index.wxml中代码
src后加#wechat_redirect,是为了解决:在iOS中JSSDK接口调用无响应的情况
<!--index.wxml --><view class="container"> <web-view src="{{web_src}}#wechat_redirect" /></view>2、index.js中代码
//获取应用实例const app = getApp()Page({ data: { web_src:'', // 嵌入的网址 sharetitle:'', // 指定分享的标题 share_src:'', // 指定分享的网址 }, //事件处理函数 bindViewTap: function() { wx.navigateTo({ url: '../logs/logs' }) }, onLoad: function (options) { // 指定分享页面,即分享页,非当前页时 if (options.return_url) { var web_url = decodeURIComponent(options.return_url); // 网址中加参数标记是小程序重新载入的 web_url += web_url.indexOf('?') == -1 ? '?' : '&'; web_url += 'platform=miniprogram'; var share_url = decodeURIComponent(options.share_url); } else { var web_url = '网站首页' var share_url = web_url; } this.setData({ web_src: web_url, share_src: share_url, sharetitle: options.sharetitle ? options.sharetitle : '', }, function () { }); }, // 分享 onShareAppMessage(options) { var that = this var share_src = that.data.share_src // 分享标题-有指定分享标题时就使用指定的,没有使用默认的 var title = that.data.sharetitle ? that.data.sharetitle : that.data.title; // 当嵌入网址是重新载入时,更新分享链接为当前网址 if (options.webViewUrl.indexOf('miniprogram') == -1) { share_src = options.webViewUrl title = that.data.title; } var path = '/pages/share/share?return_url=' + encodeURIComponent(share_src); return { title: title, path: path, success: function (res) { } } },})
微信小程序













