前言
在移动端开发中，视频播放是一项非常重要的产品功能之一，而例如直播等场景下，更需要视频的高效流畅播放。而在 React Native 开发中，控制视频播放的库也比较多，而其中 pili-engineering/Pili-SDK-ReactNative 是一款基于七牛云的开源 React Native 视频播放器。但是，由于该库在 iOS 端存在音画不同步的问题，因此笔者在学习该库使用的过程中发现了一个早期的修复库 ceair-reactnative/react-native-pili-fix。
本文将详细介绍如何使用这个修复库，在后面的使用过程中也会讲述这个修复库的原理和好处。
安装与引用
下面我们来看看如何安装该库。
--- ------- --------------------- ------
同时，在 Podfile 中也需要做相应的更改：
--- ----------------------- --- ----
接着，在项目中引用此库：
------ ----------------- ---- ------------------------
使用示例
使用该库和原版 Pili-SDK-ReactNative 的使用方式类似，其中最常用的两个组件是 PLMediaPlayerView 和 PLCameraStreamingView。接下来以 PLMediaPlayerView 为例，讲解如何使用此库进行开发。
------ ----------------- ---- ------------------------
------ ------ - --------- - ---- --------
------ - ----------- ----- ---- - ---- ---------------
------ ------- ----- --- ------- --------- -
-------- -
------ -
----- -------------------------
----- ---------------------------------------------
----- --------------------------
------------------
--------------------------
--------- ---- ------------------------------------------------------------------ --
--
-------
-------
--
-
-
----- ------ - -------------------
---------- -
----- --
----------- ---------
--------------- ---------
--
------ -
--------- ---
------------- ---
----------- -------
--
----------- -
------- ----
------ ----
--
------------ -
----- --
--
---这里仅仅是一个最简单的播放器示例，你可以继续通过 Pili-SDK-ReactNative 提供的各种属性和方法进行开发。
修复原理
在 ceair-reactnative/react-native-pili-fix 的仓库中，作者提到了该库的原理，即其替换了原版 Pili-SDK-ReactNative 的 PlayerManager 类，这个类主要负责视频播放相关的一些底层操作。
--------------- ------------------
- ------------------ -
-- ----- - ------ ------ -
------- - ---------- ------ --------------------
---------------- - -----
----------------------------- - ----
------------------------------- - --
--------------------- - --------------------------
-------- -------------------------
-------- ---------------
-
------ -----
-
------- ---- - ----------------
- --------------------- -------- -------- ------------------------------------- -
-- -------------- -- -------------- ------------------------------------------------------ -
-------------- -----------------------------
-
-
- --------------------- -------- -------- -------------------------- ------- ------- -
-- -------------- -- -------------- ------------------------------------------------------- -
-------------- ------------------------------
-
-
- --------------------- -------- -------- ---------------------------------------------------- -
-- -------------- -- -------------- -------------------------------------------------- -
-------------- -----------------------------------
-
-
----如你所见，在原版 Pili-SDK-ReactNative 中，这个类简单地添加了 delegate、bufferingEnabled 等一些原生 API 的使用。而在修复版中，这个类多了一个 player:currentTime:reason: 方法。这个方法的实现如下：
- --------------------- -------- -------- -------------------------------- --------------------------------------------- -
-- --------------- -- ------ -- -------------------------------------------------------------- -
-- ---------- -- - -- -------------- - ----- - ---- -
------------- -- ----- --- --------- ---- ----- -----------
-------------- --------------------------------------------
------- -------
------- ------
-------
-
--------- - -----
-
---- -
--------- - --
-
-- -------------- -- -------------- ---------------------------------------------------------- -
-------------- ------------- ---------------- ---------------
-
-这个方法的作用就是判断 iOS 版本号是否为 8，如果是则强制定时发送一次左耳声音数据。在运行时里，这个类就可以重新拦截和处理底层操作。
好处与指导意义
在漫长的开发过程中，我们难免会遇到各种奇奇怪怪的问题，而解决这些问题的过程，也常常可以带给我们一些启示。因此，在这里，我们总结一下使用这个修复库的好处和应该引以为戒的地方。
首先，这个库解决了原版 Pili-SDK-ReactNative 在 iOS 端存在的音画不同步问题，因此具有一定的参考和借鉴意义。
其次，这个库虽然是早期的修复方案，但通过阅读其源码，我们也可以学到很多关于 iOS 应用开发的技巧和套路，例如面向对象的编程思想、调试工具的使用、开源类库的使用和拓展、安装、引用和调试库的方式等等。
最后，我们也应该引以为戒，这个库的实现方式比较危险，特别是加入了判断 iOS 版本的操作，在更新版 iOS 等情况下可能存在失效的风险。因此，在开发过程中应引以为戒，同时也应该积极寻找更好的解决方案，并及时优化和迭代原代码。
结语
Pili-SDK-ReactNative 是一个成熟的开源视频播放管理库，但在使用时可能存在一些问题。而 ceair-reactnative/react-native-pili-fix 就是一个早期的解决方案。在使用过程中，我们要始终牢记学习和实践的经验，同时也考虑我们的代码运用等一系列因素。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600559e181e8991b448d76eb