plugin-store로 영속화 (와 localStorage가 거짓말하는 이유)

"개발 내내 잘 됐는데, 진짜 사용자가 빌드된 앱을 열었더니 모든 설정이 사라졌어. 웹뷰 저장소에 온 걸 환영해."

출시 후에야 나타나는 함정

아는 웹 도구를 꺼내: localStorage(어쩌면 Zustand persist 미들웨어 뒤에). tauri dev에선 완벽히 왕복해 — 설정이 저장되고 다시 로드돼, 문제없어. 그다음 진짜 .app을 빌드하고, 서명하고, 누군가에게 건네면, 두 번째 실행에 모든 값이 사라져. 네 코드는 아무것도 안 바뀌었어. 밑의 저장소 층이 바뀐 거야.

macOS WKWebView localStorage가 안 durable한 이유

진짜 이유야, Cinder에서 어렵게 배운. dev에선 프론트엔드가 Vite origin(http://localhost:1420)에서 서빙되고, 그게 WebKit 데이터 디렉터리를 따뜻하게 유지해서 localStorage가 영속해. 근데 번들되고 서명된 macOS .app 안에선, WKWebView 데이터 디렉터리가 앱 샌드박스랑 서명 자세 하에서 실행 사이에 리셋될 수 있어 — 그래서 거기선 localStorage가 사실상 일회성이야. JS로 고칠 수 있는 버그가 아냐. macOS에서 웹뷰 저장소가 사는 곳의 속성이야.

고침: Rust로 영속화

store 플러그인이 그 질문 전체를 비껴가. 웹뷰 저장소를 믿는 대신, JSON을 Rust로 앱 config 디렉터리에 써 — macOS에선 ~/Library/Application Support/<네.identifier>/ 아래. 그건 OS가 안 지우는 진짜 파일이라 앱 재시작이랑 샌드박스 리셋을 견뎌. 떨어지는 규칙: Tauri 앱에서 durable한 설정은 store 플러그인(이나 다른 Rust 쪽 영속화 경로)에 속하지, 웹뷰 localStorage엔 절대 아냐.

Code

store 플러그인: 진짜로 영속하는 영속화·ts

import { LazyStore } from "@tauri-apps/plugin-store";

// JSON을 Rust로 앱 config 디렉터리에 써 — 재시작을 견뎌.
// macOS: ~/Library/Application Support/<네.identifier>/settings.json
const store = new LazyStore("settings.json");

await store.set("theme", "dark");
await store.save();              // 디스크로 flush

const theme = await store.get<string>("theme"); // 재실행 후에도 "dark"

dev는 거짓말하고, 빌드된 앱은 진실을 말해·text

왜 중요한가 (Cinder의 추론, 농축):

  dev (npm run tauri dev)        빌드+서명된 .app
  ─────────────────────────      ─────────────────────────
  localhost:1420에서 서빙         Vite origin 없음
  WebKit 데이터 디렉터리 따뜻      WKWebView 디렉터리 재실행시 리셋 가능
  localStorage 왕복 ✓            localStorage 조용히 비워짐 ✗

  → store 플러그인(Rust → config 디렉터리) 설정은 둘 다 견뎌.

Exercise

store 플러그인을 더하고 설정(예: 테마 토글)을 그걸로 영속화해. 앱을 종료하고 다시 실행해(먼저 dev에서) 복원되는지 확인해. 그다음 대신 빌드된 macOS .app에서 localStorage를 썼다면 무슨 일이 났을지, 그리고 store 플러그인이 왜 그 운명을 피하는지 한 문장으로 예측해 써.

Hint

LazyStore('settings.json'), store.set/get/save. 예측: localStorage는 dev는 견뎌도 번들 .app에선 WKWebView 데이터 디렉터리가 거기서 안 durable해서 리셋될 수 있어; store 플러그인은 OS가 지키는 config 디렉터리에 진짜 파일을 써.