react nativeでのiframeに変わる動画を表示するタグ。

Question

youtube動画などを表示させようと、iframeでやろうとしたら、
react nativeは対応していないのですね。。。

困ってライブラリを調べてみたら、react-native-youtubeなどを見つけましたが、
これはRCTYoutubeというのがないというエラーで動きません。、
多分ライブラリ内の設定がうまくいっていないので使えなかったのです。

動画の埋め込みの際、便利なコンポーネントがあったら、教えてください！
videoIDもしくはUrlでの指定が可能なものが良いです。

Answer 1

https://github.com/inProgress-team/react-native-youtube#installation

インストール後に react-native link するとビルド成功するはずです

Comments

[MOTOMUR]

react-native linkの代わりにrnpm linkを使用しています。
そのライブラリではrnpm linkは対応していないのでしょうか？

また、対応していない場合react-native linkをしないといけないと思うのですが、自分の開発環境ではうまく動作しないので、もしよければ詳しく教えていただけると助かります。

[januswel]

> IMPORTANT! (iOS Only): To link assets/YTPlayerView-iframe-player.html to your project, react-native link is not enough (As of RN ~0.37 - ~0.45). You will need to also use the older tool it is based on, rnpm (This step must be done after react-native link):

React Native の特定バージョンでは rnpm を使いなさい、と書いてありますね。
最近のバージョンになって rnpm が react-native link として取り込まれたので、 0.46.0 以降は react-native link を使うとよいでしょう

うまく動作しないというのがちょっとわからないですが、ビルドできないということですか ?

[MOTOMUR]

このようなログが表示されてしまって、できなくなってしまいます。

Scanning folders for symlinks in /Users/owner/works/CoMLle/iOS/node_modules (11ms)

`react-native link` can not be used in Create React Native App projects. If you need to include a library that relies on custom native code, you might have to eject first. See https://github.com/react-community/create-react-native-app/blob/master/EJECTING.md for more information.

[MOTOMUR]

今から別のランチャーを入れるにしても競合とかでビルドできなくなるのが嫌で、身動きが取れない状態です。

[januswel]

あ、 create-react-native-app 経由なんですね
そうなると eject しない限りネイティブコードを使ったライブラリーは使うことができません
WebView で該当動画の URL を表示するという手はありますが、 Android でフルスクリーンモードになれないなどの制限がつきます

https://github.com/facebook/react-native/issues/6405

eject は大変ですが、仕様と相談して検討してみてください

[MOTOMUR]

なるほど。わかりました。
webviewを使用して、検討してみます！回答ありがとうございました！