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

2023-12-22

如果您在 Discord 中链接 YouTube 视频,它会在 Discord 上显示为可播放的视频,而不仅仅是链接。对于我的视频,如果我从我的网站链接它们,不和谐会将它们显示为链接而不是视频。我听说我需要在其中嵌入链接,但我不知道我在寻找什么,也不知道如何制作或添加这些链接。有人能帮助我吗?这是我当前的视频代码:

<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>

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

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

在聊天中https://discordapp.com/ https://discordapp.com/。一段时间后,聊天窗口会出现来自 YouTube 的嵌入视频。

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

我为您看到的选项是:与 Discordapp.com 的支持人员交谈或将您的内容上传到 YouTube。

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

答案来自https://discordapp.com/ https://discordapp.com/支持来得很快而且很到位:

我们寻找 Facebook 开放图标签、Twitter 卡片标签或嵌入更多信息:

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

Facebook Opengraph 示例:

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 https://dev.twitter.com/cards/markup

推特示例:

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 http://oembed.com/#section2
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何向 html 5 视频添加嵌入链接 的相关文章

  • 如何在不知道id的情况下从内页获取父iframe元素?

    让我们想象一下我有这样的东西 div div test html 是空页面 自定义hash属性始终具有不同的值 出于安全原因两个页面位于同一域 iframe 元素的数量和顺序是随机的 我的问
  • Bootstrap 的跨浏览器数字微调器/步进器 [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我正在寻找一个与 Twitter Bootstrap 2 3 集成的数字微调器 使用 HTML5input type number
  • 如何对基于 HTML5-JavaScript 的视频播放器进行快照?

    实际上 我有一个带有 JavaScript 函数的 HTML5 页面 可以让我播放 wmv 视频文件 我需要在视频播放时 有暂停或没有暂停 拍摄快照并以任何图像格式 JPG 或 BMP 保存 任何帮助将不胜感激 谢谢
  • 如何使用 HTML5 在画布上绘制心电图监视器?

    我尝试使用canvas html5绘制心电图系统 几乎我即将完成我的波浪正在移动 但不是连续地重复 但我想绘制波浪是从左到右连续移动的 下面的链接是示例 Ex https www youtube com watch v wuwBfSpVEg
  • JavaFX:在 WebView img 标签中未加载本地图像

    以下是我的代码 一切安好 我可以加载远程页面 我可以放置 HTML 内容 但我的img标签显示一个X标志表示无法加载图像 Note 我的图像与类位于同一个包中JavaFX在 Smiley 文件夹中 我可以列出所有图像 这意味着路径没有问题
  • 在 jQuery 中获取最接近元素的形式

    我编写了这个 js jquery 脚本来检查表单中的所有复选框 它工作得很好 但是这会检查页面上的所有复选框 无论它们是什么表单包装器 这是函数 function toggleCheck state var checkboxes jQuer
  • 居中时仅在文本的最后一行下划线

    我只想在某些文本的最后一行下划线 当文本换行到更多行时 仍然只有最后一行需要加下划线 我找到了这个解决方案 https stackoverflow com questions 15180827 advanced css challenge
  • 全面的 html5 音频 API

    对于我的一生 我找不到所有 html5 的完整列表
  • 将较新版本的 WebKit 嵌入 Android 应用程序

    我正在使用 Web 技术开发 Android 应用程序 CSS 转换 对于应用程序的功能非常重要 因为它们负责滚动和滑动页面 非常缓慢 根据互联网上找到的信息 CSS 过渡不是硬件加速的 除非进行 3 维转换 我发现很多文章说我应该放置 w
  • 删除 之后的文本并附加其他文本

    我在 jQuery 尝试删除 标记后的文本以附加其他文本时遇到问题 Example div span i class fa fa square o i span text here this text needs to be removed
  • 使用 Java 访问 HTML5 本地存储

    是否可以直接使用Java访问localstorage对象 如果是的话怎么办 更新 我知道 localstorage 是客户端 java 是服务器端 但我在网上读到 GWT 有 api 允许读取 localstorage 本地存储 顾名思义
  • 使用 PHP 将 class="active" 添加到活动页面

    动态标头 CSS 类更改为活动使用 PHP 目录 我想要的班级 li 在活动目录下更改标签 现在 每个指南都向我展示了当您的页面等于它时如何执行此操作 但我想更改 这 li li 取决于我所在的目录 例如 如果说我在 http exampl
  • 动态表中每个按钮的 Jquery-Ui 对话框表单

    我正在生成一个 HTML 表 每行都有一个按钮 必须打开 Jquery ui 对话框表单 The table table class table table reporting table condensed table striped t
  • 单击输入字段会触发窗口调整大小

    我有一个带有徽标 菜单和搜索的标题 当我在桌面上时 我会按该顺序显示所有元素 但如果我的窗口宽度小于 980 像素 菜单会隐藏 有一个切换按钮 并且徽标会与nav并附在徽标之后 如果宽度更大 则徽标将再次分离并附加到 DOM 中的旧位置 w
  • 如何在 div 容器内的元素之间留出空间

    我有一个弹性容器 它将由元素动态填充 容器没有固定宽度 I use max width max content 并且可以包含我想要的任意数量的元素 问题是我需要这些元素之间的间距 但不需要元素和容器之间左侧和右侧的间距 当然我可以用 ele
  • 从网站存储数据的最简单方法(在服务器端)

    我有一个非常简单的网站 实际上是单页 有一个输入字段和一个按钮 我需要将用户提交的数据存储在服务器端的某个位置 完美的方法可能是简单的文本文件 并在每次单击按钮后附加新行 日志文件也可以 据我了解 JavaScript 本身是不可能的 我在
  • 显示班级图片 10 秒

    我有下面给出的代码显示9 boxes 其值如下digital time 还有一个班级box002显示digits相当于随机选择的九个盒子的值 box002 can be dragged to digital time starting wi
  • 数字和小数的输入掩码

    在测试我的程序后 我发现了以下错误 我在 sqlserver 中的表包含 价格数字 6 2 我的程序的用户输入价格 555 00 就很好了 但是当他输入 555555 时 这是错误的 所以我需要指定掩码 其中尾数是可选的 0 到 999 小
  • 随机定位的 div,不重叠

    所有 div 都像我需要的那样 随机 放置 但它们偶尔会重叠 这只是一个机会问题 我怎样才能防止这种情况发生 理想情况下我能够设置它们之间的最小距离 我可以通过进一步开发当前的 javascript 来实现这一目标吗 我需要考虑完全不同的方
  • 响应式导航栏隐藏其下方的元素

    我创建了一个响应式导航栏 但它使下面的元素 Flexslider 插件 消失 在我制作导航栏之前 下面的 Flexslider 可以正常显示 但现在不行 导航栏的 z index 为 2 所以我不知道问题是什么 我应该如何 更改什么才能允许

随机推荐

  • 如何根据过滤后的数据创建笛卡尔积范围?

    我正在尝试从较小的范围中创建笛卡尔积范围 我想ranges v3 view cartesian product会起作用 但不知何故它不起作用 如果我尝试直接使用容器创建笛卡尔积 我没有问题 编译如下 include
  • ansible 根据属性合并两个列表

    我在我的剧本中扮演一个角色 使用 set fact 生成两个列表 这两个事实用于不同的任务 然后我需要将它们合并以完成最终任务 list1 name alice roles role1 role2 name bob roles role1
  • 将不可序列化的类转换为字节数组

    我有一个场景 我正在多个非常不同的系统之间同步数据 数据本身相似 但不同系统上的表具有完全不同的格式 为了协助这种同步 我有一个数据库表 它存储来自每个系统的对象哈希以及项目键和其他相关信息 当任一系统中的对象的哈希发生更改时 我会更新另一
  • iOS 6 自动旋转问题-supportedInterfaceOrientations 返回值不受尊重

    我有一个应用程序 其中我有一个UINavigationController子类作为我的rootViewController 我有一个UITableViewController允许用户编辑一些设置 它应该始终处于纵向模式 将 MoviePla
  • 如何从 e.target.name 更新状态中的对象

    我正在尝试从这样的表单输入数据 h1 Company Position h1
  • 对数刻度(x 轴)直方图

    我需要的是 X 轴以对数刻度显示的直方图 但是 我仍然希望直方图中的每个条形都具有相同的宽度 不管怎样 我想出了 或发现 具有较高值的 显示条与较窄的显示条 它们在普通比例上具有相同的宽度 而不是在对数比例上 这是我现在正在做的事情 edg
  • Python c-api 和 unicode 字符串

    我需要在 python 对象和各种编码的 c 字符串之间进行转换 使用 PyUnicode Decode 从 C 字符串到 unicode 对象相当简单 但是我不知道如何走另一条路 char can be a wchar t or any
  • 基于 Rails 中每个下拉菜单的嵌套下拉框和多选框?

    我有一个要求 但如何开始有点困难 我寻求一些帮助 我有三个表 即服装 类别和材料 考虑服装表包含 男装 童装 我有一个页面来添加服装 在添加服装时 我需要一个下拉菜单 其中应列出类别 选择类别后 属于所选类别的材料应出现在多选框中 我们可以
  • angular-cli如何添加全局样式?

    我使用 Sass 创建了一个全局样式表并将其放在public style styles scss 我只指定背景颜色 在索引中 我添加了一个链接 背景颜色不适用于 body 标记 检查正文标签后 我可以看到背景颜色已应用但被否决scaffol
  • 如何在面板中的另一个 WPF 窗口内加载 WPF (xaml) 窗口?

    这可能吗 我使用了 Frame 控件并且 显示 例如 showwindow xaml 但我收到这个错误 根元素对于导航无效 确保您可以使用以下方式导航 显示 窗口 YourFrame Navigate YourWindow 然而 我不太喜欢
  • 如何使用张量板制作散点图-tensorflow

    现在 我正在研究张量流 但是 我无法使用张量板绘制点图 如果我有训练样本数据 就像那样 train X numpy asarray 3 3 4 4 5 5 6 71 6 93 4 168 9 779 train Y numpy asarra
  • jQuery - 如何按属性名称开头选择值

    我想通过给出属性名称 仅开头 来选择属性值 例如 如果我们有 html 标签 div class slide div 我想从属性中选择以以下开头的值data 先谢谢您的帮助 如果您想要所有 data 属性 您可以迭代 jq 数据对象 sli
  • 如何使用图像作为提交按钮?

    有人可以帮助更改此设置以合并名为的图像BUTTON1 JPG而不是标准submit button
  • python中编译的正则表达式对象的类型

    python中编译后的正则表达式是什么类型 我特别想评价一下 isinstance re compile 是真实的 出于内省的目的 我的一个解决方案是 有一些全局常量REGEX TYPE type re compile 但看起来不太优雅 E
  • 使用 int 与 Integer

    我遇到一个类 它使用整数变量来捕获要在 for 循环中使用的大小 这是好的做法还是我们应该使用 int 原始数据类型 Integer size something getFields size for Integer j 0 j lt si
  • 将自定义对象的数据绑定到MvvmCross中的TextView

    I have one custom object in my ViewModel I want to bind only one of its member to textview in my droid view 我只想将该对象的字符串成
  • jQuery 显示一个 Div 并隐藏其他 Div

    http jsfiddle net yrM3H 2 http jsfiddle net yrM3H 2 我有以下代码 jQuery document ready function jQuery toggle next hidden hide
  • 检查变量是否已设置然后回显而不重复?

    是否有一种简洁的方法来检查变量是否已设置 然后回显它而不重复相同的变量名称 而不是这个 我正在考虑这个 C 风格伪代码中的一些内容 PHP has sprintf http www php net manual en function sp
  • 如何更改@NotNull注释对应返回的响应JSON

    我有一个简单的代码 当 RequestBody 中不存在 customerId 时 它返回错误 json VO 类 public class OrderVO private int orderId NotNull message Custo
  • 如何向 html 5 视频添加嵌入链接

    如果您在 Discord 中链接 YouTube 视频 它会在 Discord 上显示为可播放的视频 而不仅仅是链接 对于我的视频 如果我从我的网站链接它们 不和谐会将它们显示为链接而不是视频 我听说我需要在其中嵌入链接 但我不知道我在寻找