---
title: IOS 系统弹窗权限重拉流
summary: 介绍 iOS 权限弹窗导致 IPC 播放器误断流的解决方案，使用 ignoreHideStopPreview 属性避免。
---

# IOS 系统弹窗权限重拉流

## 问题背景

在对讲、录制等场景中，首次申请相关权限时，`iOS` 系统会弹出权限授权弹窗。  
此时页面会触发 `onHide` 事件，播放器组件会误以为页面进入后台，从而 **中断拉流**。  
当用户选择允许或拒绝后，系统关闭弹窗并触发 `onShow`，播放器才会恢复拉流。

由于中间经历断流，容易导致对讲或录制功能异常，因此需要额外处理。

## 修复方案

### 轻量播放器组件

在触发 `iOS` 权限弹窗前，将该属性设置为 true，可避免因 `onHide` 事件导致播放器停止拉流。  
同时新增事件 `onChangeIgnoreHideStopPreview`，用于监听内部状态变化并及时恢复原始取值。

> 💡 **注意** 轻量播放器组件 `@ray-js/ray-ipc-player` 版本需升级到最新版本

示例代码如下

```jsx
import IpcPlayer from '@ray-js/ray-ipc-player';
import { useState } from 'react';

const [ignoreHideStopPreview, setIgnoreHideStopPreview] = useState(false);

const deviceId = '1234567890xxxxxx';
// 设备在线状态
const onlineStatus = true;

// 监听属性变化，将 ignoreHideStopPreview 值进行更新还原
const onChangeIgnoreHideStopPreview = (value) => {
    setIgnoreHideStopPreview(value);
};

const onCtx = (ctx) => {
console.log(ctx, 'ctx');
};

const authorizeTest = () => {
    // 最开始设置 ignoreHideStopPreview 为 true
    setIgnoreHideStopPreview(true)
    // 调用获取权限或申请权限接口，业务自行实现，可参考前一篇对讲录制权限文档
    ty.authorize({
        scope: 'xxx',
        success: () => {
        },
        fail: () => {
        }
    })
}


 <IpcPlayer
    objectFit={'contain'}
    onCtx={onCtx}
    devId={deviceId}
    onChangeStreamStatus={onChangeStreamStatus}
    ignoreHideStopPreview
    onChangeIgnoreHideStopPreview={onChangeIgnoreHideStopPreview}
/>

```

### 融合播放器组件

处理方案与轻量播放器组件基本一致。

> 💡 **注意** 融合播放器组件 `@ray-js/ipc-player-integration` 版本需升级到最新版本

示例代码如下

```jsx
import { IPCPlayerIntegration, useCtx } from '@ray-js/ipc-player-integration';
import { useState } from 'react';


const deviceId = '1234567890xxxxxx';

const instance = useCtx({
    devId: deviceId,
});

const [ignoreHideStopPreview, setIgnoreHideStopPreview] = useState(false);

// 监听属性变化，将 ignoreHideStopPreview 值进行更新还原
const onChangeIgnoreHideStopPreview = (value) => {
    setIgnoreHideStopPreview(value);
};

const authorizeTest = () => {
    // 最开始设置 ignoreHideStopPreview 为 true
    setIgnoreHideStopPreview(true)
    // 调用获取权限或申请权限接口，业务自行实现，可参考前一篇对讲录制权限处理方案文档
    ty.authorize({
        scope: 'xxx',
        success: () => {
        },
        fail: () => {
        }
    })
}


 <IPCPlayerIntegration
    instance={instance}
    devId={deviceId}
    style={{
    width: '100%',
    height: '300px'
    }}
    ignoreHideStopPreview
    onChangeIgnoreHideStopPreview={onChangeIgnoreHideStopPreview}
/>

```