微信小程序内嵌网页实现分享功能-微信小程序分享功能实现-微信小程序功能开发-即速应用

微信小程序内嵌网页实现分享功能-微信小程序分享功能实现-微信小程序功能开发

浏览量：1780 时间：2020-04-06 来源：小新没有蜡笔†

1.
需求：小程序打开之后跳转到要跳转的地址web-viewsrc"跳转的地址"/web-view，然后实现所跳转的地址中每个网页都可以分享出去，分享出去的网页打开不再是回到初始化页面，而是分享的页面！微信提供分享API是一个叫做onShareAppMessage(options)的方法然后管它什么三七二十一的直接ctrl+C、ctrl+v把示例给拷贝过来，然后把path换成分享的地址！结果很明显预览时候提示找不到路径？！！
请注意文档中有一句很重要的话就是：path必须是/开头的完整路径2.
所以就开始上网找资料，找到一个微信小程序，实现内嵌网页的分享的博客！！！然后分析了一下总结出来一个思路：①首先在add.js文件中定义一个全局变量，存放内嵌网页的地址
globalData:{userinfo:null,ctxPath:"https://xxx"}3.
②然后新建一个名为sharepage的文件夹，然后里边也是有一个share.js文件、一个sharepage.json文件、一个sharepage.wxml文件、一个sharepage.wxss文件③在index.js文件中
4.
varctxPathapp.globalData.ctxPath;//内嵌网页的路径页面加载时，
onLoad:function(options){letthatthis;that.setData({web_src:ctxPath})},5.
分享操作：
onShareAppMessage:function(options){letthatthisletreturn_urloptions.webViewUrlvarpath'pages/sharepage/sharepage?shareUrl'+encodeURIComponent(return_url)//console.log("indexindex",path,options)return{title:'自定义标题',path:path,success:function(res){//转发成功wx.showToast({title:"转发成功",icon:'success',duration:2000})},fail:function(res){//转发失败}}},6.
④然后再index.wxml文件中web-viewsrc"{{web_src}}"/web-view加载内嵌网页⑤在sharepage.wxml中附上代码web-viewsrc"{{share_src}}"/web-view⑥在sharepage.js中，页面加载时
onLoad:function(options){letthatthis;that.setData({share_src:decodeURIComponent(options.shareUrl),})},7.
然后如果还想实现把分享出去的页面还可以分享再在sharepage.js中附加一样的分享操作的代码！
8.
这样就可以实现分享功能了。
9.
不要忘了给sharepage配置路由哦！该项目的gitHub地址：https://github.com/yuhaifeng6/wxxcx_share.git如果觉得不错，带个星哦。谢谢！！
10.
本文参考：https://blog.csdn.net/sennyla/article/details/80022187