Question

如果您在Discord中链接YouTube视频，则会在不和谐时显示为播放器视频，而不仅仅是链接。使用我的视频，如果我从我的网站链接它们，则不一致将它们显示为链接而不是视频。我听说我需要嵌入链接，但我不知道我在寻找什么，或者如何制作或添加这些链接。任何人都能帮助我吗？这是我目前的视频代码：

＆＃13;

<video poster="Images/logo.jpg" controls controlsList="nodownload noaudio" preload="none">
            <source src="videos/logo.mp4" type="video/mp4"> Your browser does not support the video tag.
        </video>

＆＃13;

Answer 1

你只需发布一个像这样的YouTube网址

https://www.youtube.com/watch?v=kNpczxZLXo8

在https://discordapp.com/的聊天中。一段时间后，聊天窗口会显示来自youtube的嵌入式视频。

这意味着他们对youtube链接有特殊支持，并且只要他们没有明确提供对其他网站执行相同操作的方法，您就没有机会重新创建相同的功能。

我看到的选项是：与discordapp.com的支持人员联系或将您的内容上传到youtube。

[编辑] 联系支持后，我们现在知道他们确实明确支持第三方嵌入视频和图像。

https://discordapp.com/支持的回答很快就出现了：

我们会查找Facebook开放图表标签，Twitter的卡片标签，或者提供更多信息：

https://developers.facebook.com/docs/sharing/webmasters#markup

Facebook Opengraph示例： 将该链接粘贴到聊天窗口中：

http://harry.x-dream-media.com/opengraph2.html

opengraph2.html代码：

   <!DOCTYPE html>
       <html>
       <meta property="og:type" content="article">
       <meta property="og:url" content="http://harry.x-dream-media.com/index.jsp">
       <meta property="fb:app_id" content="217926898242066">
       <meta property="og:video" content="http://harry.x-dream-media.com/test.m4v" />
       <meta property="og:video:width" content="640" />
       <meta property="og:video:height" content="426" />
       <meta property="og:video:type" content="application/mp4" />
       <meta property="og:video" content="http://harry.x-dream-media.com/test.m4v" />
       <meta property="og:video:type" content="video/mp4" />
       <meta property="og:video" content="http://harry.x-dream-media.com/test.m4v" />
       <meta property="og:video:type" content="text/html" />
       <meta property="og:title" content="title text">
       <meta property="og:image" content="http://harry.x-dream-media.com/test.png"/>
       <meta property="og:description"  content="description text"/>
       <meta property="og:site_name" content="site name text">

       <body>


       <style type="text/css">

       video {

          width:100%;

          max-width:600px;

          height:auto;

       }

       </style>


       <video width="100%" src="http://harry.x-dream-media.com/test.m4v" controls>

        Your browser does not support video

       </video>


       </body>

       </html>

https://dev.twitter.com/cards/markup

Twitter示例：http://harry.x-dream-media.com/twitter.html?random=123

twitter.html代码：

<!DOCTYPE html>

<html>

<head>
    <meta content='text/html; charset=UTF-8' http-equiv='Content-Type' />
    <meta name="twitter:card" content="player" />
    <meta name="twitter:site" content="@harry" />
    <meta name="twitter:title" content="CUSTOM CONTENT" />
    <meta name="twitter:description" content="Custom Descriptions can be lengthy" />
    <meta name="twitter:image" content="https://peach.blender.org/wp-content/uploads/bbb-splash.png?x11217" />
    <meta name="twitter:player" content="https://download.blender.org/peach/bigbuckbunny_movies/BigBuckBunny_320x180.mp4" />
    <meta name="twitter:player:width" content="320" />
    <meta name="twitter:player:height" content="180" />
    <meta name="twitter:player:stream" content="https://download.blender.org/peach/bigbuckbunny_movies/BigBuckBunny_320x180.mp4" />
    <meta name="twitter:player:stream:content_type" content="video/mp4" />
</head>
<!DOCTYPE html>
<html>
<body>
<style type="text/css">
video {
   width:100%;
   max-width:600px;
   height:auto;
}
</style>
<body>
<video width="100%" controls>
  <source src="http://harry.x-dream-media.com/test.m4v" type="video/mp4">
Your browser does not support video
</video>
</body>
</html>

http://oembed.com/#section2

Oembed示例： http://harry.x-dream-media.com/oembed.html?random=123

敬请关注......

如何向html 5视频添加嵌入式链接

1 个答案: