33

共有/いいねされたときにFacebookで適切にスクレイピングできるページを設定しようとしています。このページには YouTube ビデオが関連付けられているので、og:video タグの content 属性に、YouTube ビデオの埋め込みリンクまたは実際の YouTube ページのリンクを配置して、小さな「プレビュー」ボタンで Facebook に表示する必要があります。 Facebookでビデオを再生しますか？

誰かが助けてくれることを願っています! ありがとう！

4

6 に答える 6

39

2 つのオプションがあります。og:videoをhttps://www.youtube.com/v/YOUTUBECODEに設定するかog:url、YouTube ページに設定することができます。

私の例では、このビデオhttps://www.youtube.com/v/BQBjVr1iHH4を​​次のページに埋め込んでいますhttps://www.keithandthegirl.com/vip/bonus/episode/9/40/this-is -40 . 誰かが私のページを Facebook で共有するたびに、Facebook が YouTube ビデオを表示するようにしたいと思います。

オプション 1:og:videoをhttps://www.youtube.com/v/YOUTUBECODEに設定する

メタタグは次のようになります

<meta property='og:video' content='https://www.youtube.com/v/BQBjVr1iHH4' />

YouTube の URL の構造が一般的な URL とは異なることに注意してください。「v」クエリを YouTube リンクから分離し、上記のog:videoリンク形式で使用する必要があります。私の例では、 の値はvですBQBjVr1iHH4。

オプション 2:og:urlを YouTube ページに設定します。

vコードを分離できない場合は、og:urlタグを YouTube ページに設定できます。私の例では、次のようになります。

<meta property='og:url' content='https://www.youtube.com/watch?v=BQBjVr1iHH4' />

これにより、Facebook はhttps://www.youtube.com/watch?v=BQBjVr1iHH4から Open Graph タグを取得し、それを埋め込みで使用するようになります。つまり、説明とタイトルは YouTube ページから取得されます。ただし、誰かがリンクをクリックすると、あなたの Web サイトに移動します。

私の例では、2 番目のオプションhttps://www.keithandthegirl.com/vip/bonus/episode/9/40/this-is-40を使用しているときに誰かが次のリンクを貼り付けると、Facebook には URL が YouTube に設定されていることが表示されます。その YouTube リンクに OG 情報を問い合わせます。https://www.keithandthegirl.com/vip/bonus/episode/9/40/this-is-40へのリンクをクリックすることを除いて、すべてが YouTube のように見えます。

もう 1 つの注意: httpではなく、必ずhttpsを使用してください。Facebook は安全でない動画をサイトに埋め込むことはありません。

于 2013-07-23T13:11:04.543 に答える
14

これが私が見つけたものです：

FacebookのOpenGraphProtocolを使用すると、URLが <head>HTMLのメタデータを正しくフォーマットしている限り、パブリッシャーは任意のURLの任意のビデオを使用できるようになります。これが：にあるべき情報のリストです<head>：

  • サムネイル画像のURL：

    <meta property="og:image" content="image_src URL">

  • SWF URL：

    <meta property="og:video" content="video_src URL">

  • ページのURL：

    <meta property="og:url" content="URL">

  • タイトル：

    <meta property="og:title" content="title">

  • 説明：

    <meta property="og:description" content="description">

  • ビデオピクセル幅：

    <meta property="og:video:width" content="video_width">

  • ビデオピクセルの高さ：

    <meta property="og:video:height" content="name="video_height">

  • コンテンツタイプ：

    <meta property="og:type" content="video">
于 2012-12-14T00:45:58.303 に答える
10

YouTubeページのソースコードからわかるように、og:videoタグは次の形式です

<meta property="og:video" content="http://www.youtube.com/v/k86xpd26M2g">

また、次のURLのソースコードで簡略化されたYouTubeから使用されるメタデータの例を見ることができます：http：//fb.stevelarsen.co.uk/example.html

Open Graphプロトコルの詳細については、http：//ogp.me/を参照してください。

于 2012-01-23T15:40:29.967 に答える
5 
<html xmlns:og="http://ogp.me/ns#"> 
    <head>
        <!-- ... -->
        <!-- [REQUIRED TAGS] -->
        <meta property="og:video" content="http://example.com/awesome.flv" />
        <meta property="og:video:height" content="640" />
        <meta property="og:video:width" content="385" />
        <meta property="og:video:type" content="application/x-shockwave-flash" />
        ...
    </head>

.flv ファイルのリンク.... https://developers.facebook.com/docs/opengraph/#typesを確認してください

于 2011-04-12T16:24:40.093 に答える
0

Facebook が提供するデバッガーにつまずいた人は、次の点に注意してください。

デバッガーにログインすると、https セッションにいます。デバッグでビデオを表示するには、ビデオの安全な URL をメタに追加する必要があります。YouTube ビデオの追加は簡単です。ページの URL を og:url に入れるだけで機能します。

この結論に至るまでに費やした時間。遅すぎる 疲れすぎてもう寝たい :)

于 2014-05-09T17:26:31.087 に答える
-4

私はそれを考え出した。Collegehumor.comがどのように機能するかを調べたところ、FacebookAPIに記載されていないものがたくさん含まれています。次だけではなく：

<meta name="og:video" content="whatever"></meta>
<meta name="video_style" content="whatever"></meta>
<meta name="video_height" content="whatever"></meta>
<meta name="video_width" content="whatever"></meta>

あなたも必要であり、それも持っているのlink rel="video_src"に役立ちます-どちらがそれをしたのか完全にはわかりませんが、あなたはそこに行きます。それはうまくいきます:)videothumbnailog:image

于 2010-10-04T14:16:10.520 に答える