2016-08-19 136 views
-2

我有一個包含圖像的iframe。圖像源鏈接到S3存儲桶中的圖像。我需要在Base64中編碼此圖像,並將iframe的主體保存在數據庫中。將圖像編碼爲Amazon S3的Base64

我該怎麼做?

+1

的可能的複製[獲取在JavaScript中的圖像數據?](http://stackoverflow.com/questions/ 934012/get-image-data-in-javascript) –

+0

除了要求別人爲你做你的工作之外,你還試過了什麼?爲什麼它不起作用? –

回答

0

試試這個How to access the <img /> in document from iframe?

$('#Iframe1').contents().find('img').css({'width':'100%','height':'90%'}); 

,然後使用此功能從這裏Get image data in JavaScript?

function getBase64Image(img) { 
    // Create an empty canvas element 
    var canvas = document.createElement("canvas"); 
    canvas.width = img.width; 
    canvas.height = img.height; 

    // Copy the image contents to the canvas 
    var ctx = canvas.getContext("2d"); 
    ctx.drawImage(img, 0, 0); 

    // Get the data-URL formatted image 
    // Firefox supports PNG and JPEG. You could check img.src to 
    // guess the original format, but be aware the using "image/jpg" 
    // will re-encode the image. 
    var dataURL = canvas.toDataURL("image/png"); 

    return dataURL.replace(/^data:image\/(png|jpg);base64,/, ""); 
} 
+0

非常感謝您的回答,但是當我嘗試這樣做時:var image = $('#Iframe1')。contents()。find('img'); (「Base64」+ current.getBase64Image(image));我有錯誤「提供的值不是一種HTMLImageElement」 –

+0

註銷圖像的值,告訴我它是什麼 –