4

这个我已经用头撞了几个星期了。

设想:

  1. 让用户从他们选择的图层中生成图像
  2. 将图像转换为画布
  3. 使用share_open_graph在 facebook 墙上分享画布上的图像(连同图像,短文本和标题将被共享)

我已经有一个使用publish_actions的解决方案,但最近从 API 中删除并且不再可用。

我正在使用 js 和 html 进行所有代码处理。

问题是我可以从画布生成一个 png 图像,但它保存为 base64 并且share_open_graph不允许这种类型的图像,它需要一个直接的 URL,例如“./example.png”。我尝试过使用多种方法和 canvas2image,使用文件系统转换和保存图像,但所有这些都失败了。

从 2018 年 4 月/2018 年 5 月开始,是否有人使用share_open_graph有类似的场景和可能的解决方案?

我当前的代码如下所示 - 它在图像转换时失败并保存到文件中(未捕获(承诺中)TypeError:r.existsSync 不是 n 处的函数(file-system.js:30))。但我对不同的解决方案持开放态度,因为这显然行不通。

html2canvas(original, { width: 1200, height: 628 
}).then(function(canvas) 
{
fb_image(canvas);
});
var fb_image = function(canvas) {
canvas.setAttribute('id', 'canvas-to-share');
document.getElementById('img-to-share').append(canvas);
fbGenerate.style.display = 'none';
fbPost.style.display = 'block';
var canvas = document.getElementById('canvas-to-share');
var data = canvas.toDataURL('image/png');

var encodedPng = data.substring(data.indexOf(',') + 1, data.length);
var decodedPng = base64.decode(encodedPng);

const buffer = new Buffer(data.split(/,\s*/)[1], 'base64');
pngToJpeg({ quality: 90 })(buffer).then(output => 
fs.writeFile('./image-to-fb.jpeg', output));

var infoText_content = document.createTextNode('Your image is being 
posted to facebook...');
infoText.appendChild(infoText_content);

// Posting png from imageToShare to facebook

fbPost.addEventListener('click', function(eve) {
  FB.ui(
    {
      method: 'share_open_graph',
      action_type: 'og.shares',
      href: 'https:example.com',
      action_properties: JSON.stringify({
        object: {
          'og:url': 'https://example.com',
          'og:title': 'My shared image',
          'og:description': 'Hey I am sharing on fb!',
     'og:image': './image-to-fb.jpeg',
     },
    }),
   },
   function(response) {
    console.log(response);
   }
  );
 });
};
4

0 回答 0