上传 Base64 图片 Facebook Graph API [英] Upload Base64 Image Facebook Graph API

问题描述

我正在尝试使用 Node.js 将 base64 图像上传到 Facebook 页面.如果我从文件系统读取文件(即使用 fs.readFileSync('c:a.jpg')

I'm trying to upload a base64 image to a FaceBook page using Node.js. I have managed to get the upload working with all the multipart data etc should I read the file from the filesystem (ie. using fs.readFileSync('c:a.jpg')

但是，如果我使用 base64 编码的图像并尝试上传它，它会给我以下错误:{"error":{"message":"(#1) An unknown error occurred","type":"OAuthException","code":1}}

However, should I use the base64 encoded image and try upload it, it give me the following error : {"error":{"message":"(#1) An unknown error occurred","type":"OAuthException","code":1}}

我尝试通过 new Buffer(b64string, 'base64'); 将其转换为二进制文件并上传，但没有成功.

I have tried converting it to binary by new Buffer(b64string, 'base64'); and uploading that, but no luck.

我已经为此苦苦挣扎了 3 天，因此将不胜感激.

I have been struggling with this for 3 days now, so anyhelp would be greatly appreciated.

如果有人也知道我如何将 base64 转换为二进制文件并成功上传，那也适用于我.

Edit : If anyone also knows how I could convert the base64 to binary and successfully upload it, that would also work for me.

代码片段

var postDetails = separator + newlineConstant + 'Content-Disposition: form-data;name="access_token"' + newlineConstant + newlineConstant + accessToken + newlineConstant + separator;

postDetails = postDetails + newlineConstant + 'Content-Disposition: form-data; name="message"' + newlineConstant + newlineConstant + message + newlineConstant;

//Add the Image information
var fileDetailsString = '';
var index = 0;
var multipartBody = new Buffer(0);
images.forEach(function (currentImage) {
    fileDetailsString = fileDetailsString + separator + newlineConstant + 'Content-Disposition: file; name="source"; filename="Image' + index + '"' + newlineConstant + 'Content-Type: image/jpeg' + newlineConstant + newlineConstant;
    index++;

    multipartBody = Buffer.concat([multipartBody, new Buffer(fileDetailsString), currentImage]); //This is what I would use if Bianry data was passed in 

    currentImage = new Buffer (currentImage.toString('base64'), 'base64'); // The following lines are what I would use for base64 image being passed in (The appropriate lines would be enabled/disabled if I was using Binary/base64)
    multipartBody = Buffer.concat([multipartBody, new Buffer(fileDetailsString), currentImage]);
});

multipartBody = Buffer.concat([new Buffer(postDetails), multipartBody, new Buffer(footer)]);

推荐答案

上面的代码对我来说不太适用(type:"POST", 和数据 URI 后缺少逗号和 blob 函数报告错误.我得到以下代码在 Firefox 和 Chrome 中工作:

The code above didn't quite work for me (Missing comma after type:"POST", and data URI to blob function reported errors. I got the following code to work in Firefox and Chrome:

function PostImageToFacebook(authToken)
{
    var canvas = document.getElementById("c");
    var imageData  = canvas.toDataURL("image/png");
    try {
        blob = dataURItoBlob(imageData);
    }
    catch(e) {
        console.log(e);
    }
    var fd = new FormData();
    fd.append("access_token",authToken);
    fd.append("source", blob);
    fd.append("message","Photo Text");
    try {
        $.ajax({
            url:"https://graph.facebook.com/me/photos?access_token=" + authToken,
            type:"POST",
            data:fd,
            processData:false,
            contentType:false,
            cache:false,
            success:function(data){
                console.log("success " + data);
            },
            error:function(shr,status,data){
                console.log("error " + data + " Status " + shr.status);
            },
            complete:function(){
                console.log("Posted to facebook");
            }
        });
    }
    catch(e) {
        console.log(e);
    }
}

function dataURItoBlob(dataURI) {
    var byteString = atob(dataURI.split(',')[1]);
    var ab = new ArrayBuffer(byteString.length);
    var ia = new Uint8Array(ab);
    for (var i = 0; i < byteString.length; i++) {
        ia[i] = byteString.charCodeAt(i);
    }
    return new Blob([ab], { type: 'image/png' });
}

这是GitHub上的代码https://github.com/DanBrown180/html5-canvas-post-to-facebook-base64

Here's the code at GitHub https://github.com/DanBrown180/html5-canvas-post-to-facebook-base64

这篇关于上传 Base64 图片 Facebook Graph API的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！