如何將HTML文件編碼爲base64？

我是HTML和JavaScript的初學者。並嘗試將HTML文件編碼爲Base64代碼，然後將該編碼的字符串從另一個HTML文件放入<iframe src=" ENCODED STRING HERE"。如何將HTML文件編碼爲base64？

我想在這裏做的就是把編碼字符串轉換成彈出iframe像下面捕獲使其可見，

var i_frame_98c3be4abbe943db99555415352b65f5 = $('<iframe src="ENCODED STRING FROM HTML FILE" width="500" style="border:none !important;" height="300"></iframe>')[0];

不過，我不知道怎麼樣。

我知道有編碼/解碼網站base64encode.org但我必須親手做。我想讓它直接編碼，並在打開文件時將代碼放在iframe src中。

有什麼想法或功能的HTML直接編碼？

p.s.如果你想看，我可以編輯上傳HTML代碼。

來源

2017-08-25 paulc1111

所以你實際上需要一個數據uri –

好的瀏覽器有'btoa'方法 - 你需要在瀏覽器中做這種編碼嗎？ 'var datauri ='data：text/html; base64，'+ btoa（htmlsrc）;' –

-1

https://www.w3schools.com/jsref/jsref_encodeURI.asp對編碼URI有很好的參考。

我也會在這裏結帳解決方案設置的iframe src值：dynamically set iframe src

演示的jsfiddle：https://jsfiddle.net/np7hp5jo/1/

function appendHtml(el, str) { 
    var div = document.createElement('div'); 
    div.innerHTML = str; 
    while (div.children.length > 0) { 
    el.appendChild(div.children[0]); 
    } 
} 

var encodedUrl = encodeURI('https://www.lifehacker.com.au/?r=US'); 

var html = '<iframe id="myIframe" src="'+encodedUrl+'" onLoad="iframeDidLoad();"></iframe>'; 
appendHtml(document.body, html); // "body" has two more children - h1 and span.

快樂學習。

來源

2017-08-25 05:33:28 Umang

使用readAsDataURL方法讀取指定Blob或文件內容的最佳方式。當讀取操作完成時，readyState變爲DONE，並且加載被觸發。那時，結果屬性將數據作爲表示文件數據的URL作爲base64編碼的字符串。基於：https：//developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsDataURL –

@SureshSapkota嗨，我怎樣才能從JavaScript讀取本地HTML文件呢？而不是使用'input'加載？ – paulc1111

@Umang感謝您的答案，我會嘗試！ :) – paulc1111

如何將HTML文件編碼爲base64？

回答

相關問題