當前位置:首頁 » 服務存儲 » 瀏覽器本地存儲的類型和原理
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

瀏覽器本地存儲的類型和原理

發布時間: 2022-06-30 15:11:16

❶ 關於html5 的 LocalStorage 本地存儲

以下是五大瀏覽器localStorage存儲方式:

除了Opera瀏覽器採用BASE64加密外(BASE64也是可以輕松解密的),其他瀏覽器均採用明文存儲數據。

所以,建議不要使用localStorage方式存儲敏感信息,那怕這些信息進行過加密。


以上參考《HTML5本地存儲localstorage安全分析》

http://blog.csdn.net/yangdeli888/article/details/7735260

❷ 離線本地存儲和傳統的瀏覽器緩存有什麼不同

本地存儲(LocalStorage)是以資料庫形式永久保存在瀏覽器的存儲空間里,而瀏覽器緩存(Cache)是保存在指定的緩存目錄,緩存過大可能影響瀏覽器檢索速度,需要時常清理。

❸ UC瀏覽器設置里的本地緩存是什麼功能

本地緩存是用來加速瀏覽的,因為從本地硬碟讀取數據要比從網路下載要快很多

本地緩存是指將客戶機本地的物理內存劃分出一部分空間用來緩沖客戶機回寫到伺服器的數據,因其在回寫上的突出貢獻,因此本地緩存一般稱為本地回寫。本地緩存概念首次出現是在無盤領域,作為PXD無盤的一項核心技術被廣泛應用。

❹ 瀏覽器的原理

網頁瀏覽器是個顯示網頁伺服器或檔案系統內的文件,並讓用戶與此些文件互動的一種軟體。它用來顯示在萬維網或局部區域網絡等內的文字、影像及其他資訊。這些文字或影像,可以是連接其他網址的超鏈接,用戶可迅速及輕易地瀏覽各種資訊。網頁一般是HTML的格式。有些網頁是需使用特定的瀏覽器才能正確顯示。手機瀏覽器是運行在手機上的瀏覽器,可以通過GPRS進行上網瀏覽互聯網內容。
瀏覽器是指可以顯示網頁伺服器或者文件系統的HTML文件內容,並讓用戶與這些文件交互的一種軟體。網頁瀏覽器主要通過HTTP協議與網頁伺服器交互並獲取網頁,這些網頁由URL指定,文件格式通常為HTML,並由MIME在HTTP協議中指明。一個網頁中可以包括多個文檔,每個文檔都是分別從伺服器獲取的。大部分的瀏覽器本身支持除了HTML之外的廣泛的格式,例如JPEG、PNG、GIF等圖像格式,並且能夠擴展支持眾多的插件(plug-ins)。另外,許多瀏覽器還支持其他的URL類型及其相應的協議,如FTP、Gopher、HTTPS(HTTP協議的加密版本)。HTTP內容類型和URL協議規范允許網頁設計者在網頁中嵌入圖像、動畫、視頻、聲音、流媒體等。

❺ HTML5本地存儲機制是怎樣的

HTML5 是下一代 HTML 標准,開始吸引越來越多人的目光。HTML5 的 DOM Storage 機制提供了一種方式讓程序員能夠把信息存儲到本地的計算機上,在需要時獲取。這點和 cookie 相似,區別是 DOM Storage 提供了更大容量的存儲空間。
目前,在客戶端保存數據使用最多的是 cookie,但 cookie 的大小上限為 4KB,並且每次請求一個新頁面時 cookie 都會被發送過去。更多的存儲空間需要瀏覽器本身或是插件的支持,例如只在 Internet Explorer 上使用的 userData,需要額外安裝插件的 Google Gears 和 Flash。現在,HTML5 提供了一種標準的介面,使程序員可以簡單地訪問存儲的數據。由於鍵值對存儲在本地計算機上,在頁面載入完畢後可以通過 JavaScript 來操作這些數據。
HTML5 的建議是每個網站提供給 Storage 的空間是 5MB,一般來說足夠存字元串。如果存入的數據太大,有些瀏覽器如 Chrome 會拋出 QUOTA_EXCEEDED_ERR 異常。所以雖然 DOM Storage 提供的空間比 cookie 要大很多,但在使用需要注意限制。
安全性
一般不要在客戶端存儲敏感的信息,使用 localStorage、globalStorage 等在客戶端存儲的信息都非常容易暴露。應該在完成數據存儲後使用 clear 或者 removeItem 方法清除保存在 Storage 對象中的數據。
存儲事件驅動
如果想在存儲成功或修改存儲的值時執行一些操作,可以用 DOM Storage 介面提供的事件。

❻ localstorage是什麼,它有哪些作用

局部存儲器。它是html5新增的一個本地存儲API,所謂localStorage就是一個小倉庫的意思,它有5M的大小空間,存儲在瀏覽器中,我們可以通過js來操縱localStorage。

❼ html5 本地存儲有多少種方案

html5 本地存儲有五種方案。
1、LocalStorage
LocalStorage就是Key-Value的簡單鍵值對存儲結構,Web Storage除了localStorage的持久性存儲外,還有針對本次回話的sessionStorage方式,一般情況下localStorage較為常用,示例代碼如下:
function save(dataModel){
var value = dataModel.serialize();
window.localStorage['DataModel'] = value;
window.localStorage['DataCount'] = dataModel.size();
console.log(dataModel.size() + ' datas are saved');
return value;
}
function restore(dataModel){
var value = window.localStorage['DataModel'];
if(value){
dataModel.deserialize(value);
console.log(window.localStorage['DataCount'] + ' datas are restored');
return value;
}
return '';
}
function clear(){
if(window.localStorage['DataModel']){
console.log(window.localStorage['DataCount'] + ' datas are cleared');
delete window.localStorage['DataModel'];
delete window.localStorage['DataCount'];
}
}
2、Cookie
這種存儲方式存儲內容很有限,只適合做簡單信息存儲,存取介面設計得極其反人類,舉例如下:
function getCookieValue(name) {
if (document.cookie.length > 0) {
var start = document.cookie.indexOf(name + "=");
if (start !== -1) {
start = start + name.length + 1;
var end = document.cookie.indexOf(";", start);
if (end === -1){
end = document.cookie.length;
}
return unescape(document.cookie.substring(start, end));
}
}
return '';
}
function save(dataModel) {
var value = dataModel.serialize();
document.cookie = 'DataModel=' + escape(value);
document.cookie = 'DataCount=' + dataModel.size();
console.log(dataModel.size() + ' datas are saved');
return value;
}
3、Indexed Database API
IndexedDB可以存儲結構對象,可構建key和index的索引方式查找,目前各瀏覽器的已經逐漸支持IndexedDB的存儲方式,其使用代碼如下,需注意IndexedDB的很多操作介面類似NodeJS的非同步回調方式,特別是查詢時連cursor的continue都是非同步再次回調onsuccess函數的操作方式,因此和NodeJS一樣使用上不如同步的代碼容易。
function save(dataModel){
var tx = db.transaction("meters", "readwrite");
var store = tx.objectStore("meters");
dataModel.each(function(data){
store.put({
id: data.getId(),
tag: data.getTag(),
name: data.getName(),
meterValue: data.a('meter.value'),
meterAngle: data.a('meter.angle'),
p3: data.p3(),
r3: data.r3(),
s3: data.s3()
});
});
tx.oncomplete = function() {
console.log(dataModel.size() + ' datas are saved');
};
return dataModel.serialize();
}
4、FileSystem API
FileSystem API相當於操作本地文件的存儲方式,目前支持瀏覽器不多,其介面標准也在發展制定變化中,因此也可以動態生成圖片到本地文件,然後通過 filesystem:http:*** 的URL方式直接賦值給img的html元素的src訪問。
function save(dataModel) {
var value = dataModel.serialize();
fs.root.getFile('meters.txt', {create: true}, function (fileEntry) {
console.log(fileEntry.toURL());
fileEntry.createWriter(function (fileWriter) {
fileWriter.onwriteend = function () {
console.log(dataModel.size() + ' datas are saved');
};
var blob = new Blob([value], {type: 'text/plain'});
fileWriter.write(blob);
});
});
return value;
}
5、Application Cache
window.applicationCache 對象是對瀏覽器的應用緩存的編程訪問方式。其 status 屬性可用於查看緩存的當前狀態:
var appCache = window.applicationCache;
switch (appCache.status) {
case appCache.UNCACHED: // UNCACHED == 0
return 'UNCACHED';
break;
case appCache.IDLE: // IDLE == 1
return 'IDLE';
break;
case appCache.CHECKING: // CHECKING == 2
return 'CHECKING';
break;
case appCache.DOWNLOADING: // DOWNLOADING == 3
return 'DOWNLOADING';
break;
case appCache.UPDATEREADY: // UPDATEREADY == 4
return 'UPDATEREADY';
break;
case appCache.OBSOLETE: // OBSOLETE == 5
return 'OBSOLETE';
break;
default:
return 'UKNOWN CACHE STATUS';
break;
};

❽ 瀏覽器緩存的作用是什麼

為了提高訪問網頁的速度,Internet Explorer瀏覽器會採用累積式加速的方法,將你曾經訪問的網頁內容(包括圖片以及cookie文件等)存放在電腦里。這個存放空間,我們就稱它為IE緩存。以後我們每次訪問網站時,IE會首先搜索這個目錄,如果其中已經有訪問過的內容,那IE就不必從網上下載,而直接從緩存中調出來,從而提高了訪問網站的速度。 設置IE緩存大小: 要提高IE的訪問速度,IE緩存是必不可少的。IE緩存默認安裝在系統區,而且會需要佔用較大的系統空間。所以如果你的系統空間的確很緊張,可以將緩存佔用的空間設得小一點,在IE的「工具」菜單下選擇「Internet選項」,然後在「常規」選項卡中你會看到有「Internet臨時文件」這一項,單擊「設置」按鈕,然後在彈出的「設置」對話框中將緩存大小設置為一個合適的值。你也可以直接將IE緩存移動到其它位置上去。 「Internet臨時文件」下單擊「設置」,然後在「設置」對話框中單擊「移動文件夾」按鈕,在「瀏覽文件夾」中選擇文件夾,將IE緩存移動到其他地方,這樣就不必擔心IE緩存太大,佔用更多空間了。

❾ 瀏覽器存儲數據的方式

瀏覽器數據一般都是保存到本地的,還有一些臨時的文件會短暫保存。

❿ 瀏覽器本地存儲都有哪些方式,優缺點是什麼

pc瀏覽器有谷歌瀏覽器,其優點是安全性較強;不易崩潰;啟動速度快。其缺點是當多標簽模式下僅剩下一個標簽頁時,如果關閉它,那麼整個瀏覽器也隨之關閉,這一點我個人認為很不好。