Try Live Demo

There are few use cases that spring to mind thinking about a plugin that has web page recording functionality and the ability to also live stream a web page.

Webinars and Online classes are a popular use case which are usually web based, online classes and need recording to capture any additional activity that’s integrated.

Things like live chat, live data or any other interactive elements that are showing on the web page. Recording the entire web page will be able to capture everything.

Ant Media Server has created a new filter for recording web pages. The Media Push Plugin lets you record and live stream any webpage.

The Media Push Plugin is an open-source project that has been created as a plugin for Ant Media Server and you can find the source code is here.

You may also consider this project as a boilerplate for your own plugins.

To use this plugin, a few REST API endpoints are available to send API requests to start and stop the recording.

In this blog post, we will focus on how it works and how it can be used.

General Information About the Media Push Plugin

The Media Push Plugin allows you to open any website and immediately begin live streaming the entire page, including its audio.

You have the option to watch the stream in real-time or conveniently record it using either the MP4 or WebM protocol.

Additionally, you can also simulcast it to social media platforms or any other platform that can receive RTMP.

Prerequisites

  • Ant Media Server Enterprise Edition v2.6.0+
  • Google Chrome 108

How to install

Step1: Download the war file

Download the pre-built media-push-plugin.jar file that needs to be uploaded and installed in your Ant Media Server.

You can use the following command to fetch the file:

wget https://github.com/ant-media/Plugins/raw/master/MediaPushPlugin/build/media-push-plugin.jar

Step 2: Install the Plugin

Copy the media-push-plugin.jar file to the plugins directory under /usr/local/antmedia

sudo cp media-push-plugin.jar /usr/local/antmedia/plugins

Step 3: Restart the Server

Restart the Ant Media Server by running the following command:

sudo service antmedia restart

Media Push Plugin API Endpoints

The plugin is controlled using REST API methods. Such as starting and stopping the media push plugin.

Start

  • Type:
    • POST
  • URL:
    • SERVER_URL/APP_NAME/rest/v1/media-push/start
  • Query Parameters:
    • streamId: id of stream you wanted to publish.
  • JSON Parameters:
    • url: url of the website you wanted to publish.

cURL example:

curl -i -X POST -H "Accept: Application/json" -H "Content-Type: application/json" "http://localhost:5080/WebRTCAppEE/rest/v1/media-push/start?streamId=your-streamid" -d '{"url": "https://example.com", "width": 1280, "height": 720}'

Stop

  • Type:
    • POST
  • URL:
    • SERVER_URL/APP_NAME/rest/v1/media-push/stop/{streamId}

cURL example:

curl -i -X POST -H "Accept: Application/json" "http://localhost:5080/WebRTCAppEE/rest/v1/media-push/stop/{streamId}"

Getting Support

If you experience any difficulty or discover any errors or bugs with web page recording using this plugin, then please open an issue at Github.

You can also find more Ant Media Server plugins in this repository, including the Zixi and Tensorflow plugins as well as our sample plugin that can be use to get started building your own.

Also check out the Ant Media marketplace that is now offering plugins and applications to extend your Ant Media Server.


Mustafa Boleken

Mustafa is a Software Developer at Ant Media. His passion is developing apps that make life easier. Mustafa is proficient in Java, Angular, AWS and Linux. His technical stack includes WebRTC, Typescript, Python, Kubernetes, Docker, SQL, NoSQL, MongoDB, MapDB, Grafana, Swagger, Open API, AWS S3, AWS Autoscaling, AWS Load Balancing, FFmpeg, HLS, RTMP, Node.js, JSON, Git/Github, Tomcat, Nginx, HAProxy, Firebase Cloud Functions, Test Automation, STUN/TURN Server, Bash scripts, and Active Campaign/Freshdesk integrations, HTML, CSS, JavaScript, JWT.