使用ajax請求在新頁面打開html文本

目前項目使用的大前端的開發方式,使用token作爲前後臺交互的憑證,但是遇到這樣一個問題收集平板終端需要顯示一個webview,這個webview還可以繼續訪問其他頁面。這種不想jsp有session,cookie這種回話機制維護,也不向前端項目有路由交互,所以需要將html文本在新頁面中顯示出來。其實js打開一個新頁面很簡單,window.open(url),但是這個web1.0的方式傳遞不了header等複雜信息,如果要傳遞的話就要使用ajax。

ajax將文本獲取回來後怎麼顯示呢,

(1)將本頁面中的body元素的innerHTML替換掉,這樣簡單的html文本可以,這種只能在本頁面渲染,不能回退。並且如果遇到複雜的帶css,js文件,外部樣式的完整的htm就不行了,恰巧我遇到的就是要顯示這種

(2)這種方式是我從看別人也有這種問題,其他答主的回答

$.ajax({
url: '…………',
success: function(resp){
var newWin = window.open('', '_blank');
newWin.document.write(resp);
}
});

方式很巧妙,可以回退,但是同樣只能處理簡單的html文本,遇到複雜js,css照樣不渲染,歇菜

最後本猿還是想到了一個方式,將文本保存到流中,然後放到a標籤中,調用js點擊,顯示。不說了,上代碼

$.ajax({
url: '…………',
success: function (res) {
                    var content = res;
                    var data = new Blob([content],{type:"text/html;charset=UTF-8"});
                    var downloadUrl = window.URL.createObjectURL(data);
                    var anchor = document.createElement("a");
                    anchor.href = downloadUrl;
                    anchor.click();
                }   
});

ok,搞定。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章