目次
序文
最近、社内で uniapp テクノロジーを使用して WeChat アプレット プロジェクトを開発しました。写真を共有するときに、uniapp の技術ドキュメントを確認しました。文章はまだ非常にラフで、説明もあまり明確ではありませんでした。午後に読んだ後、 , わかりました 1つの結論として、uniappはWeChatの友達に写真を転送できるAPIをカプセル化していません。
ヒント: 以下はこの記事の本文であり、次のケースは参考用です。
1. どの API を使用するか?
1. 画像共有機能はuniappのuni.share()の代わりにwx.showShareImageMenu()を使用します。
wx.showShareImageMenu({ //分享给朋友
path: qrimg.value,
success: (res) => {
console.log("分享成功:", res);
},
fail: (err) => {
console.log("分享取消:", err);
},
})
2. 画像の処理を一時パスに変換する必要がある
2. 共有画像の場合、バックエンドがパスを直接返す場合は、パスを一時パスに変換して渡す必要があります。画像がフロントエンドによって生成された場合は、wx.createCanvasContext() を通じて直接描画します。次に、canvasToTempFilePath を通じて画像の一時パスに変換します。
uni.canvasToTempFilePath({
destWidth: 100,
destHeight: 100,
canvasId: 'qrcode',
success: function(res) {
// 在H5平台下,tempFilePath 为 base64
// qrimg.value=res.tempFilePath
resolve(res.tempFilePath)
},
fail: function(error) {
wx.showToast({
title: "保存图片失败",
duration: 2000
})
if (error.errMsg === "saveImageToPhotosAlbum:fail:auth denied" ||
error.errMsg === "saveImageToPhotosAlbum:fail auth deny" ||
error.errMsg === "saveImageToPhotosAlbum:fail authorize no response"
) {
// 这边微信做过调整,必须要在按钮中触发,因此需要在弹框回调中进行调用
wx.showModal({
title: '提示',
content: '需要您授权保存相册',
showCancel: false,
success: modalSuccess => {
wx.openSetting({
success(settingdata) {
console.log("settingdata", settingdata)
if (settingdata.authSetting['scope.writePhotosAlbum']) {
wx.showModal({
title: '提示',
content: '获取权限成功',
showCancel: false,
})
} else {
wx.showModal({
title: '提示',
content: '获取权限失败,将无法保存到相册哦~',
showCancel: false,
})
}
},
})
}
})
reject(error)
}
reject(error)
}
})
3. Windows 側の互換性の問題
3. Windows コンピュータで WeChat を使用して現在のアプレットを開くと、wx.showShareImageMenu() を呼び出しても応答がないことがわかります (成功メソッドと失敗メソッドは実行されません)。相談後、showShareImageMenu メソッドはサポートされていません。 Windows 上で使用するため、Windows システムかどうかを事前に判断する必要があります (getSystemInfoSync().platform が Windows と等しいかどうかを判断することで)。Windows システムの場合は、入り口を隠すか、プロンプトでトーストを発します。この問題を回避する