base 64 og：image to facebook share

我使用這個library將HTML轉換爲畫布。然後我用下面的代碼獲取的圖像進行畫布：base 64 og：image to facebook share

canvas = document.getElementsByTagName('canvas')[0] context = canvas.getContext('2d') image = new Image() image.src = canvas.toDataURL("image/png")

結果我得到一個base64形象。我需要在與Facebook分享帖子時使用此圖片。我知道我需要添加元標記og:image並在那裏插入圖像。但它不想接受一個base64圖像。任何人都可以建議我如何做到這一點？

請大家幫忙，謝謝。

來源

2014-10-29 Artem Galas

我以這樣的方式解決了這個問題：

起初我將HTML轉換到畫布上，然後畫布圖像，之後這種圖像繪製在用帆布爲劃出初始圖像擺脫額外的空間。完成後，圖像被髮送到服務器進行存儲，並通過圖像元標記傳遞給FB。

$scope.facebookShared =() -> 

     $window.open "//www.facebook.com/sharer/sharer.php?u=" + encodeURI($location.absUrl()), "sharer", "toolbar=0,status=0,width=" + 500 + ",height=" + 500 /// this is window for share fb 

     height=$('.sharing').height() 
     html2canvas document.body, 
     onrendered: (canvas) -> 

      context = canvas.getContext('2d') 
      image = new Image() 
      image.src = canvas.toDataURL("image/png") 
      image.onload = -> 
      sharing=$('.sharing') 
      canvas.height = Math.round(sharing.width()/1.91) 
      canvas.width = sharing.width() 

      context=canvas.getContext('2d') 

      pos = sharing.parent(0).parent(0).position() 
      context.drawImage(this, pos.left, pos.top, sharing.width() + 20, sharing.height(),0,0,sharing.width()+20,sharing.height()) 

      $.ajax 
       url: '../../save_img' 
       type: 'post' 
       beforeSend: (xhr) -> 
       xhr.setRequestHeader "X-CSRF-Token", $("meta[name=\"csrf-token\"]").attr("content") 
       return 
       data: 
       base64_image: canvas.toDataURL("image/png").replace(/^data:image\/(png|jpg);base64,/, "") 
       claim_slug: $scope.claim.slug 

      return false 

     width: $('.claim-page ').width() 
     height: height+115 

     return

來源

2014-11-05 15:12:13

base 64 og：image to facebook share

回答

相關問題