如何在本地存储中映射重复的ID答案

【问题标题】：how to map repeated id in localstorage如何在本地存储中映射重复的ID
【发布时间】：2022-08-17 23:32:47
【问题描述】：

我有这段代码，它的想法是将产品保存在本地存储中，当产品已经在本地存储中时，它不会再次发出请求

  getItemById(id) {
    // return this.http.get(`${environment.API_URL}item/getById/${id}`);
    return this.cacheS.getOrSetCache(`StoreService_getItemById_${id}_${this.layout.emp.id}`,  this.http.get(`${environment.API_URL}item/getById/${id}`), 300000);
 }


  getOrSetCache(key: string, request: Observable<any>, msToExpire = 3600000): Observable<any> {
    let cache: any = {};
    const keyy = \'StoreService_getItemById_teste\';
    cache = JSON.parse(localStorage.getItem(keyy));

    return (cache?.data && (cache?.exp > Date.now())) ?
    of(cache.data) :
    request.pipe(
        tap(v => {
          let arr: any[] = [];
          let string = localStorage.getItem(keyy);
          if (string) arr = JSON.parse(string);
          console.log(arr)

          arr.push({data: v, exp: (Date.now() + msToExpire)});
          localStorage.setItem(keyy, JSON.stringify(arr));
       })
    );
}

我如何映射 id 以便当我已经在 localstorage 中拥有它时它不会发出对该 id 的请求？

还想知道如果当前时间等于或大于此时间戳，我如何查看过期日期，它将其从缓存中删除并再次执行查询

在图像中你可以看到它有两个重复的 id

标签： javascript angular local-storage

【解决方案1】：

解析本地存储项后，使用 javascriptfind 检查数组是否已包含 ID。

getItemById(id) {
        // return this.http.get(`${environment.API_URL}item/getById/${id}`);
        return this.cacheS.getOrSetCache(
            id,
            `StoreService_getItemById_${id}_${this.layout.emp.id}`,
            this.http.get(`${environment.API_URL}item/getById/${id}`),
            300000
        );
    }

    getOrSetCache(
        id: any,
        key: string,
        request: Observable<any>,
        msToExpire = 3600000
    ): Observable<any> {
        let cache: any = {};
        const keyy = 'StoreService_getItemById_teste';
        cache = JSON.parse(localStorage.getItem(keyy));
        return (cache?.data && cache?.exp > Date.now()) ||
            (cache?.data && cache?.data.find(item => item.data.id === id))
            ? of(cache.data)
            : request.pipe(
                    tap(v => {
                        let arr: any[] = [];
                        let string = localStorage.getItem(keyy);
                        if (string) arr = JSON.parse(string);
                        console.log(arr);

                        arr.push({ data: v, exp: Date.now() + msToExpire });
                        localStorage.setItem(keyy, JSON.stringify(arr));
                    })
              );
    }

【讨论】：

这段代码似乎不太合适，它似乎只需要第一个 id，但我连续 5 次执行 getItemById 请求，在浏览器中它返回 ERROR TypeError: Cannot read properties of undefined (reading 'find ')
我在 getItemById 请求中放了一个 console.log(id) ，它只返回一个 id
在返回 5 个 id 的代码中