NextChat
NextChat copied to clipboard
[Feature] localStorage满后界面崩溃
问题起源 #2425 localStorage满后会导致界面创建时需要储存数据将崩溃。 可以提供一个简单进行数据删除来提供空间恢复正常界面。 还有一种方法是预先填充10kb,页面加载前检查空间满后删除预留空间并弹窗警告
简易界面演示图片
gpt生成的油猴脚本 测试填满.txt 启用脚本刷新页面后控制台清空localStorage后刷新页面,可测试崩溃,如不行可再进行对话一下 简易管理界面.txt
Bot detected the issue body's language is not English, translate it automatically.
Title: [Feature] After localStorage is full
Issue origin #2425
When localStorage is full, it will cause the interface to store data (new option) and it will crash
Finished sample
gpt generates oil monkey scripts for testing Test Fill.txt Simple management interface.txt
我会在下个版本替换为 IndexedDB。
Bot detected the issue body's language is not English, translate it automatically.
I will replace it with IndexedDB in the next version.
https://github.com/pmndrs/zustand/blob/main/docs/integrations/persisting-store-data.md#how-can-i-use-a-custom-storage-engine
哦那挺好,我还以为你对用 localStorage有什么执着(这玩意空间真的小)
Bot detected the issue body's language is not English, translate it automatically.
Oh that's good, I thought you were obsessed with using localStorage (the space is really small)
@reece00 因为 zustand persist 默认就是 localStorage,一开始完全不会想到会有人能用纯文本干爆 5MB
5MB确实太小随便就干爆了。得上idb或者opfs。
Bot detected the issue body's language is not English, translate it automatically.
5MB is indeed too small to explode casually. Get on idb or opfs.
哈哈,毕竟是聊天工具,干爆上百MB都是可能的(作者辛苦了 ~ )
Bot detected the issue body's language is not English, translate it automatically.
Haha, after all, it is a chat tool, and it is possible to explode hundreds of MB (Thanks to the author~)
我会在下个版本替换为 IndexedDB。
麻烦问下,替换成IndexedDB的版本是哪个版本呢?我查看最新版本主分支好像没有看到哪里引用了IndexedDB
Bot detected the issue body's language is not English, translate it automatically.
I will replace it with IndexedDB in the next version.
Please ask, which version should be replaced with IndexedDB? I looked at the latest version of the main branch and didn't seem to see where IndexedDB was referenced.
Please ask, which version should be replaced with IndexedDB?
Same question 🤔
I've ran into the hard limit of the current storage multiple times already, and it seems I'm running out of chats to delete (I need almost all of them, because I often go back and use the info from them)
请问一下IndexedDB要替换哪个版本?
同样的问题🤔
我已经多次遇到当前存储的硬限制,而且似乎我没有聊天记录可以删除了(我几乎需要删除所有聊天记录,因为我经常回去使用其中的信息)
`import { openDB, deleteDB } from "idb";
import { StateStorage } from "zustand/middleware";
const DB_NAME = "zj-ai-store"; const STORE_NAME = "data-store"; const BACKUP_NAME = "backup-store"; let dbPromise: any; if (typeof window !== "undefined" && typeof indexedDB !== "undefined") { dbPromise = openDB(DB_NAME, 1, { upgrade(db) { if (!db.objectStoreNames.contains(STORE_NAME)) { db.createObjectStore(STORE_NAME); } }, }); }
export const setItem = async (
key: IDBKeyRange | IDBValidKey | undefined,
value: any,
) => {
if (!dbPromise) return;
const db = await dbPromise;
// console.log(Setting item in IndexedDB: key=${key}, value=${JSON.stringify(value)}
);
return db.put(STORE_NAME, value, key);
};
export const getItem = async (key: IDBKeyRange | IDBValidKey) => {
if (!dbPromise) return;
const db = await dbPromise;
const value = await db.get(STORE_NAME, key);
// console.log(Getting item from IndexedDB: key=${key}, value=${JSON.stringify(value)}
);
return value;
};
export const removeItem = async (key: IDBKeyRange | IDBValidKey) => {
if (!dbPromise) return;
const db = await dbPromise;
// console.log(Removing item from IndexedDB: key=${key}
);
return db.delete(STORE_NAME, key);
};
export const getIndexedDbStorage: StateStorage = {
getItem: async (name: string) => {
const item = await getItem(name);
return item ? JSON.stringify(item) : null; // serialize as string for Zustand
},
setItem: async (name: string, value: any) => {
// console.log(Setting item in Zustand storage: name=${name}, value=${value}
);
await setItem(name, JSON.parse(value)); // parse stored string value
},
removeItem: async (name: any) => {
await removeItem(name);
},
};
// Clear entire IndexedDB database
export const clearDatabase = async () => {
if (dbPromise) {
await dbPromise;
await deleteDB(DB_NAME);
// console.log(${DB_NAME} has been deleted successfully
);
dbPromise = openDB(DB_NAME, 1, {
upgrade(db) {
db.createObjectStore(STORE_NAME);
},
});
}
};
`
I hope I can help you
现在有了多模态LLM,随便一个对话就能干爆5MB的localstorage,目前的方案可以说是完全不可行了。
Bot detected the issue body's language is not English, translate it automatically.
Now with multi-modal LLM, a single conversation can destroy 5MB of local storage. The current solution can be said to be completely unfeasible.
v2.13.1 版本支持图片使用cache storage存储到本地缓存(这个存储体积与磁盘大小相关),localStorage中只保留图片链接。 应该可以解决使用多模态模型存储限制的问题。
Bot detected the issue body's language is not English, translate it automatically.
v2.13.1 version supports storing images in local cache using cache storage (this storage volume is related to the disk size), Only image links are kept in localStorage. This should solve the storage limitations of using multimodal models.