# @daily-co/react-native-daily-js 中文文档

规范地址：https://npmcn.com/package/%40daily-co/react-native-daily-js/

版本：0\.90\.0
npm 元数据更新时间：2026-11-07T11:58:09.009Z
中文译文更新时间：2026-11-11T08:58:10.244Z
软件包许可：BSD-2-Clause

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40daily-co/react-native-daily-js
原文对照：https://npmcn.com/package/%40daily-co/react-native-daily-js/?lang=original
项目主页：https://github.com/daily-co/react-native-daily-js#readme
源码仓库：https://github.com/daily-co/react-native-daily-js

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：128 kB，22 个文件
- 模块格式：CommonJS
- TypeScript 类型：包内自带
- 运行依赖：4 个
- peer 依赖：react-native \>=0\.68\.0，@daily-co/react-native-webrtc ^155\.0\.1-daily\.1，react-native-background-timer ^2\.4\.1，react-native-get-random-values ^1\.11\.0，@react-native-async-storage/async-storage ^1\.24\.0 \|\| ^2\.0\.0 \|\| ^3\.0\.0
- 首次发布：2020-06-29T23:19:13.804Z
- 最新版本发布：2026-11-07T11:58:08.817Z
- 近 30 天下载量：124563（2026-10-11 至 2026-11-09，npm 官方下载统计）
- 已发布版本数：112（近 12 个月 10 个）

## 中文简介

使用 Daily 调用视频调用本地文库

## 安装

```sh
npm install @daily-co/react-native-daily-js
```

也可以使用：`pnpm add @daily-co/react-native-daily-js`、`yarn add @daily-co/react-native-daily-js`、`bun add @daily-co/react-native-daily-js`

## README

# 反应-本土-每日-js

Daily JavaScript Resact Introduct图书馆.

## 最低OS/SDK版本

此软件包对您的项目所能支持的OS/SDK版本提出了一些限制 :

-   **iOS系统**\- 部署目标
-   **机器人**数字 : `minSdkVersion` 第24条

## 安装

安装 `react-native-daily-js` 及其同伴依赖关系:

```bash
npm i @daily-co/react-native-daily-js @react-native-async-storage/async-storage@^1.15.7 react-native-background-timer@^2.3.1 react-native-get-random-values@^1.9.0
npm i --save-exact @daily-co/react-native-webrtc@155.0.1-daily.1
```

然后,遵循以下步骤,在每个平台上设置你的本土项目. **请注意,这些步骤假设你使用的是支持自動連接(QQ 60)的React Industrial版本.**

> 如果您的项目使用 [博览](https://expo.dev/),使用 [`config-plugin-rn-daily-js` 配置软件包](https://www.npmjs.com/package/@daily-co/config-plugin-rn-daily-js) 而不是以下步骤.

### iOS系统

更新 `platform` 在你身边 `Podfile`,从 `@daily-co/react-native-webrtc` 仅在iOS 12及以上工作:

```ruby
platform :ios, '12.0'
```

> 如果你愿意的话 **发送屏幕共享** 从iOS,它只工作 **iOS 14** 及以上各点。 因此,在这种情况下,请切换使用iOS 14.0而不是iOS 12.0.

然后运行 :

```bash
npx pod-install
```

接下来,你需要更新您的项目 `Info.plist` 添加三行新键如下:

-   `NSCameraUsageDescription`
-   `NSMicrophoneUsageDescription`
-   `UIBackgroundModes`

对于前两个密钥的值,提供用户化的字符串,解释你的应用程序为什么要求相机和麦克风访问. **请注意, 没有这些应用程序, 应用程序只会静静地崩溃 .**

`UIBackgroundModes` 处理方式略有不同,并将决定一个阵列。 对于第一个项目,请指定值 `voip`。这可以确保当您的应用程序被发送到背景时,音频会不间断地继续 .

要通过 Xcode 添加新行,请打开 `Info.plist` 并增加以下三行:

| 密钥 | 类型 | 数值 |
| --- | --- | --- |
| 隐私 - 相机使用描述 | 字符串 | "每日游乐场需要相机进入工作" |
| 隐私 - 麦克风使用描述 | 字符串 | "每日游乐场需要麦克风进入工作" |
| 所需的背景模式 | 阵列 | 1项 |
| \-- -- > 项目0 | 字符串 | App提供IP服务之声 |

如果您查看了原始文件内容 `Info.plist`应该是这样的

```
<dict>
    ...
    <key>NSCameraUsageDescription</key>
    <string>Daily Playground needs camera access to work</string>
    <key>NSMicrophoneUsageDescription</key>
    <string>Daily Playground needs microphone access to work</string>
    <key>UIBackgroundModes</key>
    <array>
        <string>voip</string>
    </array>
    ...
</dict>
```

#### IOS 上的屏幕共享

要使用iOS上的屏幕共享功能,需要做几个人工步骤来设置 Daily's [反应原生屏幕共享扩展框架](https://github.com/daily-co/rn-screen-share-extension/) (已包括在 `react-native-daily-js`) (中文(简体) ). 请参考其读取内容详细.

### 机器人

添加以下内容到 `AndroidManifest.xml`数字 :

```xml
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" />
<uses-feature android:name="android.hardware.camera.autofocus"/>

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.WAKE_LOCK" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

<uses-permission android:name="android.permission.FOREGROUND_SERVICE"/>
<uses-permission android:name="android.permission.FOREGROUND_SERVICE_CAMERA"/>
<uses-permission android:name="android.permission.FOREGROUND_SERVICE_MICROPHONE"/>
<uses-permission android:name="android.permission.FOREGROUND_SERVICE_MEDIA_PROJECTION"/>
<uses-permission android:name="android.permission.POST_NOTIFICATIONS"/>

<application>
  // ...
  <service android:name="com.daily.reactlibrary.DailyOngoingMeetingForegroundService" android:foregroundServiceType="camera|microphone"/>
</application>
```

> 注:上文, `android.permission.FOREGROUND_SERVICE_MEDIA_PROJECTION` 只有想要进行屏幕共享时才需要.

更新您的 `minSdkVersion` 在您的顶级 `build.gradle` 文件 :

```groovy
minSdkVersion = 24
```

(如果遇到任何问题,请参考 [Github 问题](https://github.com/react-native-webrtc/react-native-webrtc/issues/720) 喜欢 [这些](https://github.com/jitsi/jitsi-meet/issues/4778),或 `react-native-webrtc` [安装文件](https://github.com/react-native-webrtc/react-native-webrtc/blob/master/Documentation/AndroidInstallation.md)让你经历一个更复杂的过程 上文阐述的较简单程序似乎在以 " 土著CLI " 为基础的 " 香草现代反应 " 结构中起作用.

## 使用量

`react-native-daily-js` 是反应原生对应物 `daily-js`,并且可以几乎一样的方式用于在您的应用程序中添加视频通话. [完整文档 `react-native-daily-js` (还有) `daily-js`)在这里可以找到](https://docs.daily.co/reference#using-the-react-native-daily-js-library)。 。 。 .

```ts
import Daily from '@daily-co/react-native-daily-js';

// ...

// Start joining a call
const call = Daily.createCallObject();
call.join({ url: 'https://your-team.daily.co/allhands' });

// Listen for events signaling changes to participants or their audio or video.
// - 'participant-joined' and 'participant-left' are for remote participants only
// - 'participant-updated' is for the local participant as well as remote participants
const events: DailyEvent[] = [
  'participant-joined',
  'participant-updated',
  'participant-left',
];
for (const event of events) {
  call.on(event, () => {
    for (const participant of Object.values(call.participants())) {
      console.log('---');
      console.log(`participant ${participant.user_id}:`);
      if (participant.local) {
        console.log('is local');
      }
      if (participant.audio) {
        console.log('audio enabled', participant.audioTrack);
      }
      if (participant.video) {
        console.log('video enabled', participant.videoTrack);
      }
    }
  });
}
```

```tsx
import { DailyMediaView } from '@daily-co/react-native-daily-js';

// ...

<DailyMediaView
  videoTrack={participant.videoTrack}
  audioTrack={participant.audioTrack}
  mirror={participant.local}
  zOrder={participant.local ? 1 : 0}
  style={someStyle}
/>;
```

[请见此博客文章](https://www.daily.co/blog/building-a-custom-video-chat-app-with-react). 它专注于React Web,但大部分也应应用于你的React Introduct应用.

## 对应用程序执行者的各类考虑

### 参与者数

请注意,同时为众多参与者展示视频可以使用你手机的大量资源. 这可以让应用程序运行得更慢,使用更多的电池,特别是如果你使用更老的设备. 对于更大的会议,考虑一次只展示一些视频. 在未来的发行中, `daily-js`是因为 [音轨订阅 API](https://www.daily.co/blog/create-dynamic-meetings-using-track-subscriptions/) 将会被带到 `react-native-daily-js`,让您避免网络带宽成本 接收视频为非屏幕参与者.

### 设备方向

如果您想支持在电话中旋转您的电话, 建议您不要限制您的应用程序支持的方向( 即通过) `Info.plist` 或者说 `AndroidManifest.xml`) (中文(简体) ).

狦 _为:_ 限制您的应用程序所支持的方向( 例如, 用于肖像) , 请注意, 默认情况下, 每次您都会在 iOS 和 Android 上出现一些不同的视频行为 _对_ 旋转您的手机( 例如到地平面) .

在iOS上,您所捕获的视频会旋转以补偿手机的旋转,意思是:

-   其他学员会继续直面你
-   您的本地视频将和您手机上其他参与者的视频一样定向(所以您现在需要用鸡巴敲头才能直观)

在Android上,你抓获的视频会 _没有_ 旋转以补偿电话的旋转,意思是:

-   其他参与者现在会看到你的侧面
-   您的本地视频会 _没有_ 和电话上其他参与者的视频一样

## 常见问题

### @daily-co/react-native-daily-js 是什么？

使用 Daily 调用视频调用本地文库

### 如何安装 @daily-co/react-native-daily-js？

在项目目录运行 npm install @daily-co/react-native-daily-js，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react-native（\>=0\.68\.0）、@daily-co/react-native-webrtc（^155\.0\.1-daily\.1）、react-native-background-timer（^2\.4\.1）、react-native-get-random-values（^1\.11\.0）、@react-native-async-storage/async-storage（^1\.24\.0 \|\| ^2\.0\.0 \|\| ^3\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @daily-co/react-native-daily-js 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @daily-co/react-native-daily-js 支持 ESM 还是 CommonJS？

以 CommonJS 形式发布，可以直接 require\(\)；在 ES Module 项目中也可以用 import 引入（Node\.js 会把 module\.exports 作为默认导出）。

### @daily-co/react-native-daily-js 可以商用吗？

@daily-co/react-native-daily-js 使用 BSD-2-Clause 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @daily-co/react-native-daily-js 的下载量有多少？

根据 npm 官方下载统计，@daily-co/react-native-daily-js 在 2026/10/11 – 2026/11/09 这 30 天内被下载 124,563 次，日均约 4,152 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @daily-co/react-native-daily-js 还在维护吗？

最新版本 0\.90\.0 发布于 2026/11/07（3 天前）；至今共发布 112 个版本，其中过去 12 个月发布了 10 个；首次发布于 2020/06/30。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。