跳转至正文
@capgo/capacitor-watch 设备 API 开源

观看 Capacitor 插件

Apple Watch 与 Wear OS 通信,手机和手表应用之间支持双向消息传递

安装

bun add @capgo/capacitor-watch bunx cap sync
npm、pnpm 或 yarn
  • npm install @capgo/capacitor-watch
  • pnpm add @capgo/capacitor-watch
  • yarn add @capgo/capacitor-watch

指南

如何在 Capacitor 中使用 Watch

使用 @capgo/capacitor-watch

适用于 Capacitor 的 Apple Watch 通信插件。通过 WatchConnectivity 实现 iPhone 与 Apple Watch 之间的双向消息传递。

安装

bun add @capgo/capacitor-watch
bunx cap sync

插件暴露的内容

  • sendMessage - 向手表发送交互式消息。需确保手表在线才能成功。适用于对时间敏感的交互式通信。
  • updateApplicationContext - 更新与手表共享的应用上下文。仅保留最新的上下文——这会覆盖之前的任何上下文。适用于同步手表需要展示的应用状态。
  • transferUserInfo - 将用户信息传输至手表。传输任务会进入队列并按顺序交付,即使手表当前无法连接。适用于必须可靠交付的重要数据。
  • replyToMessage - 回复手表发出的回复请求。请在响应 messageReceivedWithReply 事件时使用此功能。

用法示例

sendMessage

向手表发送交互式消息。需确保手表在线才能成功。适用于对时间敏感的交互式通信。

import { CapgoWatch } from '@capgo/capacitor-watch';

await CapgoWatch.sendMessage({
  data: { action: 'refresh', timestamp: Date.now() }
});

updateApplicationContext

更新与 watch 共享的应用上下文。仅保留最新的上下文——这会覆盖之前的任何上下文。用于同步 watch 需要展示的应用状态。

import { CapgoWatch } from '@capgo/capacitor-watch';

await CapgoWatch.updateApplicationContext({
  context: { theme: 'dark', lastSync: Date.now() }
});

transferUserInfo

将用户信息传输至 watch。传输任务会进入队列并按顺序交付,即使 watch 当前无法连接。适用于必须可靠交付的重要数据。

import { CapgoWatch } from '@capgo/capacitor-watch';

await CapgoWatch.transferUserInfo({
  userInfo: { recordId: '123', action: 'created' }
});

replyToMessage

回复 watch 发来的、要求回复的消息。请在响应 messageReceivedWithReply 事件时使用此方法。

import { CapgoWatch } from '@capgo/capacitor-watch';

CapgoWatch.addListener('messageReceivedWithReply', async (event) => {
  const result = await processRequest(event.message);
  await CapgoWatch.replyToMessage({
    callbackId: event.callbackId,
    data: { result }
  });
});

完整参考

继续阅读:使用 @capgo/capacitor-watch

如果你正在使用 使用 @capgo/capacitor-watch 要规划原生插件工作,请将其与 @capgo/capacitor-watch 有关 @capgo/capacitor-watch 的实现细节, 快速入门 有关“入门指南”中的实现细节, Capgo 插件目录 查看 Capgo 插件目录中的产品工作流, Capgo 提供的 Capacitor 插件 有关 Capgo 开发的 Capacitor 插件的实现细节,以及 添加或更新插件 有关添加或更新插件的实现细节。

常见问题

Watch 插件常见问题

如何在 Capacitor 应用中安装 Watch 插件?

运行 "bun add @capgo/capacitor-watch" (或 "npm install @capgo/capacitor-watch"),然后运行 "bunx cap sync",使 iOS 和 Android 项目同步原生 code。最后在你的应用 code 中从 "@capgo/capacitor-watch" 导入即可。

@capgo/capacitor-watch 是否支持 React、Vue 和 Angular?

支持。Watch 是一个 Capacitor 包,因此它可以与任何在 Capacitor 中运行的 Web 框架配合使用,包括 Ionic、React、Vue、Angular、Svelte 以及原生 JavaScript。

@capgo/capacitor-watch 支持哪个版本的 Capacitor?

Capgo 插件遵循 Capacitor 的主版本号:请使用与 Capacitor 主版本号一致的插件主版本(例如插件 v8 对应 Capacitor 8)。GitHub README 中的兼容性表列出了仍在维护的版本。

@capgo/capacitor-watch 是免费开源的吗?

是的。code 的源码已在 GitHub 公开,地址为 https://github.com/Cap-go/capacitor-watch/,并且你可以通过 npm 免费安装该包。欢迎提交 Bug 报告和 Pull Request。

我可以在不经过 App Store 审核的情况下,更新使用了 Watch 的 code 吗?

安装或升级插件会改动原生 code,因此需要重新做一次商店构建。之后,调用该插件的 JavaScript、HTML 和 CSS 改动就能通过 Capgo live updates 立即发布。

无需等待应用审核,即可即时发布 Watch 更新

只要插件已包含在你的商店版本中,Capgo live updates 就能在几分钟内把 JavaScript、HTML 和 CSS 的改动推送给用户。

开始使用 Capgo