discuz X3.4 如何在帖子页面播放mp4和m3u8?

admin

在 Discuz! X3.4 中实现在帖子页面播放 MP4 和 M3U8 视频，主要有以下几种方法：

方法一：使用 HTML5 <video> 标签（推荐，简单易用，但对 M3U8 支持有限）

这是最简单的方法，直接使用 HTML5 的 <video> 标签嵌入视频。对于 MP4 格式，兼容性良好；但对于 M3U8 格式，需要浏览器或插件的支持，部分老旧浏览器可能无法播放。

• 发帖时，切换到“代码”模式。

• 插入以下代码：

  HTML
  
  <video width="640" height="360" controls>  <source src="视频地址.mp4" type="video/mp4">  <source src="视频地址.m3u8" type="application/x-mpegURL">  您的浏览器不支持 HTML5 视频播放。</video>
  
  
  
  • 将 视频地址.mp4 和 视频地址.m3u8 替换为实际的视频文件地址。如果只有一种格式，可以只保留对应的 <source> 标签。
  • width 和 height 属性可以设置视频的宽高。
  • controls 属性添加播放控制条。
  • “您的浏览器不支持 HTML5 视频播放。”是当浏览器不支持 <video> 标签时显示的提示信息。
    

• 保存帖子。

  
  

优点： 简单易用，无需插件。

缺点： 对 M3U8 支持有限，部分浏览器可能无法播放。

方法二：使用第三方视频播放器插件（功能强大，支持多种格式）

市面上有很多 Discuz! 视频播放器插件，例如酷播云端播放器等，它们通常功能更强大，支持更多视频格式，包括 M3U8，并且提供更丰富的播放控制和界面选项。

• 下载并安装插件： 在 Discuz! 应用中心搜索并下载你需要的视频播放器插件。按照插件的安装说明进行安装。

• 配置插件： 安装完成后，在 Discuz! 后台配置插件的相关设置，例如播放器外观、功能等。

• 使用插件： 在发帖时，通常会在编辑器中添加一个视频插入按钮。点击按钮，按照插件的提示填写视频地址和其他参数即可。

  
  

优点： 功能强大，支持多种格式，提供丰富的播放控制和界面选项。

缺点： 需要安装插件，可能存在兼容性问题。

方法三：使用第三方播放器代码嵌入（灵活，但需要一定的 HTML 和 JavaScript 知识）

你可以使用一些成熟的第三方 HTML5 视频播放器，例如 Video.js、DPlayer 等，通过自定义代码的方式嵌入到帖子中。这种方法比较灵活，可以根据需要进行定制，但需要一定的 HTML 和 JavaScript 知识。

• 引入播放器文件： 在 template/你的模板目录/common/header.htm 文件中引入播放器的 CSS 和 JavaScript 文件。例如，使用 DPlayer：

  HTML
  
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/dplayer@latest/dist/DPlayer.min.css"><script src="https://cdn.jsdelivr.net/npm/dplayer@latest/dist/DPlayer.min.js"></script>
  
  
  

  建议使用 CDN 引入，也可以下载到本地服务器。

• 在帖子内容中插入播放器代码： 在发帖时，切换到“代码”模式，插入以下代码：

  HTML
  
  <div id="dplayer"></div><script>  const dp = new DPlayer({    container: document.getElementById('dplayer'),    video: {      url: '视频地址.m3u8', // 或 '视频地址.mp4'      type: 'hls' // 如果是 m3u8，需要指定 type 为 hls    }  });</script>
  
  
  
  • 将 视频地址.m3u8 或 视频地址.mp4 替换为实际的视频文件地址。
  • 如果是 M3U8 格式，需要设置 type 为 hls。
    

• 保存帖子。

  
  

优点： 灵活可定制，可以使用各种高级功能。

缺点： 需要一定的 HTML 和 JavaScript 知识。

关于 M3U8 的补充说明：

M3U8 是一种流媒体格式，它本身并不是视频文件，而是一个索引文件，里面记录了视频分片的地址。要播放 M3U8 视频，需要浏览器或播放器的支持。

• 浏览器支持： 现代浏览器（Chrome、Firefox、Safari 等）通常通过内置的 HLS (HTTP Live Streaming) 支持来播放 M3U8。但部分老旧浏览器可能不支持。
• 播放器支持： 大部分专业的视频播放器都支持 M3U8 播放。
  

总结：

• 如果只是简单地播放 MP4 视频，推荐使用 HTML5 <video> 标签。
• 如果需要播放 M3U8 视频或需要更强大的播放功能，推荐使用第三方视频播放器插件或第三方播放器代码嵌入。
  

在选择方法时，请根据自己的实际情况和技术水平进行选择。建议优先考虑使用插件，方便快捷。如果需要更高级的定制，则可以选择第三方播放器代码嵌入。