上传Base64图片Facebook Graph API 我想使用这个链接链接的脚本如何在我的wordpress帖子中使用它?我想用这个fbcover照片网站.
看看我从各种示例中一起攻击的代码 - 您可以使用此代码将纯base64字符串发布到Facebook API - 无需服务器端处理.
这是一个演示:http://rocky-plains-2911.herokuapp.com/
这个javascript处理HTML5 Canvas元素到base64的转换,并使用Facebook API发布图像字符串
<script type = "text/javascript"> // Post a BASE64 Encoded PNG Image to facebook 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); $("#poster").html("Posted Canvas Successfully"); }, error: function (shr, status, data) { console.log("error " + data + " Status " + shr.status); }, complete: function () { console.log("Posted to facebook"); } }); } catch (e) { console.log(e); } } // Convert a data URI to blob 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' }); } </script>
这将处理Facebook身份验证并显示基本的HTML设置
<script type="text/javascript"> $(document).ready(function () { $.ajaxSetup({ cache: true }); $.getScript('//connect.facebook.net/en_UK/all.js', function () { // Load the APP / SDK FB.init({ appId: '288585397909199', // App ID from the App Dashboard cookie: true, // set sessions cookies to allow your server to access the session? xfbml: true, // parse XFBML tags on this page? frictionlessRequests: true, oauth: true }); FB.login(function (response) { if (response.authResponse) { window.authToken = response.authResponse.accessToken; } else { } }, { scope: 'publish_actions,publish_stream' }); }); // Populate the canvas var c = document.getElementById("c"); var ctx = c.getContext("2d"); ctx.font = "20px Georgia"; ctx.fillText("This will be posted to Facebook as an image", 10, 50); }); </script> <div id="fb-root"></div> <canvas id="c" ></canvas> <a id="poster" href="#" onclick="PostImageToFacebook(window.authToken)">Post Canvas Image To Facebook</a>