DEV Community: Shih-Yu Hwang

Export to IPFS with Livepeer Video Services

Shih-Yu Hwang — Mon, 02 May 2022 22:04:32 +0000

Where to store NFTs (non-fungible tokens) is just as important as what type of NFTs to create. In the process of making them, storage is an essential part of it as it allows the NFTs to be preserved.

IPFS, short for Interplanetary File System, has been around for a while, which means its network has had time to mature and be reliable. Their protocol is used by the majority of projects that utilize decentralized storage, including NFTs. By exporting assets to IPFS, not only will they generate a unique fingerprint called content identifier (CID) for the NFTs, but also this data will be preserved due to the support of their community for maintaining and expanding their decentralized ecosystem.

Livepeer Video Services makes the process of exporting to IPFS easy by using the Video on Demand (VoD) API. With a simple step, assets that get uploaded to Livepeer Video Services will have the option to be exported to IPFS. Once the asset has been exported they are ready to be minted. This reduces the process of transcoding the assets and then taking that transcoded asset from Livepeer VIdeo Services and then using IPFS.

In this tutorial, we will look at the ease of using the VoD API to upload assets to LVS and then export them to IPFS.

Access to a free Postman and Livepeer Video Services account is required. Visit How to make API calls with Postman and LVS tutorial for instructions on getting set up.

Step 1

There are two ways to provide Livepeer with assets for VoD, either importing or uploading the asset. The following steps address how to implement both.

Step 1A: Import an asset

To import an asset from an external URL, select the POST option and paste in Livepeer's base URL for importing an asset https://livepeer.com/api/asset/import

Then underneath the URL, click on the Authorization tab, and select Bearer Token as the type
Copy and paste your API key from Livepeer Video Services

Select the Body tab and underneath it select the **raw **radio button
Click the Text drop-down menu and select the JSON option
In the text box field below, paste the following code which is from the API reference. You can change the name to whatever you want as this is for the name of your stream and the URL is the URL file of your asset

{
"url": "https://www.pexels.com/video/5613843/download/",
"name": "JellyFish"
}

Click the code icon < > on the right side menu to confirm the format is the same as the cURL example in the API reference

Now click the Send button and you should receive a confirmation that it went through with a 201 status

Step 1B: Upload an asset

This is a two-step process that allows the user to provide the asset by directly uploading to Livepeer Video Services.

Step 1B-1 - Create URL for direct upload

Select the POST option and paste in Livepeer Video Services' URL for importing an asset https://livepeer.com/api/asset/request-upload
Then underneath the URL, click on the Authorization tab, and select Bearer Token as the type
Copy and paste your API key from Livepeer Video Services

In the text box field below, paste the following code which is from the API Reference. You can change the name to whatever you want as this is for the name of your stream.

{ "name": "JellyFish" }

Click the code icon < > on the right side menu to confirm the format is the same as the cURL example in the API reference

Click the blue send button and you should get back a 200 status with the response including the parameters of the stream

Now that the URL for direct upload is created, time to upload the content.
Copy the **URL* and the ID of the asset/task from the response for the next part.

Step 1B-2 - Upload the contents

Replace POST with PUT and insert the URL from the response in the previous step. It should look similar to the following:

https://origin.livepeer.com/api/asset/upload
/eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9
.eyJwcmVzaWduZWRVcmwiOiJodHRwczovL3N0b3JhZ2UuZ29vZ2xlYXBpcy5jb20vbHAtdXMtd
m9kLWNvbS9kaXJlY3RVcGxvYWQvZWIyMG01cDdqd3d1bDZ3OS9zb3VyY2U_WC1BbXotQWxnb3J
pdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ29udGVudC1TaGEyNTY9VU5TSUdORUQtUEFZT
E9BRCZYLUFtei1DcmVkZW50aWFsPUdPT0cxRVlVTldOVjZSWUlLNTQySFdBM1JMN1JCN0pVT0V
RM1lMMjNRWUI2Q0hQRzVITzJRQzMzTUpWVVklMkYyMDIyMDQyMSUyRnVzJTJGczMlMkZhd3M0X
3JlcXVlc3QmWC1BbXotRGF0ZT0yMDIyMDQyMVQxNDM1NTNaJlgtQW16LUV4cGlyZXM9OTAwJlg
tQW16LVNpZ25hdHVyZT1iZGZhOGNlYWVkNDg2YWIyMzYyZmJkMzA0MGRlNjA4MjM0ZmQ0YWU0O
DIyYTE4NzBmMzhiZTRiMDFiZmZhZWE1JlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCZ4LWlkPVB
1dE9iamVjdCIsImF1ZCI6Imh0dHBzOi8vbGl2ZXBlZXIuY29tIiwiaWF0IjoxNjUwNTUxNzUzf
Q.ujURa40V95ETrUrjYi4Ho5vD3g5–5l_5o0kJfJNUMiA

Select the Headers tab and for the Key select Content-Type and the Value select video/mp4

Under the body tab, select the binary radio button
Then select the video file you want to upload

*Notice that we only support mp4 files encoded with H264 video and AAC audio for now. If you are unsure about these, try sending the file anyway and check any returned errors!

Click the code icon < > on the right side menu to confirm the format is the same as the cURL example in the API reference

Click the blue send button and you should get back a 200 status with the response including the parameters of the stream

Step 2: Retrieve an asset

We need to check to make sure that the asset is ready before exporting it since it can take some time to upload.

For the asset ID here, use the asset.id field in the response to the Import or Request Upload requests above.

Retrieve an individual asset, select GET option, and then paste in Livepeer's URL for retrieving an asset https://livepeer.com/api/asset/:assetId
In the params tab, paste in the asset ID in the Value column associated with the Key: assetId

Make sure the Body tag has the none radio button selected
Click the blue send button and you should get back a 200 status with the response including a list of the assets
Look for the status in the response body, it should return status:"ready". If it is status:"waiting", then wait a little longer and repeat this step until the status is ready before moving to the exporting step.

Step 3: Export to IPFS

Select the **POST **option and paste in Livepeer's URL for exporting an asset to IPFS https://livepeer.com/api/asset/$ASSET_ID/export

The *$ASSET_ID** is located in the response body from step 1A or 1B depending on the method you chose.

Make sure the Body tag has the raw radio button selected and the JSON format is selected from the drop-down menu on the right
In the text box field below, paste the following code from the Livepeer's VoD API Reference

{ "ipfs": { } }

Click the code icon < > on the right side menu to confirm the format is the same as the cURL example in the API reference

Click the blue send button and you should get back a 201 status with the response showing the task has been created with the type export

*IPFS is a complex protocol and so the export task can take a while. Expect this to take a bit longer than the import task

Copy the **ID* of the task from the response for the next part.

Step 4 Retrieve a task

For the task ID here, use the task.id field in the response of the Export request above.

Select the GET option and paste in Livepeer's URL for retrieving a specific task with the task id https://livepeer.com/api/task/:taskId
In the params tab, paste in the task ID in the Value column associated with the Key: taskId

Make sure the Body tag has the none radio button selected
Click the blue send button and you should get back a 200 status with the response including the specific task requested

Getting the CID

IPFS locates the content based on what is inside of it rather than by the location, CID is what allows it to do this.

To Get the CID and metadata URL for the asset that was just exported, you can get it by retrieving the task above until it is finished (check the status field in the response). That finished task will have an output with all the information about that asset, and the CID information is located under the output.export.ipfs path.

See the image below:

As you can see here, information such as the video file's CID, location of the URL on IPFS, and other metadata information.

Conclusion

With the ability to upload assets and export them to IPFS easily with Livepeer Video Services' VoD API, those assets can now be stored in decentralized storage and be accessible.
Start creating your own VoD Dapps and store them in decentralized storage.

Take it to the next level by minting video NFTs using Livepeer Video Services video NFT SDK.

Mint Video NFTs

How to mint a video NFT using Livepeer Video Services + Polygon

Shih-Yu Hwang — Mon, 11 Apr 2022 22:17:58 +0000

The concept of NFTs has been around since the 2014s but it wasn't until 2017 that projects like CryptoKitties and CryptoPunks started to create traction for NFTs. Jumping to 2021, NFTs took off like wildfire. They started being referenced in pop culture, mainstream media, and they influenced the concepts that many hackathon projects were based on.

The technology for creating NFTs has come a long way and is now more accessible to developers and non-developers alike. Along with the creation of NFT marketplaces such as OpenSea and Rarible, anyone can mint their own NFTs and sell them.

When minting video NFTs, a major factor to consider is the file size. Livepeer Video Services solves this issue when using the Video NFT SDK. This SDK will transcode the video to the proper file size utilizing the Livepeer Network as well as leveraging the layer 2 solutions of Polygon to reduce the cost of transactions on the Ethereum blockchain. Using the SDK makes it easy and more affordable to create video NFTs.

In this tutorial, we will utilize Livepeer Video Services' Mint a Video NFT tool to create our own NFT that can play a video.
Before we get started, here is a checklist of items required for this tutorial. Instructions on how to get and install these items will be provided in the steps that follow.

Checklist
☑️ Sign up for a free account at Livepeer Video Services to create an API key
☑️ Jellyfish Video
*This is an example video that will be used, there are other free videos available at Pexels.
☑️ Sign up for a free Metamask account
☑️ Add Polygon Mumbai testnet to Metamask wallet
☑️ Get Polygon test MATIC
☑️ Install Video NFT

Installation process

Step 1: Signup for a free account at Livepeer Video Services and create an API key

*If you need a step-by-step process for getting a free account and the API key, visit the How to make API calls with Postman tutorial.

Step 2: Get a video to mint as an NFT

For this example, we will use this video: Jellyfish Video

*You can also find another video using Pexels or use provide one of your own. If you do use one of your own, make sure it is in a .mp4 format.

Step 3: Install Metamask (if you do not already have one)

Go to Metamask and download the browser extension. For this tutorial, we will use the Chrome version, but a Firefox version is also available.

Once downloaded, you should see the Metamask logo in the extension menu

Next, set up your Metamask wallet - Polygon has a great tutorial on how to do this

Step 4: Configuring Polygon network for Metamask

We need to configure the Polygon network to the Metamask wallet. For this tutorial, we will use the Polygon testnet called Mumbai, but they also have the Polygon mainnet configuration as well.

Step 5: Getting MATIC for testing

Minting NFTs has a gas fee associated with it, so we need to add funds to our wallet. Since we are using the Mumbai testnet, we will need to get some test MATIC tokens. If you are using Polygon's mainnet, you can find the MATIC faucet here.

Make sure the Mumbai tab is selected
Paste in your wallet address and you should receive some test MATIC token

Click the submit button and a confirmation window should pop up

Click confirm and a message should appear stating the transaction went through

Your wallet should be funded with some test MATIC tokens

Step 6: Installing the mint Video-NFT

*If you want to have video-nft available as a command on your machine, you can also install the CLI persistently with npm i -g @livepeer/video-nft, and after that just call video-nft from anywhere to run it.

Create a new directory with the command mkdir VideoNFT

Change into that directory using cd VideoNFT

Move the video from Step 2 into this directory
The file should be in this directory, use the ls command to view it

ls

Run Livepeer Video Services Video NFT using

npx @livepeer/video-nft

Copy and paste the API key that you got from Step 1

Type in the name of the video file, for this example, it is jellyfish.mp4

Provide the name you want to give the NFT, you can use the file name to name the NFT but in this example, we will use JellyFish

In this example we will not customize our metadata so select no for customizing the metadata for the NFT

A message should appear that states the export is successful along with the metadata and our URL for minting

Copy the URL in Step 3 for the next step

Step 7: Minting the video NFT

Copy and paste the URL from the previous step into a browser window
A Livepeer Video Services site should appear with a Mint a Video NFT pop up

Click the Connect to Metamask button
Metamask browser extension should open and ask the account to connect to
Select the account with the funded testnet MATIC and connect it

Once connected, the pop up should have the ContractAddress and the message box should state that you are connected to the Polygon Testnet

Click the Mint NFT button

Metamask browser extension should open and ask to confirm the transaction fee

Click the Confirm button
You should see the minting in progress in the message field

Once the minting is completed, it should provide a link to OpenSea testnet where you can view your Video NFT! For example:

https://testnets.opensea.io/assets/mumbai/0xA4E1d8FE768d471B048F9d73ff90ED8fcCC03643/56

Congratulations! You have minted a video NFT using Livepeer Video Services' Video NFT SDK.

Using the SDK is a great way to get started with being able to upload video NFTs. If you want to upload videos and do not want to mint NFTS, Livepeer Video Services also has Video on Demand where you can do just that.

Check out Video On Demand

How to make API calls with Postman and Livepeer Video Services

Shih-Yu Hwang — Tue, 15 Mar 2022 22:18:57 +0000

APIs are essential when it comes to software development. It allows softwares to communicate with each other to exchange information. In the beginning, when learning to make API calls, it can be a challenge using tools such as cURL in the terminal, FETCH in the frontend or backend option such as Express. Postman is a great tool for understanding the process of making API calls and getting feedback on the response of those calls. It provides a visual interface and allows developers to get a sense of the workflow which can provide easier transitions to using other tools such as cURL or Express.

In this tutorial, we will be using Postman to make API requests to Livepeer Video Services to get a better understanding on building an application similar to Twitch or YouTube. The Livepeer Video Services API consists of the standard features for users such as creating new live streams, recording the streams and getting a list of their streams. By leveraging Livepeer's decentralized network for transcoding, it will be easier and cost effective to scale for in the future.

Step 1: Get access to Postman

Go to Postman's website and sign up for a free account.

You can use their web browser tool or download the desktop version. For this tutorial, we will use the desktop version with Mac OS, but it is also available for Windows and Linux.

Step 2: Get access to Livepeer Video Services

Go to Livepeer Video Services and sign up for a free account.

Now that we have access to these two services, let's start interacting with them.

Step 3: Get an API key

In your Livepeer dashboard, tap the developers tab and select API keys
Click the button that says Create Key
Then give your key a name and click Create

With the API key, we will start going through the Stream section of Livepeer Video Services' API Reference. The reference uses the cURL command but we will do this using Postman instead.

To learn more about streaming Livepeer Video Services with the cURL command, visit the tutorial How To Stream With Livepeer Video Service's RTMP API

Step 4: Launch the Postman desktop app

Click the + icon under the Reports tab to start a new request or select New Tab under the file menu

Step 5: Create a stream

Select the POST option and the paste in Livepeer Video Services' base URL for streaming https://livepeer.com/api/stream

Then underneath the URL, click on the Authorization tab, and select Bearer Token as the type
Copy and paste your API key from Livepeer Video Services

Now select the Body tab and then underneath select the raw radio button
Then click the the Text drop down menu and select the JSON option
In the text box field below, paste the following code which is from the Livepeer Video Services API reference docs. You can change the name to whatever you want as this is for the name of your stream

Now click on the Send button and you should receive a confirmation that it went through with a 201 status
Scroll down in the response and copy the id for the stream that was just created. It should be under renditions

Check the Livepeer Video Services' dashboard and the stream that you just created should come up

Now let's get the stream we just created

Step 6: Retrieve a stream

In the Postman app, we will change from POST to GET, and in the URL paste in https://livepeer.com/api/stream/{id} and replace {id} with the id we copied from our response earlier.
Click the blue send button and you should get back a 200 status with the response including the parameters of the stream

Step 7: Get a list of streams

In order to get a list of streams, follow Step 5 to create a second stream so that there is more than one stream
Give it a name of your choice, but for this example, it will be named Second Stream

Go back to Livepeer Video Services' dashboard and you should see the Second Stream appear

Now that we have multiple streams, go back to the Postman app and retrieve them
Similar to Step 6 we are changing POST to GET and insert the base URL for retrieving multiple streams https://livepeer.com/api/stream?streamsonly=1
Remember that the body should have the none radio button selected since we are not passing in any data
Click the blue send button and it should confirm with a response of status 200 meaning that the request went through and a response back with a list of your streams

Step 8: Toggling a stream

Replace GET with Patch and insert the URL for for toggling recording https://livepeer.com/api/stream/{id}/record and replace {id} with the one you have at the end of Step 5
Now we will toggle the recording on by putting the following in body, just as we did in Step 5

{ "record": true }

Click the blue send button and it should confirm with a response of status 204 meaning that the request went through

Step 9: Update a stream

Select Patch and insert the URL for updating a stream https://livepeer.com/api/stream/{id} and replace {id} with the one you have at the end of Step 5
Now we will not have the recording on and suspend the stream by putting the following in body, just as we did in Step 5

{ "record": false, "suspend": true }

Click the blue send button and it should confirm with a response of status 204 meaning that the request went through

Step 10: Delete a stream

We will delete Second Stream by replacing Patch with Delete and insert the URL for deleting a stream https://livepeer.com/api/stream/{id} and replace the {id} you have at the end of Step 5
Click the blue send button and you should get a status 204 as a response to confirm the stream has been deleted

Go back to Livepeer Video Services' dashboard to confirm that the stream has been deleted

Now that you are able to use Postman to interact with Livepeer Video Services' API, take your skills to another level using cURL. To learn more, check out the tutorial How to Stream With Livepeer Video Service's RTMP API.

How to Stream with RTMP API

What to know about RTMP

Shih-Yu Hwang — Fri, 25 Feb 2022 23:45:08 +0000

These four letters are used a lot in the video development world, but what does it mean and what is it for? In this article, we will go into the meaning of RTMP, its workflow and how it works in general.

RTMP or Real-Time Messaging Protocol is a type of transporting protocol also known as TCP or Transmission Control Protocol. Transporting protocols are responsible for delivering information from a media server to a user whether through the use of a CDN or directly to the video player. RTMP has been used more as a method of transporting data for a while due to being around for a long time. However, there is another transfer protocol called SRT that is gaining popularity. To learn more about SRT and Livepeer, read our article Start Using SRT with Livepeer.

Synonymous with Flash player, RTMP was developed by Macromedia and later acquired by Adobe, which they rebranded to Adobe Flash Player. Key features of RTMP include streaming at low-latency (~5 seconds) with minimal buffering and it being bi-directional, meaning that it can send and receive video data. There are other variations of RTMP such as RTMP, RTMPS, RTMPE, RTMPT, RTMPF.

Though the benefits are useful, it is no longer as supported or updated. Nor does it have much compatibility with most web browsers, iOS or Android devices. Another shortcoming of RTMP is that it can only deliver two channels for audio. This means RTMP can not deliver audio with more than one language.

RTMP delivery workflow

As a delivery protocol, RTMP takes the data and is able to break it down into smaller pieces of information known as chunks. It then determines the proper chunk size to send and does this in a continuous manner. This is how it is able to generate a constant connection for live streaming.

RTMP ingest workflow

Nowadays, RTMP is often used more for transferring data from the encoder to the media server than for delivering from the media server to the CDN or video player. A main reason is because Adobe Flash Player is no longer supported and more adoption of HLS as the transfer protocol.

Here is an outline of how the ingesting method works:

Handshake - data being exchanged between client and server (3 chunks of data)

Chunk 1 - Informs server which variation of RTMP being used
Chunk 2 - Contains the timestamp
Chunk 3 - Confirms first two data chunks and then starts - connection

Connection

Send information that contains the type of application, audio codec and video codec being used

Stream

Send information on transaction ID, stream ID, and other parameters to create stream

RTMP ingest with Livepeer

Livepeer offers a convenient way to get an ingest point and start streaming with ease. To learn more on how to do so, check out this article New Dashboard for Livepeer.com's Streaming API.

For those who want to build Livepeer into their own applications for a more customizable experience to give to their users, visit Streaming with RTMP for a more in-depth use of RTMP to stream with Livepeer with the API.

Learn more about the Livepeer API

SRT Blog Post: Livepeer now supports SRT

Shih-Yu Hwang — Thu, 17 Feb 2022 15:00:30 +0000

What’s SRT?

Secure Reliable Transport (SRT) is an open source video transport protocol developed by Haivision, that excels at providing stable streaming at relatively low latency. Although SRT is primarily used in broadcasting and corporate environments, SRT is increasingly becoming popular for all kinds of streaming over the internet.

Before going into more details on why the SRT protocol is gaining more adoption compared to the more traditional transport protocol such as RTMP and RTSP, let’s take a brief look at where it fits in the context of live video streaming.

Live video streaming workflow

Here is a simplified process of how live streaming works:

Cameras and Microphones
Source used for broadcasting video and/or audio

Encoding
Compresses the raw data from cameras and/or microphones for easier transporting across the internet

Transcoding (*SRT)
Compresses the encoded data to smaller sizes and different formats to be more accessible across different types of devices

Media servers
Converts and repackages transcoded data as needed to be available for different types of formats chosen to view the video

Content Delivery Network
Quickly distributes the content provided by the media server from the nearest location requested by the viewer

Video players and playback
Decodes the data from the CDN and displays it for viewing

In depth on SRT

SRT is part of the transcoding process that delivers the data to the media server. Due to the nature of data getting transferred constantly in different variations, maintaining the optimum quality from the original source is very important.

There are features in SRT that assists in maintaining high quality data when transferring them.
Here are some unique features provided by SRT that help preserve the quality of data that is being transferred.

The ability to configure the time to synchronize to multiple feeds
The ability to set and adjust the bandwidth
Reconstruct NAK(Negative Acknowledgement) packages to provide a smoother experience
More adaptability by being codec agnostic for audio and video

We like SRT not only because it’s being actively maintained and is open-sourced, but also because SRT is designed to be highly stable and perform well in unpredictable network conditions by adapting to real-time network conditions. Another important aspect is that it also provides for security for the content distribution by using AES encryption.

Simply put: more reliable video means happier viewers.

SRT is still relatively new and not as widespread as RTMP, which means that you can’t stream SRT into popular live-streaming sites like Youtube, Twitch, and Facebook. Livepeer supporting SRT means that your streamers can stream SRT and get all the stability and security improvements that it was designed to deliver.

Using SRT with Livepeer

SRT streaming is simple to use. Currently, we provide a RTMP ingest URL like the following example:

To use SRT transport method, simply replace the RTMP ingest URL with:

Another easy option is that the SRT ingest URL is located right under the RTMP URL in the Livepeer dashboard. If you are using the SRT URL from the dashboard, there is no need to provide the stream key as it is already included.

Below is an example of using SRT with OBS

Go to settings

Then select the Stream tab in the left menu
Select custom from the Service drop down menu
Paste in the SRT URL in the Server field

Paste in the SRT ingest URL from Livepeer Video Services. Note that {stream_key} should be replaced with the given key, e.g. 56g6-xcd1-toox-w70z

And that’s it!

SRT is free to use for all accounts. For more information to get started using SRT, check out our documentation. Here is more information on getting started using SRT in Livepeer, also check out our documentation. Happy streaming!

Read SRT docs