ストレージ（Storage）

Storage API は、キーと値のローカルデータ永続化を提供します。

オンラインで試す

setStoragegetStorageremoveStorage

Storage API のデモ

localStorage を使って永続化します。ページを再読み込みしても読み取れます。

Vue

<script setup>
import { ref } from 'vue'
import woo from 'mini-sdk'

const data = ref(null)

async function save() {
  await woo.setStorage({ key: 'demo', data: { hello: 'world' } })
}
async function load() {
  const res = await woo.getStorage({ key: 'demo' })
  data.value = res.data
}
</script>

<template>
  <button @click="save">保存</button>
  <button @click="load">读取</button>
  <pre v-if="data">{{ data }}</pre>
</template>

React

import { useState } from 'react'
import woo from 'mini-sdk'

function StorageDemo() {
  const [data, setData] = useState(null)

  async function save() {
    await woo.setStorage({ key: 'demo', data: { hello: 'world' } })
  }
  async function load() {
    const res = await woo.getStorage({ key: 'demo' })
    setData(res.data)
  }

  return (
    <>
      <button onClick={save}>保存</button>
      <button onClick={load}>读取</button>
      {data && <pre>{JSON.stringify(data, null, 2)}</pre>}
    </>
  )
}

インポート

import woo from 'mini-sdk'
// 或
import { storage } from 'mini-sdk'

API 一覧

setStorage

キーと値を保存します。

woo.setStorage(options: SetStorageOptions): Promise<void>

パラメータ：

フィールド	型	必須	説明
key	string	はい	キー名
data	unknown	はい	値（シリアル化可能な任意のデータ）

// 存储字符串
await woo.setStorage({ key: 'username', data: 'Alice' })

// 存储对象
await woo.setStorage({
  key: 'userProfile',
  data: { name: 'Alice', age: 25, tags: ['dev', 'design'] },
})

// 存储数组
await woo.setStorage({
  key: 'recentSearches',
  data: ['mini-sdk', 'bridge', 'router'],
})

---

getStorage

指定キーのデータを取得します。

woo.getStorage<T>(options: GetStorageOptions<T>): Promise<GetStorageResult<T>>

パラメータ：

フィールド	型	必須	説明
key	string	はい	キー名

戻り値：

interface GetStorageResult<T = unknown> {
  data: T  // 存储的值
}

// 读取字符串
const { data: username } = await woo.getStorage({ key: 'username' })
console.log(username) // "Alice"

// 带泛型的类型安全读取
interface UserProfile {
  name: string
  age: number
  tags: string[]
}

const { data: profile } = await woo.getStorage<UserProfile>({
  key: 'userProfile',
})
console.log(profile.name) // "Alice"

---

removeStorage

指定キーのデータを削除します。

woo.removeStorage(options: RemoveStorageOptions): Promise<void>

パラメータ：

フィールド	型	必須	説明
key	string	はい	削除するキー

await woo.removeStorage({ key: 'username' })

---

clearStorage

すべての保存データを消去します。

woo.clearStorage(options?: ClearStorageOptions): Promise<void>

await woo.clearStorage()

WARNING

clearStorage は当該ミニプログラムのストレージをすべて消去します。取り扱いには注意してください。

通しの例：トークン管理

Vue

<script setup>
import { ref, onMounted } from 'vue'
import woo from 'mini-sdk'

const TOKEN_KEY = 'auth_token'
const USER_KEY = 'user_info'

const user = ref(null)

async function saveAuth(token, userInfo) {
  await Promise.all([
    woo.setStorage({ key: TOKEN_KEY, data: token }),
    woo.setStorage({ key: USER_KEY, data: userInfo }),
  ])
}

async function loadUser() {
  try {
    const { data } = await woo.getStorage({ key: USER_KEY })
    user.value = data
  } catch {
    user.value = null
  }
}

async function logout() {
  await Promise.all([
    woo.removeStorage({ key: TOKEN_KEY }),
    woo.removeStorage({ key: USER_KEY }),
  ])
  user.value = null
}

onMounted(loadUser)
</script>

<template>
  <div v-if="user">{{ user.name }}</div>
  <button v-else @click="saveAuth('token', { name: 'Alice' })">登录</button>
  <button @click="logout">退出</button>
</template>

React

import { useState, useEffect } from 'react'
import woo from 'mini-sdk'

const TOKEN_KEY = 'auth_token'
const USER_KEY = 'user_info'

function AuthManager() {
  const [user, setUser] = useState(null)

  useEffect(() => {
    woo.getStorage({ key: USER_KEY })
      .then(({ data }) => setUser(data))
      .catch(() => setUser(null))
  }, [])

  async function login() {
    await Promise.all([
      woo.setStorage({ key: TOKEN_KEY, data: 'token' }),
      woo.setStorage({ key: USER_KEY, data: { name: 'Alice' } }),
    ])
    setUser({ name: 'Alice' })
  }

  async function logout() {
    await Promise.all([
      woo.removeStorage({ key: TOKEN_KEY }),
      woo.removeStorage({ key: USER_KEY }),
    ])
    setUser(null)
  }

  return (
    <>
      {user ? <div>{user.name}</div> : <button onClick={login}>登录</button>}
      <button onClick={logout}>退出</button>
    </>
  )
}

型定義

interface SetStorageOptions {
  key: string
  data: unknown
  success?: () => void
  fail?: (err: BridgeError) => void
  complete?: () => void
}

interface GetStorageOptions<T = unknown> {
  key: string
  success?: (res: GetStorageResult<T>) => void
  fail?: (err: BridgeError) => void
  complete?: () => void
}

interface GetStorageResult<T = unknown> {
  data: T
}

interface RemoveStorageOptions {
  key: string
  success?: () => void
  fail?: (err: BridgeError) => void
  complete?: () => void
}

interface ClearStorageOptions {
  success?: () => void
  fail?: (err: BridgeError) => void
  complete?: () => void
}

API 早見表

メソッド	説明	シグネチャ
setStorage	データを保存	({ key, data }) → Promise<void>
getStorage	データを取得	({ key }) → Promise<{ data }>
removeStorage	指定 key を削除	({ key }) → Promise<void>
clearStorage	すべて消去	() → Promise<void>
getStorageInfo	保存情報を取得	() → Promise<{ keys, currentSize, limitSize }>
setStorageSync	同期で保存	(key, data) → void
getStorageSync	同期で取得	(key) → any
removeStorageSync	同期で削除	(key) → void
clearStorageSync	同期で消去	() → void