Nuxt SurrealDB
SurrealDB の使用を簡素化する Nuxt モジュールです。
クイックセットアップ
モジュールを Nuxt アプリケーションにインストールします
npx nuxi module add nuxt-surrealdb
次に、デフォルトのデータベースプリセットを編集し、Nuxt アプリで Nuxt SurrealDB を使用します ✨
機能
- 📦 コンポーザブル/関数ごとに複数のデータベースを使用できるようにするカスタムデータベースプリセット。
- 🚀 それぞれ
$fetch
とuseFetch
に基づいた、カスタムビルトイン$surrealFetch
とuseSurrealFetch
。 - ⚡️
$surrealRPC
とuseSurrealRPC
を介した RPC エンドポイント のビルトインサポート。 - 🏗️ SurrealDB とのプライベートネットワーク通信のためのサーバーサイドプライベートDBプリセットを備えた、ビルトイン Nuxt サーバー
useSurrealRPC
ユーティリティ。 - 💡 各 RPC メソッドは
useSurrealDB
エクスポート関数にマッピングされます。 - 🌟
useSurrealWS
コンポーザブルを使用した RPC メソッドによる Websocket 通信のビルトインサポート。
データベースプリセット
default
プリセットをカスタマイズしたり、nuxt.config.ts
または .env
を介して独自のデータベースプリセットを定義したりできます。
!注意 下記の
shop
のようにカスタムプリセットに変数を渡す場合は、nuxt.config.ts
内で空のオブジェクトとして初期化することが重要です
NUXT_PUBLIC_SURREALDB_DATABASES_SHOP_HOST="https://example.com"
NUXT_PUBLIC_SURREALDB_DATABASES_SHOP_WS="wss://example.com"
NUXT_PUBLIC_SURREALDB_DATABASES_SHOP_NS="surrealdb"
NUXT_PUBLIC_SURREALDB_DATABASES_SHOP_DB="docs"
NUXT_PUBLIC_SURREALDB_DATABASES_SHOP_SC="user"
# To add authentication server side (this does not override the client's token)
# As a Bearer
NUXT_SURREALDB_DATABASES_SHOP_AUTH="mySuperLongBearerToken"
# Or as an object
NUXT_SURREALDB_DATABASES_SHOP_AUTH_USER="root"
NUXT_SURREALDB_DATABASES_SHOP_AUTH_PASS="root"
export default defineNuxtConfig({
modules: ['nuxt-surrealdb'],
surrealdb: {
databases: {
default: {
host: 'https://example.com',
ws: 'wss://example.com',
NS: 'production',
DB: 'website'
},
crm: {
host: 'https://crm.example.com',
ws: 'wss://crm.example.com',
NS: 'demo',
DB: 'crm',
// The following auth example is exposed client side!
auth: 'mySuperLongBearerToken'
},
shop: {},
},
server: { // the following add auth only server side
databases: {
default: {
auth: '', // then edit it via NUXT_SURREALDB_DATABASES_DEFAULT_AUTH
// OR
auth: {
user: '', // then edit it via NUXT_SURREALDB_DATABASES_DEFAULT_AUTH_USER
pass: '' // then edit it via NUXT_SURREALDB_DATABASES_DEFAULT_AUTH_PASS
}
}
}
}
},
// To change a db preset during development it is best to do the following
$development: {
surrealdb: {
databases: {
default: {
host: 'https://127.0.0.1:8000',
ws: 'ws://127.0.0.1:8000'
}
}
}
},
// ...
})
!注意 開発環境と本番環境で異なるデータベースプリセットを使用する場合は、上記の例のように、
nuxt.config.ts
内で Nuxt のネイティブ$development
および$production
プロパティ を使用してください。
データベースのプロパティ (上記の surrealdb.server.databases.default.auth
など) をサーバーサイドで拡張または変更することも可能です。これは、クライアント側に資格情報を公開せずに、より従来型のデータベース認証アプローチを使用する場合や、プライベートネットワークで異なる host
アドレスを使用する場合に特に役立ちます。
次に、データベースプリセットを使用するには、各メインコンポーザブルの最後のパラメーター内で設定するだけです (useSurrealDB
から逆構造化された関数もこのオーバーライドをサポートしています)。
// all the functions destructured will be executed against the CRM database
const { query, select } = useSurrealDB({
database: 'crm',
})
// only the following select will be made against the default database
const { data } = await select('products', {
database: 'default',
})
// you could also define a one-time only preset
const { data } = await sql(
'SELECT * FROM products WHERE price < $maxPrice;',
{ maxPrice: 500 },
{
database: {
host: 'https://surrealdb.example.com',
NS: 'demo',
DB: 'shop',
},
},
)
RPC メソッド
メインの useSurrealDB
は、RPC エンドポイントと直接通信する多数の関数をエクスポートします。各関数には2つのバリアントがあり、1つは $
で始まり、もう1つは始まりません。最初のものは、プレーン関数を提 供する $surrealRPC
に基づいており、後者は useSurrealFetch
(したがって、useFetch
) を利用しています。
こちらが完全なリストです
const {
authenticate, // $authenticate
create, // $create
delete, // $delete
info, // $info
insert, // $insert
invalidate, // $invalidate
merge, // $merge
patch, // $patch
query, // $query
remove, // $remove
select, // $select
signin, // $signin
signup, // $signup
sql, // $sql
update, // $update
version, // $version
} = useSurrealDB()
!注意
sql
メソッドはquery
のエイリアスであり、version
は HTTP エンドポイント を使用します。
RPC Websocket
useSurrealWS
コンポーザブルは、SurrealDB とのライブ通信を処理するための Websocket 接続を公開します。内部的には @vueuse/core
の useWebsocket
を使用しているため、SSR、自動接続、自動切断はデフォルトで自動的に処理されます。データは、入力と data
戻り値の両方で、JSON
から string
に自動的に解析されます。利用可能な場合、Websocket 接続時に、以前のユーザーログインからの認証トークンがあればそれを利用します。データベースプリセットと Websocket オプションは、コンポーザブルのメイン引数として使用できます。
以下は、Websocket コンポーザブルから利用できる主なメソッドのリストです
const {
authenticate,
close,
create,
data,
set, // alias for `let`
info,
insert,
invalidate,
kill,
let,
live,
merge,
open,
patch,
query,
remove,
rpc,
select,
send,
signin,
signup,
sql, // alias for `query`
status,
unset,
update,
use,
ws,
} = useSurrealWS()
!警告 現在、
signin
メソッドとsignup
メソッドは利用可能ですが、現在の Websocket 接続に制限されています。したがって、その websocket 接続以外で認証が必要な場合は、SCOPE
ユーザー認証にメインのuseSurrealAuth
コンポーザブルを使用することをお勧めします。
貢献
ローカル開発
# Install dependencies
npm install
# Generate type stubs
npm run dev:prepare
# Develop with the playground
npm run dev
# Build the playground
npm run dev:build
# Run ESLint
npm run lint
# Run Vitest
npm run test
npm run test:watch
# Release new version
npm run release