在反应本地应用中嵌入facebook视频 [英] Embedding facebook video in react-native app

问题描述

是否可以在反应性原始应用程序中嵌入来自公开帖子的Facebook视频？

Is it possible to embed a Facebook video from a public post in a react-native app?

如果可能，我相信我需要使用一个< WebView> 组件，这是我用于其他几种视频嵌入的组件，但是Facebook嵌入是不同的。我们已经在我们的网络客户端实现了这一点，但有一些DOM特定的方面，我不知道如何在 react-native 中重新创建。

If it is possible, I believe I need to use a <WebView> component which is what I have used for several other types of video embeds, but the Facebook embed is different. We have achieved it on our web client, but there are some DOM specific aspects to it that I'm not sure how to recreate in react-native.

这是我为其他视频类型（例如Vine，Vimeo）成功使用的解决方案，但对于FB，它只是渲染图像

This is the solution I have used successfully for other video types (e.g. Vine, Vimeo), but for FB it just renders an image

<WebView source={{ uri: 'https://www.facebook.com/TheWitBible/videos/1747642252158297/' }} style={ styles.media } />

这是文档 https://developers.facebook.com/docs/plugins/embedded-video-player

这是一个FB SDK组件，但我不认为它支持这种用例
https://github.com/facebook/react-native-fbsdk

Here is a FB SDK component, but I don't think it supports this use case https://github.com/facebook/react-native-fbsdk

在Web客户端中有两个部分可以让它工作： p>

In the web client there are 2 parts to get it to work

<script>
  window.fbAsyncInit = function() {
    FB.init({
      xfbml: true,
      version: 'v2.6'
    });
  };
  (function(d, s, id){
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));
</script>

..................... .......

............................

render() {
    return (
      <div ref={el => el && FB && FB.XFBML.parse(el)} className="fb-media-wrapper" style={{ width: this.props.width + 'px' }}>
        <div className="fb-video" data-href={this.props.url} data-width={this.props.width}></div>
      </div>
    );
  }

推荐答案

我的意思是这个工作完全正常对于我

I mean this worked totally fine for me

<WebView style={{width:350,height:null}} 
 source={{ uri: 'https://www.facebook.com/chris.phillips.56027281/videos/vb.100003747765310/914766415324942?type=2&theater'}}  />

这篇关于在反应本地应用中嵌入facebook视频的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！