localStorage的作爲服務

Question

使用角2.我在執行一個本地存儲服務（與加密）。目前，這只是我使用它的一個模塊，但我想確保它是可重用的。

這是我的頁面的.ts：

我提供了一個存儲前綴。我假設它應該有哪個應用它與相關的指示，所以它的預前綴myApp-，其次是一個前綴，這將是獨此模塊（Frequentclients）。

export class SwitchClientComponent implements OnInit { 

    storagePrefix = 'myApp-Frequentclients'; 

    getFrequentClients() { 
     return this.encryptionService.getLocalStorage(this.storagePrefix); 
    }; 
} 

我的加密存儲服務：

import * as CryptoJS from "crypto-js"; 

@Injectable() 
export class EncryptionService { 

    constructor() { 
    } 

    secretKey: string = "fnord"; 

    setLocalStorage(storagePrefix: string, jsonObj) { 
     localStorage.setItem(storagePrefix, this.encrypt(jsonObj)); 
    } 

getLocalStorage(storagePrefix: string) { 
    var recentClients = [], 
     data: string = localStorage.getItem(storagePrefix); 

    if (data !== null && data.length > 0) { 
     data = this.decrypt(data); 
     if (data !== null && data.length > 0) { 
      recentClients = JSON.parse(data) || []; 
     } 
    } 
    return recentClients; 
} 

encrypt(jsonObj) { 
    return CryptoJS.AES.encrypt(JSON.stringify(jsonObj), this.secretKey); 
} 

decrypt(data) { 
    if (data !== null && data.length > 0) { 
     var bytes = CryptoJS.AES.decrypt(data.toString(), this.secretKey); 
     return bytes.toString(CryptoJS.enc.Utf8); 
    } else { 
     return ""; 
    } 
} 

如果每次使用本地存儲模塊只是用相同的前綴，他們就要揍對方，對吧？

所以每次使用都會有它自己的，因此：

myApp-DavesModuleData : [{data:'foo'}] 
myApp-OtherModuleData : [{data:'bar'}] 

或者，我應該避開了數不勝數的本地存儲文件亂扔用戶的存儲，並且只使用一個？

myApp : [{DavesModule:{data:'foo'}},{OtherModule:{data:'bar'}}] 

然後我不得不每次讀取本地存儲讀取整個事情，然後分析它找到我要找的部分 - 並再次寫了這一切。

（也就是說，如果任何模塊弄亂其數據，它潛在地帶來了每一個其他使用本地存儲的一個急剎車 - 包括失存儲數據）。

順便說一句，我使用的角2原生的本地存儲。現在我遇到了這些挑戰，我開始懷疑是否有人已經編寫了一個插件來完成複雜的本地存儲管理。

Answer 1

這裏有沒有一個明確的問題，但我會盡力去猜測，答案是什麼，你想:)

是的，它是更好的減少數據，您將需要從localStorage的閱讀量通過使用不同的「模塊」在LS中使用不同的條目。主要有三個原因：

1. 讀本地存儲是同步操作，因此會阻止你的代碼執行，直到沒有完成

2. 讀取/寫入本地存儲是比較慢的操作，你可以在一個在JavaScript中做。

3. 保存/檢索從localStorage的數據，您需要字符串化/解析這些數據是較慢的操作，你可以在JavaScript做的另一個。

我會告訴你讀this，然後this article有關最新localStorage的表演。

還要注意有沒有「localStorage的文件」，只有一個在瀏覽器中的對象，所以你可以根據你想不損失性能創造儘可能多的條目，都相反其實。

如您所說，如果將所有內容都存儲到一個條目中，則單個錯誤的格式化數據可能會使所有其他對象無法緩存。