Skip to main content

Oryx - 如何用WordPress做直播网站

· 4 分钟

Introduction

如果你已经有了一台 Oryx ,推流后可以用播放器播放直播流, 可以用H5或VLC 播放。

但是如果你想在WordPress网站的文章中,播放HLS、HTTP-FLV或WebRTC直播流,要怎么搞?

在这个文章中,我会给出如何使用WordPress的SrsPlayer插件,来直接播放直播流,做一个直播网站,观众可以观看。

Prerequisites

操作的前提条件是:

  1. 安装下OBS,请在 这里 下载和安装OBS。
  2. 安装和设置完 Oryx
  3. 安装和设置好WordPress,可以用WordPress写文章了,这个麻烦网上搜一搜。很多介绍了。

这个文章中,我们会用your_public_ipv4your_domain_name,代表你的SRS服务器的IP和域名,请替换成你的地址。

Step 1: Download the SRS WordPress Plugin

打开WordPress的后台,点击Plugins > Add New按钮。

搜索插件SRS Player,或者直接打开页面 链接 安装插件。

点击Install Now按钮,安装完成后,点击Activate按钮激活插件。

Step 2: Embed the WordPress Plugin shortcode into your post or page.

从SRS的后台,直接拷贝WordPress的Shortcode,如下图所示:

在WordPress中,创建一个Post或Page。

在Post或Page中,新建一个简码Shortcode,如下图所示。

在搜索框中,输入shortcode,也就是简码,如下图所示。

或者直接在输入框中敲斜杠/,然后按回车键,也可以直接插入,如下图所示。

在Shortcode中,粘贴已经复制的流地址。比如:

  1. HLS [srs_player url="https://your_public_ipv4/live/livestream.m3u8"]
  2. FLV [srs_player url="https://your_public_ipv4/live/livestream.flv"]
  3. WebRTC [srs_player url="webrtc://your_public_ipv4/live/livestream"]

点击Publish按钮,然后访问你的页面。

你的播放器应该在页面上正常播放了。

Note: SRS不需要HTTPS,但是如果你的WordPress网站是HTTPS的,那么就无法播放非HTTPS的流。这时候就必须设置SRS的HTTPS,请参考 如何设置HTTPS

Step 3: Resize the player on your post or page.

播放器默认的大小是视频流的大小,自动检测的,一般可以不用调整。如果你希望设置也可以,可以加一个属性width="your chosen width"就可以。

例如,如果你希望设置为320,那么代码如下:

[srs_player url="https://ip/live/livestream.m3u8" width="320"]

你的播放器的宽会变成320,而高是自动等比调整的。

Step 4: Set up your SRS server as HTTPS (optional)

如果你的WordPress网站是HTTPS的,但是SRS是HTTP,会播放失败。因为HTTPS网站不能访问HTTP资源,这是浏览器安全要求。

请参考如何设置HTTPS,让SRS支持HTTPS的流。

Conclusion

在这个文章中,我们设置了WordPress插件,并且在Post或Page中,实现了直播播放。如果对于SRS有问题,那么可以参考 Wiki 。也欢迎加微信群 这里