这个我已经用头撞了几个星期了。
设想:
- 让用户从他们选择的图层中生成图像
- 将图像转换为画布
- 使用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);
}
);
});
};