{"topic":{"id":13750,"title":"最近在学习 JS 和 Sveltekit，练手写了一个小 TODO app，遇到一些设计上的问题想请教門友","slug":"topic","categoryId":4,"createdAt":"2024-10-25 08:20:19.072844","bumpedAt":"2024-11-13 09:25:11.495836","views":198,"postsCount":5,"highestPostNumber":5,"likeCount":11,"closed":false,"pinned":false,"pinnedGlobally":false,"pinnedAt":null,"pinnedUntil":null,"isBanner":false,"excerpt":"https://github.com/fokx/svelte-todo 目前实现的功能：未登录的时候，将 todo 保存在浏览器的本地存储 IndexedDB 中，登录后，将 todo 保存在服务器端的 SQLite 数据库中。登录用的是 SSO 单点登录。目前遇到一些问题：登录后未把浏览器里的本地 todo 上传并合并到服务器 sqlite 里。不同设备/浏览器上都登录，但是一个上面的修改无法自动反映在另一个浏览器上，需要在其…","deletedAt":null,"isAnonymous":false,"category":{"id":4,"name":"谈笑风生","slug":"general","color":"25AAE2"},"author":{"id":4668,"username":"IO","name":null,"avatarUrl":"/uploads/image/86/f2/86f267c0aaa73835a999b7cc3a7e7a701605574eda9a2c2a56f5ddbbba64d1a9.avif"},"tags":["js"]},"posts":[{"id":42040,"postNumber":1,"raw":"https://github.com/fokx/svelte-todo\n\n目前实现的功能：\n\n未登录的时候，将 todo 保存在浏览器的本地存储 IndexedDB 中，登录后，将 todo 保存在服务器端的 SQLite 数据库中。登录用的是 SSO 单点登录。\n\n目前遇到一些问题：\n1. 登录后未把浏览器里的本地 todo 上传并合并到服务器 sqlite 里。\n2. 不同设备/浏览器上都登录，但是一个上面的修改无法自动反映在另一个浏览器上，需要在其他浏览器上进行刷新。我想知道怎样实现修改 todo 后，服务器向其他登录的设备传递消息，命令其进行更新数据的操作。或者怎样实现在后台每隔一段时间自动从服务器拉数据，检测是否最新以决定是否要刷新界面。\n3. 有些时候网络较差，而操作需要得到服务器端成功的响应才刷新界面，导致操作卡顿，怎样实现先在浏览器的 IndexedDB 里储存，在后台异步进行数据同步，并在同步成功/失败时提示。\n\n先谢谢門友們。","cooked":"\n

目前实现的功能：

未登录的时候，将 todo 保存在浏览器的本地存储 IndexedDB 中，登录后，将 todo 保存在服务器端的 SQLite 数据库中。登录用的是 SSO 单点登录。

目前遇到一些问题：

登录后未把浏览器里的本地 todo 上传并合并到服务器 sqlite 里。
不同设备/浏览器上都登录，但是一个上面的修改无法自动反映在另一个浏览器上，需要在其他浏览器上进行刷新。我想知道怎样实现修改 todo 后，服务器向其他登录的设备传递消息，命令其进行更新数据的操作。或者怎样实现在后台每隔一段时间自动从服务器拉数据，检测是否最新以决定是否要刷新界面。
有些时候网络较差，而操作需要得到服务器端成功的响应才刷新界面，导致操作卡顿，怎样实现先在浏览器的 IndexedDB 里储存，在后台异步进行数据同步，并在同步成功/失败时提示。

先谢谢門友們。

\n","createdAt":"2024-10-25 08:20:19.2717","updatedAt":"2024-12-22 15:26:03.341953","replyToPostNumber":null,"replyCount":0,"likeCount":0,"wordCount":320,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":2,"publicVersion":2,"deletedAt":null,"isAnonymous":false,"user":{"id":4668,"username":"IO","name":null,"avatarUrl":"/uploads/image/86/f2/86f267c0aaa73835a999b7cc3a7e7a701605574eda9a2c2a56f5ddbbba64d1a9.avif","admin":true,"moderator":false,"signatureRaw":"","signatureCooked":null}},{"id":42041,"postNumber":2,"raw":"这个有点点意思，我随手用你站的服务器和域名部署了一个：\n\nhttps://todo.xjtu.app","cooked":"

这个有点点意思，我随手用你站的服务器和域名部署了一个：

https://todo.xjtu.app

","createdAt":"2024-10-25 08:39:45.03536","updatedAt":"2024-12-22 15:09:02.540018","replyToPostNumber":null,"replyCount":1,"likeCount":4,"wordCount":28,"liked":false,"bookmarked":false,"polls":[],"reactions":[{"reaction":"💯️","count":1,"users":[{"id":30,"username":"一只玉米人","name":"玉米🌽"}],"hasReacted":false},{"reaction":"rolling_on_the_floor_laughing_kissing_heart","count":1,"users":[{"id":501,"username":"Esing","name":"Shinku Sensei"}],"hasReacted":false},{"reaction":"😰️","count":1,"users":[{"id":1288,"username":"LittleWangInShanghai","name":"小王在上海"}],"hasReacted":false},{"reaction":"❤️","count":4,"users":[{"id":30,"username":"一只玉米人","name":"玉米🌽"},{"id":501,"username":"Esing","name":"Shinku Sensei"},{"id":1288,"username":"LittleWangInShanghai","name":"小王在上海"},{"id":4668,"username":"IO","name":null}],"hasReacted":false}],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":false,"user":{"id":4668,"username":"IO","name":null,"avatarUrl":"/uploads/image/86/f2/86f267c0aaa73835a999b7cc3a7e7a701605574eda9a2c2a56f5ddbbba64d1a9.avif","admin":true,"moderator":false,"signatureRaw":"","signatureCooked":null}},{"id":42044,"postNumber":3,"raw":"只写过后端，来口胡一两句吧。\n其实你已经把解决方案说出来了\n问题 1 简单实现就是在后端记录上次同步的时间戳，同步的时候把时间戳以后的更改全发给后端就行了。\n问题 2 就是后端主动向前端推流的问题，这种场景 SSE 绝对够用了\n问题 3 就是把你描述的东西实现出来就可以了，因为没看你代码不知道问题出在哪里，说不定要稍微改一下流程什么的\n祝顺利","cooked":"

只写过后端，来口胡一两句吧。
\n其实你已经把解决方案说出来了
\n问题 1 简单实现就是在后端记录上次同步的时间戳，同步的时候把时间戳以后的更改全发给后端就行了。
\n问题 2 就是后端主动向前端推流的问题，这种场景 SSE 绝对够用了
\n问题 3 就是把你描述的东西实现出来就可以了，因为没看你代码不知道问题出在哪里，说不定要稍微改一下流程什么的
\n祝顺利

\n","createdAt":"2024-10-25 10:40:00.204083","updatedAt":"2024-10-25 10:40:00.204083","replyToPostNumber":null,"replyCount":0,"likeCount":2,"wordCount":157,"liked":false,"bookmarked":false,"polls":[],"reactions":[{"reaction":"❤️","count":2,"users":[{"id":4668,"username":"IO","name":null},{"id":5151,"username":"Soyo34325","name":"Soyo34325"}],"hasReacted":false}],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":false,"user":{"id":2877,"username":"Zerick","name":null,"avatarUrl":"/uploads/image/a7/a3/a7a3f86ac04b30a3177766813966fa48ce68b0e1cc009a8d274e34ab13a43ce9.avif","admin":false,"moderator":false,"signatureRaw":null,"signatureCooked":null}},{"id":42057,"postNumber":4,"raw":"好快的部署 :rofl:","cooked":"

好快的部署 🤣

\n","createdAt":"2024-10-25 13:22:37.808217","updatedAt":"2024-10-25 13:22:37.808217","replyToPostNumber":2,"replyCount":0,"likeCount":0,"wordCount":6,"liked":false,"bookmarked":false,"polls":[],"reactions":[],"wiki":false,"version":1,"publicVersion":1,"deletedAt":null,"isAnonymous":false,"user":{"id":346,"username":"hoist","name":null,"avatarUrl":"/uploads/image/0d/cd/0dcdf69d213b6798002779ad4b729567cd4d889ee4a56c07a8c4454e8b563219.avif","admin":false,"moderator":false,"signatureRaw":null,"signatureCooked":null}},{"id":43248,"postNumber":5,"raw":"最近对 app 做了一些改进:\n* 优化了用户界面，看起来更现代\n* 离线时可用，重新在线后自动同步数据到服务器\n* 后台定时同步数据，在其他设备上无需手动刷新，稍等几秒即可\n\n欢迎門友加入开发，提 Issue 和 PR\n\n本来按照我的习惯，应该列一些计划增加的功能.\n但我受 Jensen Huang 不带手表影响，活在当下，不做未来的规划\nhttps://economictimes.indiatimes.com/magazines/panache/nvidia-ceo-jensen-huang-who-earns-4-billion-per-day-refuses-to-wear-a-watch-reason-will-suprise-you/articleshow/115162153.cms","cooked":"

最近对 app 做了一些改进:

优化了用户界面，看起来更现代
离线时可用，重新在线后自动同步数据到服务器
后台定时同步数据，在其他设备上无需手动刷新，稍等几秒即可

欢迎門友加入开发，提 Issue 和 PR

本来按照我的习惯，应该列一些计划增加的功能.
\n但我受 Jensen Huang 不带手表影响，活在当下，不做未来的规划

\n","createdAt":"2024-11-13 09:20:52.045171","updatedAt":"2024-12-22 15:26:04.905819","replyToPostNumber":null,"replyCount":0,"likeCount":5,"wordCount":137,"liked":false,"bookmarked":false,"polls":[],"reactions":[{"reaction":"wave_gif","count":2,"users":[{"id":30,"username":"一只玉米人","name":"玉米🌽"},{"id":200,"username":"Srotseiticar","name":null}],"hasReacted":false},{"reaction":"🥰️","count":1,"users":[{"id":501,"username":"Esing","name":"Shinku Sensei"}],"hasReacted":false},{"reaction":"❤️","count":5,"users":[{"id":30,"username":"一只玉米人","name":"玉米🌽"},{"id":200,"username":"Srotseiticar","name":null},{"id":501,"username":"Esing","name":"Shinku Sensei"},{"id":5151,"username":"Soyo34325","name":"Soyo34325"},{"id":6205,"username":"uika_winwing","name":null}],"hasReacted":false}],"wiki":false,"version":2,"publicVersion":2,"deletedAt":null,"isAnonymous":false,"user":{"id":4668,"username":"IO","name":null,"avatarUrl":"/uploads/image/86/f2/86f267c0aaa73835a999b7cc3a7e7a701605574eda9a2c2a56f5ddbbba64d1a9.avif","admin":true,"moderator":false,"signatureRaw":"","signatureCooked":null}}],"hasMore":false,"lastReadPostNumber":2,"hasUrlPostNumber":true}