這個功能應該分三步來做：

一、製作海報圖片

二、儲存圖片到相簿

三、手動發朋友圈再到相簿中取圖片

詳細步驟：

一、製作海報

1.要製作能儲存到相簿的圖片，我們需要一個canvas標籤，在我們的wxml的最後加入canvas標籤：

<button class="shareBtns" bindtap='onSaveImg'></button>
<canvas canvas-id="myCanvas" style="position:fixed;visibily:hidden;width: 646px; height: 966px;" />

因為我需要的圖片大小是646*966的圖片，所以大家根據自己相應的需求設定大小。

2.在wxml檔案相應的js檔案中：

//先製作一個canvas標籤，再儲存成圖片
onSaveImg: function () {
    const ctx = wx.createCanvasContext('myCanvas');         //看回wxml裡的canvas標籤，這個的myCanvas要和標籤裡的canvas-id一致

    ctx.clearRect(0, 0, 644, 966);
    ctx.drawImage("../../img/test1.png", 0, 0, 646, 966);
    ctx.drawImage("../../img/test2.png", 0, -60, 646, 966);
    ctx.drawImage("../../img/tipsImg" + this.data.tipsImgId + ".png", 79, 291 - 60, 492, 244);
    ctx.drawImage("../../img/test3.jpg", 90, 780 - 60, 135, 135);
    ctx.setFillStyle("#02446e");
    ctx.setFontSize(26);
    ctx.fillText("親愛的" + this.data.testName + this.data.testId, 100, 610 - 60);
    ctx.setTextAlign("center");
    ctx.fillText("你的有入扔有人不迷", 435, 790 - 60);

    ctx.setTextAlign("left");
    ctx.setFillStyle("black");
    ctx.setFontSize(18);
    ctx.fillText("我等你", 330, 825 - 60);
    ctx.setFontSize(22);

    ctx.drawImage("../../img/test4.png", 0, 936 - 60, 646, 30);
    var self = this;

    ctx.draw(true, setTimeout(function () {     //為什麼要延遲100毫秒？大家測試一下
        wx.canvasToTempFilePath({
            x: 0,
            y: 0,
            width: 646,
            height: 966,
            destWidth: 646,
            destHeight: 966,
            canvasId: 'myCanvas',
            success: function (res) {
              self.data.savedImgUrl = res.tempFilePath;
              self.saveImageToPhoto();
            }
        })
    }, 100))
},
 

二、儲存圖片到相簿

這個功能和我的上一篇文章的功能一致，以下是這個案例的程式碼：

//儲存圖片到相簿
saveImageToPhoto: function () {
    if (this.data.savedImgUrl != "") {
        wx.saveImageToPhotosAlbum({
            filePath: this.data.savedImgUrl,
            success: function () {
                wx.showModal({
                    title: '儲存圖片成功',
                    content: '尋人啟事已經儲存到相簿，您可以手動分享到朋友圈！',
                    showCancel: false
                });
            },
            fail: function (res) {
                console.log(res);
                if (res.errMsg == "saveImageToPhotosAlbum:fail cancel") {
                    wx.showModal({
                        title: '儲存圖片失敗',
                        content: '您已取消儲存圖片到相簿！',
                        showCancel: false
                    });
                } else {
                    wx.showModal({
                        title: '提示',
                        content: '儲存圖片失敗，您可以點選確定設定獲取相簿許可權後再嘗試儲存！',
                        complete: function (res) {
                            console.log(res);
                            if (res.confirm) {
                                wx.openSetting({})      //開啟小程式設定頁面，可以設定許可權
                            } else {
                                wx.showModal({
                                    title: '儲存圖片失敗',
                                    content: '您已取消儲存圖片到相簿！',
                                    showCancel: false
                                });
                            }
                        }
                    });
                }
            }
        })
    }
},
 

三、手動發朋友圈再到相簿中取圖片

這個就不需要細說了。

總結：現在的小程式沒有發朋友圈的許可權，但是勞動人民的智慧是無窮的。所以上面的方法應該是解決這個問題比較普遍的方法了。

還有，如果大家只想發圖片到朋友圈，就只需要第二、三步就可以了。至於儲存圖片到相簿更細節的知識點，可以看我的上一篇文章。