开始使用 Realm Web 和 Atlas Device Sync(预览版)
在此页面上
支持 WebAssembly 的 Realm JavaScript SDK 允许您使用 Realm 数据库 API 和 Atlas Device Sync 为浏览器构建实时 Web 应用程序。
重要
支持WebAssembly 的Realm JavaScript SDK 处于预览状态。 相对于适用于 Node.js 或 的 SDK,它目前具有重大限制。RealmJavaScriptReact Native有关更多信息,请参阅限制部分。
从示例应用开始
开始使用 Realm JavaScript WebAssembly SDK 的最快方法是克隆并运行我们预构建的 Web Sync 示例应用。 该应用程序是用 React 编写的,并使用 Realm 数据库 API 和 Atlas Device Sync。
手动安装和设置
您可以从 npm 安装支持 WebAssembly 的 Realm JavaScript SDK:
npm install realm@12.0.0-browser.2
注意
支持 WebAssembly 的 Realm JavaScript SDK 目前仅作为 npm 上realm
包的标记版本提供。安装 SDK 时,您必须指定确切的版本号和标签。
您还需要将项目配置为使用启用了顶层等待的 webpack。 例如,您的配置应扩展此基本配置:
module.exports = { experiments: { topLevelAwait: true } };
使用 Realm & Device Sync
安装支持 WebAssembly 的 Realm JS SDK 并配置应用程序后,您可以使用该 SDK 来构建具有 Realm 和 Atlas Device Sync 功能的实时 Web 应用程序。
本节中的示例展示了如何在您的应用中使用 Realm。
提示
如果您正在编写 React 应用程序,请考虑使用@realm/react包。 它包括预构建的钩子和组件,可让您将 Realm 与 React 应用程序原生集成。
导入 Realm
在与数据库交互的源文件顶部导入 Realm:
import Realm, { App } from "realm";
初始化应用
Device Sync 使用 Atlas App Services 托管身份验证并在设备之间同步数据。要从 Web 应用中使用 Device Sync,您必须连接到启用了 Device Sync 的 App Services App。
您可以使用客户端应用程序 ID 连接到应用程序。 要了解如何获取应用程序 ID,请参阅查找您的应用程序 ID。
const app = new App({ id: "<your-app-id>" });
验证用户身份
要对用户进行身份验证,请在您的应用实例上调用App.logIn()
方法。 您可以使用任何身份验证提供程序登录。 有关更多示例,请参阅对用户进行身份验证。
const credentials = Realm.Credentials.anonymous(); await app.logIn(credentials);
定义对象模型
Realm 使用原生 JavaScript 对象对应用程序数据进行建模。 您可以定义对象类型,其中给定类型的所有对象共享控制对象内容的模式。
要定义 Realm 对象类型,请创建一个指定该类型的 name
和 properties
的模式对象。在域中的对象类型中,类型名称必须是唯一的。
const TaskSchema = { name: "Task", properties: { _id: "int", name: "string", status: "string?", owner_id: "string?", }, primaryKey: "_id", };
打开 Realm
要打开同步 Realm,请使用配置对象调用Realm.open()
,该配置对象指定该 Realm 的模式并包含sync
配置对象。 同步配置应指定经过身份验证的用户,并定义控制同步数据的初始订阅:
const realm = await Realm.open({ schema: [TaskSchema], sync: { user: app.currentUser, flexible: true, // Define initial subscriptions to start syncing data as soon as the // realm is opened. initialSubscriptions: { update: (subs, realm) => { subs.add( // Get objects that match your object model, then filter them by // the `owner_id` queryable field realm.objects(Task).filtered(`owner_id == "${anonymousUser.id}"`) ); }, }, }, });
打开非同步 Realm
要打开不同步的本地内存中 Realm,请使用本地 Realm 配置对象调用Realm.open()
:
const realm = await Realm.open({ schema: [TaskSchema] });
创建、修改和删除 Realm 对象
打开 Realm 后,您可以在其中创建、修改和删除对象。 所有写入操作都必须发生在Realm.write()
事务区块内。
const allTasks = realm.objects(Task); // Add a couple of Tasks in a single, atomic transaction. realm.write(() => { realm.create(Task, { _id: 1, name: "go grocery shopping", status: "Open", }); realm.create(Task, { _id: 2, name: "go exercise", status: "Open", }); }); const task1 = allTasks.find((task) => task._id == 1); const task2 = allTasks.find((task) => task._id == 2); realm.write(() => { // Modify an object. task1!.status = "InProgress"; // Delete an object. realm.delete(task2); });
查找、排序和筛选对象
您可以使用Realm.objects()
方法查询 Realm 中的对象。 查询必须指定要查询的Realm 对象类型。您可以选择使用 Fluent 方法链接 API 对查询结果进行筛选和排序。
// Query for specific obect using primary key. const specificTask = realm.objectForPrimaryKey(Task, 0); // Query realm for all instances of the "Task" type. const tasks = realm.objects(Task); // Filter for all tasks with a status of "Open". const openTasks = tasks.filtered("status = 'Open'"); // Sort tasks by name in ascending order. const tasksByName = tasks.sorted("name");
关闭 Realm
在完成 Realm 实例后调用Realm.close()
方法以避免内存泄漏。
// Close the realm. realm.close();
Device Sync 在 Web 上的限制
浏览器上的 Device Sync 目前受到以下限制:
无持久性:Realm JavaScript Web SDK 不会将 Device Sync 数据持久保存到磁盘。 所有本地数据都存储在内存中,关闭或刷新浏览器标签页时会丢失。
无工作线程:您必须在主线程上执行所有 Realm 操作。 您无法在网络工作线程中打开或使用 Realm。
无静态加密: Realm JavaScript Web SDK将所有未加密的静态数据存储在内存中。 浏览器和 Device Sync 服务器之间传输的数据通过 HTTPS 进行加密。