相比分享好友和群聊，分享朋友圈是比较麻烦的。那么下面就是分享朋友圈的实现方式了：
第一步：一个触发按钮，点击跳转到指定页面：
<button class='shareFri' bindtap='onShareFriends'>发给群聊或好友</button>
onShareFriends:function(){
wx.navigateTo({
url: '../shareFriends/shareFriends?imgurl=' + imgurl + '&nowrmb=' + nowrmb,//可根据实际情况传指定的参数去新页面
})
}
第二步：用canvas画指定的图文
<canvas style="width: 300px; height: 200px;" canvas-id="firstCanvas"></canvas>
drawCanvas: function (e) {
// 使用 wx.createContext 获取绘图上下文 context var context = wx.createCanvasContext('firstCanvas')
context.drawImage(图片地址, 0, 0, 150, 100)//画图片和小程序码 context.setStrokeStyle("#00ff00") context.setLineWidth(5) context.rect(0, 0, 200, 200) context.stroke() context.setStrokeStyle("#ff0000") context.setLineWidth(2) context.moveTo(160, 100) context.arc(100, 100, 60, 0, 2 * Math.PI, true) context.moveTo(140, 100) context.arc(100, 100, 40, 0, Math.PI, false) context.moveTo(85, 80) context.arc(80, 80, 5, 0, 2 * Math.PI, true) context.moveTo(125, 80) context.arc(120, 80, 5, 0, 2 * Math.PI, true) context.stroke() context.draw() },
onload:function(){
this.drawCanvas()
}
注意：这里的小程序码是后台返回的，后台会返回小程序码的图片地址给我们；如果是前端自己生成小程序码，
就需要调用https://developers.weixin.qq.com/miniprogram/dev/api/qrcode.html，地址里面有三种方式，
第一种和三种简单，第二种需要用到scene参数，这个参数在onload中的options里面可以接受；
我个人不建议前端生成小程序码，因为我试过了，通过上面地址的接口返回的小程序码是乱码，需要解析，
而我试过Blob、ArrayBuffer、FileReader等方法，开发者工具支持，而手机显示有问题，最后经过很多测试，
还是决定后台来生成小程序码
第三步：将画好的canvas转为图片
wx.canvasToTempFilePath({
x: 100,
y: 200,
width: 50,
height: 50, destWidth: 100, destHeight: 100, canvasId: 'myCanvas', success: function(res) { console.log(res.tempFilePath)//转化成的图片地址 } })
第四步：预览图片
wx.previewImage({
current: '', // 当前显示图片的http链接
urls: [] // 需要预览的图片http链接列表
})第五步：将图片保存到相册
wx.saveImageToPhotosAlbum({
filePath: tempFilePath,
success(res) {
wx.showModal({
title: '图片成功保存到相册了，去发圈噻~',
success: function (res) {
wx.navigateBack() //保存成功后跳回前一个页面
}
})
}
})
大概实现过程就是如此，不过这个中有很多坑，下面我就来说一下实现这个过程中的坑有哪些。