份額的base64圖像，但未能加載資源

我發現與FB圖形API共享的base64圖像相關的一些信息：Upload Base64 Image Facebook Graph API 份額的base64圖像，但未能加載資源

但是，我不能讓它成功。

這裏是我的全部代碼：

<html> 

<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
</head> 

<body> 

<canvas id="myCanvas" width="578" height="400"></canvas> 

<script> 

var canvas = document.getElementById('myCanvas'); 
    var context = canvas.getContext('2d'); 
    var imageObj = new Image(); 

    imageObj.onload = function(){ 
    context.drawImage(imageObj,69,50); 
    }; 

imageObj.src = 'data:image/png;base64,XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX' 

function share_image(){ 
    var pic = document.getElementById('myCanvas'); 
    var data = pic.toDataURL("image/png"); 
    /*var data = $('#map >> canvas').toDataURL('image/png');*/ 
      var blob; 
      try { 
      var byteString = atob(data.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); 
      } 
      blob = new Blob([ab], {type: 'image/png'}); 
      } catch (e) { 
      console.log(e); 
      } 
      var fd = new FormData(); 
      fd.append("source", blob); 
      fd.append("message", "Photo Text"); 
      FB.login(function(){ 
      var auth = FB.getAuthResponse(); 
      $.ajax({ 
       url:"https://graph.facebook.com/"+auth.userID+"/photos?access_token=" + auth.accessToken, 
       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("Ajax Complete"); 
       } 
      }); 
      }, {scope: 'publish_actions'}); 
     } 
      </script> 

      <script> 
    window.fbAsyncInit = function() { 
    FB.init({ 
     appId  : 'XXXXXXXXXXXXXXXXXXX', 
     xfbml  : true, 
     version : 'v2.5' 
    }); 
    }; 

    (function(d, s, id){ 
    var js, fjs = d.getElementsByTagName(s)[0]; 
    if (d.getElementById(id)) {return;} 
    js = d.createElement(s); js.id = id; 
    js.src = "//connect.facebook.net/en_US/sdk.js"; 
    fjs.parentNode.insertBefore(js, fjs); 
    }(document, 'script', 'facebook-jssdk')); 
</script> 


    <button type='button' onclick='share_image()'>share on FB</button> 


</body> 

</html>

我用調試器和錯誤消息顯示... 「無法加載資源：服務器與403狀態響應（OK）

錯誤OK狀態403

阿賈克斯完成「

和錯誤輸出

{ 
    "data": [ 

    ] 
}

更奇怪的是，它似乎是我得到的用戶標識不同於我登錄的用戶標識。我不知道爲什麼......

來源

2016-01-20 Chan Tai Ming

您必須附上形象的multipart/form-data的(see rfc) 這是由GraphAPI documentation

HTML

<a href="#" id="upload-trigger" onClick="javascript:fileUpload();">File Upload!</a> 
<form id="upload-photo-form" target="upload_iframe" method="post" enctype="multipart/form-data"> 
<input id="upload-photo-form-file" name="file" size="27" type="file" /> 
</form>

規定

function fileUpload() { 
FB.api('/me/albums', function(response) { 
var album = response.data[0]; // Now, upload the image to first found album for easiness. 
var action_url = 'https://graph.facebook.com/' + album.id + '/photos?access_token=' + accessToken; 
var form = document.getElementById('upload-photo-form'); 
form.setAttribute('action', action_url); 

form.submit(); 
}); 
}

found here

來源

2016-01-20 09:46:11

你我我需要把這些東西放到我的代碼中？我應該把他們放在哪裏？「Content-Disposition：file; filename =」file1.png「Content-Type：image/png Content-Transfer-Encoding：binary」.. –

@ChanTaiMing爲您添加了示例代碼。 –

@ChanTaiMing這是否解決了您的問題？ –

份額的base64圖像，但未能加載資源

回答

相關問題