uniapp图片分享qq

根据uniapp官网上的组件https://uniapp.dcloud.io/api/plugins/share进行微信，qq分享。微信分享看文档即可，今天主要说一说图片分享qq，及遇到的一些坑。

一、源码

代码1，html代码。

<canvas canvas-id="myCanvas" style="border:1px solid #c3c3c3;visibility: hidden;position: fixed;min-width: 300px;min-height: 400px;"></canvas>

代码2，将图片放入canvas中。

// app生成canvas预览图

createCanvas(){

const ctx = uni.createCanvasContext('myCanvas');

ctx.beginPath();

ctx.drawImage( this.Logo );

ctx.draw();

console.log(ctx);

},

代码3，分享。

uni.canvasToTempFilePath({

canvasId: 'myCanvas',

fileType: 'jpg',

success: res=> {

    // 在H5平台下，tempFilePath 为 base64

  console.log(res.tempFilePath)

  uni.share({

provider: 'qq',

type: 2,

Scene : "WXSenceTimeline",

// url:strurl,

title: '知识岛',

// summary: strShareSummary,

imageUrl: res.tempFilePath,

success: function(res) {

console.log("success:" + JSON.stringify(res));

},

fail: function(err) {

console.log("fail:" + JSON.stringify(err));

uni.showToast({

title: '分享失败',

position: 'bottom'})}}) }})

以上代码就实现了图片分享qq。

二、遇到的坑及解决方法

        一开始按照分享微信的方法来做分享qq，但是一直报错图片非法路径，后来百度了很多，发现qq分享图片地址必须是本地（这也太坑，就是图片地址不能是网络图片）。我有百度了很多，发现我无法获取本地图片地址，而且app上的图片本身就是网络上的，需要保存本地才能分享，wtf。

最后的解决办法是：线将图片保存到canvas，然后用uni.canvasToTempFilePath获取预览地址，然后放到uni.share后就可以了，wtm真是个天才。