localStorage即服务

时间:2017-07-07 14:59:51

标签: angular local-storage

使用angular 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'}}]

然后,每次读取本地存储空间时,我都必须读取整个内容,然后解析它以查找我正在寻找的部分 - 并将其全部重新写回来。

(这意味着,如果任何模块弄乱了它的数据,它可能会使本地存储的所有其他用途暂停 - 包括丢失存储数据)。

BTW,我正在使用angular 2本地本地存储。现在我遇到了这些挑战,我开始怀疑是否有人已经编写了一个可以进行复杂的本地存储管理的插件。

1 个答案:

答案 0 :(得分:0)

这里不是一个明确的问题,但我会试着猜出你想要的答案是什么:)

是的,通过使用不同的"模块来减少从localStorage读取所需的数据量要好得多。在LS中使用不同的条目。主要有三个原因:

  1. 读取本地存储是一个同步操作,所以它会阻止你的代码执行,直到没有完成

  2. 读取/写入本地存储是您可以在javascript中执行的较慢操作之一。

  3. 从localstorage中保存/检索数据需要您对这些数据进行字符串化/解析,这是您在javascript中可以执行的另一个较慢的操作。

  4. 我会告诉您阅读this然后this article了解最新的localStorage演出。

    另请注意,没有" localStorage文件"浏览器中只有一个对象,因此您可以根据需要创建任意数量的条目而不会丢失性能,实际上完全相反。

    正如您所说的那样,如果您将所有内容存储在一个条目中,则单个格式错误的数据可能会使所有其他对象无法缓存。