如何通過Chrome擴展程序保存網頁的完整狀態？

例如，考慮用戶通過各種網頁瀏覽的，他們中的一些可能的編碼是這樣的：

onload=function(){ 
 
    let d_s = document.getElementById('d').style; 
 
    d_s.width = d_s.height = Math.random() * 500 + 'px'; 
 
    setTimeout(onload, 800 + Math.random() * 800); 
 
};

<div id=d style=background:skyblue;></div> 
 
<!-- click Run ↓ -->

我想保存的選擇的當前狀態選項卡（整個選項卡會話），並在以後的時間恢復它們。

有什麼技術可以做到這一點？

（這應該是可能的。畢竟，我們可以從一個瀏覽器窗口中拖動標籤到下一個，甚至沒有播放視頻時，中途的任何狀態變化。）

來源

2016-12-15 Pacerier

你是什麼意思，當你說「當前狀態」？幾個變量或整個頁面的值？ –

@HaibaraAi，整個頁面。把它看作像Windows休眠一樣：一個完整的保存和恢復沒有變化或儘可能少的變化。 – Pacerier

總之，沒有。

這是非常雄心勃勃的，因爲您不僅需要存儲最初的DOM狀態（可以在任何時候通過頁面腳本加載來更改），但您必須存儲本地存儲，Cookie，會話的狀態，像圖片，腳本，樣式表等資產，這個名單還在繼續。

如果您能夠對內存進行低級別快照，將其存儲在某個地方，稍後再將其恢復到內存中，您可能會有機會，因爲這就是冬眠的原因。但是，在Chrome或任何瀏覽器中不存在此類API。

甚至在出現任何技術挑戰之前，在安裝擴展以訪問所有各種API時，這將導致您不得不要求批次的權限。其次，假設你想出了將頁面的所有這些方面序列化的方法，你將在哪裏存儲休眠狀態？你最好的選擇是本地存儲在背景頁面上，但這通常會有大小限制。

第三，您需要實際瀏覽到頁面，以便URL正確設置。如果沒有這一步，網頁看起來只會從休眠狀態恢復，但如果用戶嘗試做任何事情，他們會遇到跨站點腳本（XSS）警告，刷新頁面將返回到一個空白標籤頁。

最後，您肯定會遇到由無法預測的特定於站點的細微差別帶來的無限數量的邊緣情況。

來源

2016-12-15 08:05:05 Soviut

關於存儲空間，我將它保存到本地硬盤（有權限）。關於Dom狀態，是否有任何方法可以保存最初的DOM狀態？重要的是要提到我不打算讓它在100％的情況下工作。 90％是夠好的。 – Pacerier

你可以詢問''元素是否爲'innerHtml'，並將其存儲爲一個巨大的字符串。 – Soviut

什麼是一些技術來存儲「JavaScript狀態」（變量）？ – Pacerier

您可以使用selenium來自動執行所需步驟以達到所需狀態。

通常有人在測試某些功能時正在尋找類似的東西。

我在開發一些需要大量字段填充以測試一些相關功能的應用程序時通常會使用它。而且，每次我想測試一些東西時，完成表單真的很乏味。

有了硒，您甚至可以自動完成整個測試。

UPDATE：

如果你需要執行一些js代碼，硒，即可。

這安裝了selenium包蟒蛇例如：

>>> from selenium import webdriver 
>>> wd = webdriver.Firefox()     # You could use Chrome too. 
>>> wd.get("http://localhost/foo/bar") 
>>> wd.execute_script("return foobar()") 
u'eli'

Example taken from this answer

因此，與硒你可以在這樣一個函數進行調用，並使用一些固定值，用於仿真保存狀態：

onload=function(){ 
    /* You could use some fixed value for emulate a saved state */ 
    let d_s = document.getElementById('d').style; 
    d_s.width = d_s.height = some_fixed_value * 500 + 'px'; 
    setTimeout(onload, 800 + some_fixed_value * 800); 
};

來源

2017-04-10 20:04:42

但它內部是否有javascript變量？ – Pacerier

我已經更新了答案，並試圖回答你的問題。 –

如何通過Chrome擴展程序保存網頁的完整狀態？

回答

相關問題