``` The second line contains the stream URL (i.e. `stream_url`) ```javascript {this.state.broadcast_url}
``` The third line contains the key for the stream key (i.e `stream_key`) ```javascript {this.state.broadcast_key}
``` #### Putting the broadcast page UI together: ```javascript render() { return (
Uiza Guide
Start broadcast
{this.state.message}
{this.state.broadcast_url}
{this.state.broadcast_key}
{/* remove http(s) */}
URL: {this.props._url}
KEY: {this.props._key}
PLAYBACK: {this.props._playback_url}
)
}
}
```
As mentioned above, requests are only made every 5-seconds. We attach the parameters to the VideoTile element. After putting it all together:
```javascript
render() {
try {
if (typeof this.state.last_loaded === "string" || ((new Date() - this.state.last_loaded) / 1000) > 5) {
var items = [];
this.load_alive_streams().then((result) => {
for (const [index, value] of this.state.streams.entries()) {
items.push(KEY: {this.props._key}
PLAYBACK: {this.props._playback_url}
Uiza Online Videos
{this.state.items}
{/* A looks through its children s and
renders the first one that matches the current URL. */}
``` The second line contains the stream URL (i.e. `stream_url`) ```javascript {this.state.broadcast_url}
``` The third line contains the key for the stream key (i.e `stream_key`) ```javascript {this.state.broadcast_key}
``` #### Putting the broadcast page UI together: ```javascript render() { return (
Uiza Guide
Start broadcast
{this.state.message}
{this.state.broadcast_url}
{this.state.broadcast_key}
{/* remove http(s) */}
URL: {this.props._url}
KEY: {this.props._key}
PLAYBACK: {this.props._playback_url}
)
}
}
```
As mentioned above, requests are only made every 5-seconds. We attach the parameters to the VideoTile element. After putting it all together:
```javascript
render() {
try {
if (typeof this.state.last_loaded === "string" || ((new Date() - this.state.last_loaded) / 1000) > 5) {
var items = [];
this.load_alive_streams().then((result) => {
for (const [index, value] of this.state.streams.entries()) {
items.push(KEY: {this.props._key}
PLAYBACK: {this.props._playback_url}
Uiza Online Videos
{this.state.items}
{/* A looks through its children s and
renders the first one that matches the current URL. */}
UIZA GUIDE
{% endblock %} ``` ### Step 5. Building the View Page The view page contains tiles that correspond to available streams. This view will render simple html page when `NotPlayable` is false; when true, it will send the list of responses to `viewerspage.html`in a context dictionary. Context dictionary is just the information passed to the html page from the view. ```python def viewerspage(request): # if broadcast button is not clicked then this view is rendered if NotPlayable: print('got here') list_of_videos = [] return render(request,'viewerspage.html') else: # if broadcast button is clicked then this view is rendered and a context dictionary is passed with stream_key, stream_url, playback link stream_dict= {'stream_key':stream_key,'stream_url':stream_url,'playback':stream_hls} list_of_videos.append(stream_dict) #The last parameter of render is the context dictionary, these are the variables which store useful info that we would want to use in out templates return render(request,'viewerspage.html',{'list_of_videos':list_of_videos}) ``` #### Rendering the view page html We create a dynamic list of VideoTiles, and populate it on every render(). We use a 5-second interval between each render, to not overdo it. Then we access the details from the properties of the Video at the time of creation. We use the properties to pass values to the inner components of the tile and make it look functional. For example: `{this.props._url}` accesses the `_url` parameter from `UIZA ONLINE VIDEOS
{% for each in list_of_videos %}
{% for key, value in each.items %}
{% if key == 'playback' %}
{% else %}
{% endif %}
{% endfor %}
{% endfor %}
{% endblock %}
```
## Conclusion
That's how you can integrate live streaming into your app using Uiza's APIs. With just two API methods, you will have your stream key and stream URL to start a live stream. If you have any questions please check out our Github repo where this entire project has been uploaded with source code [here](https://github.com/info3g/python-uiza) and if you have any other questions please contact us here: tag:
```
```
3\. This code creates an UIZA player:
```
```
4\. Full code example:
```
" %}
# Release Notes
Release Notes is our update that we share with you our new features, improvements or why we change the API to serve you better so you can easily stay up to date on what’s new.
## 2022-06-22
### Uiza supports multiple ingest points
From this release, Uiza supports the broadcasters in choosing the nearly region from their location for sending the video signal (OBS, Uiza's SDK,...). So, the live entity's **ingest** will be changed to an array for including multiple ingest points. For more information about the supported ingestion, please contact us 🤗.
{% hint style="warning" %}
*Note that all the current ingest points are returning as an object, so before using this version, please help us to integrate with the changes, so your application can work perfectly without any issues.*
{% endhint %}
#### *Changes:*
## 2022-06-06
### Auto load-balancing
We now change the ingest point to use the 8099 port, which supports auto-choose a server to serve your stream with the best performance.
{% hint style="warning" %}
*Note that all the current ingest points have no port on the ingest URL (use port 1935 as default), so before we upgrade the system, please help us to integrate with the changes, so your application can work perfectly without any issues.*
{% endhint %}
#### *Integration: there are 2 options to do đź’Ş*
1\. Uiza sends the new ingest info to the webhook endpoint: we will send the data to your webhook endpoint - send all the new ingest to the live\_entities.updated event. We can also provide the API to trigger it manually for your testing.
*Sample webhook data:*
2\. The customer update all the ingest endpoint with port 8099, for example, `rtmp://ingest.uiza.io` -> `rtmp://ingest.uiza.io:8099`. Please contact us for more information.
*Live entity data changes:*
| Live entity object | Before | After |
| ------------------ | ---------------------------------- | --------------------------------------------- |
| **ingest.url** | `rtmp://g-rtmp.gcpsg.uiza.io/live` | `rtmp://g-rtmp.gcpsg.uiza.io/live`**`:8099`** |
## 2020-07-01
### Rewatch the last 30 minutes of a live stream!
We have built a Timeshift feature for maximum viewer experience. When you use an Uiza Player SDK, your viewer can switch between watching a live video and rewinding upto 30minutes with our Timeshift feature.
### Reduced Latency
We have reduced the HLS Playback latency by up to 50%!
### Webhooks: performance and scalability improvements
We know that webhook is one of the most important features for the integration with Uiza APIs. In this release, by the focus on improving the throughput of our webhooks service, Uiza provides you a faster and more reliable webhooks ever.
When your server responds to Uiza the bad status, an event now will be retried to send to your webhook endpoint every hour up to a day, instead of retry many times in minutes, which is too short for any action if your server has trouble.
### Uiza node-kafka-client
There are several problems to solve while enhancing the performance of our services. In the case of message broker enhancement, we decided to release the library of Kafka client run on NodeJS on Github [here](https://github.com/uizaio/node-kafka-client). Which is a wrapper library of [node-rdkafka](https://github.com/Blizzard/node-rdkafka) with extended features, easy to control the workflow, please feel free to use or give us feedback to improve.
## 2020-06-10
### More regions for better performance and more global reach
We have added following regions for your users to use as ingestion points:
{% hint style="success" %}
`us-oregon-1` (Oregon - USA)
`aus-sydney-1` (Sydney - Australia)
`ie-dublin-1` (Dublin - Ireland)
{% endhint %}
## 2020-05-28
### Get notified when we cannot allocate resources for your entity
We try our best to power your broadcasting session by allocating the dedicated resource, returning an RTMP server to ingest and delivering your stream in seconds. Furthermore, we know your time is wasted when you create a [live entity](https://docs.uiza.io/api-reference/live-entities) and the status `init` doesn't change.
So in this release, we added a new live entity status: `resource_allocate_fail` . When the allocating resources for an entity passes a threshold of time, we'll set the entity's status to `resource_allocate_fail` and delete it automatically after 15 minutes.
In case the entity status becomes `resource_allocate_fail`, ~~disaster 🌋🌊 may occur~~ it will not be counted on your usage data. You can create a new live entity afterwards.
### Suspended accounts
Uiza's invoice day is 3rd day of the month, we process to charge your invoice until the 16th day of the month. If the next day we still not charge your invoice successfully, your account will be set to suspend and we prevent your interaction with our core services via API calls.
### Support for MPEG-DASH Playback
Read more about MPEG-DASH [here](https://www.encoding.com/mpeg-dash/).
## 2020-05-07
### New region in Vietnam region is finally available!
Provide your users with improved connectivity through our new region. The new region is:`vn-saigon-1`
### Added PATCH methods to modify objects
Instead of replacing your resource for a simple modification, you can now update the resource using the PATCH method. We will deprecate the PUT methods in the future.
## 2020-04-21
### Track your encoding minutes!
You can now see how many minutes you have encoded using Uiza. For more details on how we calculate your encoding minutes, go to this [link](https://help.uiza.io/data-usage)
### Uiza's Player for better viewer experience
Integrate Uiza's player into your website for optimal playback. Our player supports ABR, playback speed, and playback in a smaller window.
## 2020-03-26
### Behold! DVR
You can now rewatch your live stream with DVR. We record your live stream and convert it to a [video entity](https://docs.uiza.io/api-reference/video-entities), and your users can watch your live stream recording if they missed it.
### Broadcast your moment to multiple destinations simultaneously
Using our `Relay Destination` feature, you can broadcast your live stream to multiple social networks (Facebook, Youtube, Twitch, etc) or RTMP endpoint simultaneously. Update your fans on all platforms and let us handle the signal!
### Give your end user the best experience with ABR
You can create up to 6 video profile outputs (Business Tier) with your stream, to cater towards different networks and mobile devices. Your viewer can choose different resolutions, or our Uiza player will recognize the most fitting profile depending on your user's bandwidth, and adjust their bitrate accordingly.
# API Changelog
API changelog describes to you what we change on the newest API dated version we've made so you can easily stay up to date on what’s new.
## 2020-07-01
**What’s new**
* Support enable/disable of live relay destination and added the identity attributes to the relay object: id, status, created\_at , and updated\_at.
* Faster and more reliable Webhook service.
* Separate Delivery overusage to different regions with distinct costs. [Read more here.](https://help.uiza.io/data-usage)
* Adjust the overuse invoice template to include items for delivery regions, unit prices, and exceeded values.
* Support for enabling/disabling CCU display on Uiza’s WebSDK. [Read more here](https://github.com/uizaio/uiza-javascript-sdk-player#customizing-the-ui-button).
**Changes**
* Time interval to retry Webhook changed from multiple times per minute to an hourly basis for a duration of 24 hours.
* Update subscription plans according to the new pricing model ([Pricing](https://uiza.io/pricing)).
**Fixes**
* Fixed issue with user suspension in case of failed payment when changing the current subscription
## 2020-05-28
**What's new**
* User suspension - User’s who missed payment after the invoice period will be suspended.
* New status when creating live entity: `resource_allocation_fail` - when the entity takes too long to look for resources. User’s will receive a message and will be prompted to create a new entity.
* SDK player updates
* Live button to return to live moment
* Analytics and CCU displayed on Uiza’s players
* Support for [MPEG-DASH](https://www.encoding.com/mpeg-dash/) playback .
**Fixes**
* Fixed bug when deleting a live entity assigned to a preset.
* Fixed minor bug with wrong message response when creating a webhook endpoint but missing url parameter.
* Fixed bug returning inconsistent playback.url of live entity in Live API and Event API.
* Fixed confusing error message when creating a [live entity](https://docs.uiza.io/api-reference/live-entities) with missing parameters.
* Fixed confusing error message when creating a [webhook endpoint](https://docs.uiza.io/api-reference/webhook_endpoints) with missing parameters.
* Fixed bug allowing Team & Business tier users to profiles to Uiza presets.
* Fixed bug with randomly returned error type when client calls APIs.
* Fixed issue with retry request live resource.
## 2020-05-07
### What's new
* Added new API: [Update a live entity](https://docs.uiza.io/v/2020-05-07/api-reference/live-entities/update-a-live-entity) using PATCH method
* Added new API: [Update a webhook endpoint](https://docs.uiza.io/v/2020-05-07/api-reference/webhook_endpoints/update-webhook-endpoint) using PATCH method
### Changed
* Deprecated [Update a live entity](https://docs.uiza.io/v/2020-05-07/api-reference/live-entities/deprecated-update-a-live-entityhttps://docs.uiza.io/v/2020-05-07/api-reference/live-entities/deprecated-update-a-live-entity) API using PUT method
* Deprecated [Update a webhook endpoint](https://docs.uiza.io/v/2020-05-07/api-reference/webhook_endpoints/deprecated-update-webhook-endpoint) API using PUT method
### Fixed
* Inconsistent entity status on events when update entity status to ready
* Fixed bug when calling list events API returns `internal-error`
## 2020-04-21
### What's new
* Expose new API to reset Ingest Key of a Live Entity.
* Expose new API to get Invoice Detail.
* Support clearing Live Entity's relay setting by updating relay parameter as empty
* Support exporting Invoice to PDF.
* Support deleting source files of video entity.
### Changes
* Replace field `type` by `input_type` in `video_entity` event object.
### Fixes
* Fixed bug incorrect error response when updating invalid video preset/profile.
* Fixed bug where user can login without verifying email address.
* Fixed bug displaying empty `live_entity_id` in the `live_session` event object.
## 2020-03-26
### What's new
* Added new event `video_entities.created` in [Event Types](https://docs.uiza.io/api-reference/events/event-types).
* Added `video_entity_id` attribute to [Live Session](https://docs.uiza.io/api-reference/live-sessions) to link the live records with its video entity.
* Support DVR option in [Live Entity](https://docs.uiza.io/api-reference/live-entities). Included two new APIs to enable and disable DVR.
* Support login with Google.
* Support multiple destination broadcast and added `relay` attribute to [Live Entity](https://docs.uiza.io/api-reference/live-entities) .
* Added `encode` attribute to [Live Entity](https://docs.uiza.io/api-reference/live-entities) .
* Introduced [Video Profile](https://docs.uiza.io/api-reference/video-profiles) & [Video Preset](https://docs.uiza.io/api-reference/video-presets) to support live with `encode` option.
* Added new attribute `preset` in [Live Entity](https://docs.uiza.io/api-reference/live-entities) .
* Support filtering [Live Sessions](https://docs.uiza.io/api-reference/live-sessions) by DVR attribute and added new attribute `preset` in Live Session details
* Support filter live video by `live_entity_id`.
* Increase resource allocation speed up to 500 live entities per 5 seconds.
* Support categorize Ulas by `encode` feature.
### Changes
* Live Session attribute `entity_id` changed to `live_entity_id` to differentiate with `video_entity_id`.
* Following [Google API Design guideline](https://cloud.google.com/apis/design/standard_methods#delete), all `DELETE` APIs should return empty body.
* Remove `Reset ingest key` API in version 2020-01-10. We no longer support resetting ingest key, because conflicts with the end of signal occurs when an user resets the ingest key while streaming. We are working on this problem.
* Remove emit event log form. All event logs related to entity should be executed in Live Entity server.
* Update submodule by removing `googleapis`. This update shortens the times of build time from 10 minutes to about 2 minutes.
* Support allocating request based on available vCPUs and Memory
* Enhance the performance of allocating by moving DNS logic part to be a DNS Service.
### Fixes
* Webhook endpoints can now send to Slack without error and return the valid error message.
* Delete DNS when deleting a live entity.
* Fixed bug where user ID is undefined when creating a live entity.
* Fixed inconsistency of API response between live entity API and webhook endpoints API.
* Fixed bug where updating the video entity returns bad request.
* Fixed inconsistency in boolean value in events API.
* Fixing crashing issue due to not handling case of Axios - fail on getting a response from Prometheus.
* Handle multi node down trigger fail over.
* Fixed bug where retrieving live entities causes long time to allocate resource.
* Cannot get Ulas disk metrics during scaling action.
# Hola! đź‘‹
### **Welcome to Uiza, the video streaming as code!**
We aim to provide developers with an end-to-end video streaming solution that offers simple integration and stable performance at scale. At the very beginning of our roadmap, we tackle the problem that is considered the most severe, ***video and live stream delivery***. The proximity between the infrastructure and the streamer/viewer is the key factor that influence the quality of the video streams. Setting up and managing a wide network of infrastructures that penetrates locally to reach out as closely as possible to the streamers and viewers in various cities are tough. The first version of our brand-new platform is created to solve this problem.
{% hint style="success" %}
Our **key differentiation** is that we are developing a diversified network of infrastructures that does not only rely on public cloud like Amazon Web Services, Google Cloud Platform, or Digital Ocean, but also a wide range of local infrastructures those are rooted in lower-tier cities like *Bengaluru, Kolkata, Chennai*... This means your viewers will most likely *watch the videos being streamed from the infrastructure located in the same city of theirs*, which improves the quality and scalability of the video streams significantly.
{% endhint %}
# Introduction
Uiza helps you broadcast your live stream to your audiences with literally a few lines of codes, or at least we are trying hard to get there:muscle::muscle::muscle:. But before experiencing the magic, let's make sure that you understand the terms correctly.
* ***`live_entity`***: Live entities are basically live events, with or without a live feed. A live entity contains the information required for Uiza to allocate resources to power the live event, and direct your live feed toward these resources for ingestion and broadcasting.
* ***`live_session`***: The duration of one session is counted from the moment Uiza receives the first signal until the last of that live feed. Therefore, one entity could contain multiple sessions. The durations of these sessions are calculated as *Live Minutes* in your billing.
* ***Streamer***: Streamers record the live events and are the source of the live signals that Uiza receives.
* ***Viewer***: Viewers are the users who watch the live stream on their devices. They are the destination of the delivery of the live stream.
Now that we are on the same page, let's navigate to the **Quickstart** to start *live streaming*.
{% content-ref url="/pages/-LwqhgC-FZjkAy13MWg8" %}
[Authentication](/2022-06-06/getting-started/authentication)
{% endcontent-ref %}
# Authentication
Uiza APIs apply the [HTTP Basic Authentication Protocol](https://swagger.io/docs/specification/2-0/authentication/basic-authentication/), where the client sends HTTP requests with the API key in the Authorization header.
Once you have signed up, you can create applications (maximum of 2 applications) with an API Key assigned to each application.
You can manage your applications and API Keys in the [Uiza Dashboard](https://app.uiza.io/).
All API requests to Uiza *must go* over HTTPS and include a valid API Key.
# Errors
This page describes the error statuses returned by the Uiza APIs
Whether an API request to Uiza is successful or not is indicated by conventional *HTTP* codes. In general, Uiza returns responses with equivalent *status codes* which are listed below.
> **200 - OK**
>
> The request is successful.
> **400 - Bad request**
>
> The request is inadequate. This is usually caused by missing required parameters or malformed syntax.
> **403 - Forbidden**
>
> The API key doesn't have permissions to perform the request.
> **404 - Not Found**
>
> The requested resource does not exist.
> **409 - Conflict**
>
> The request conflicts with the current state of the server. For example updating an immutable resource already present on the server.
> **500, 502, 503, 504 - Internal Server Error**
>
> Something went wrong on Uiza's end
> Errors are returned with format containing a `message` and an `error_type` to help you pinpoint what went wrong. While you can find all the possible error messages in our API Reference, these errors are categorized by the following `error_types`:
| Error Types | Definitions |
| :---------------------: | :-------------------------------------------------------------: |
| `api_connection_error` | Errors that occurred during the HTTP communication. |
| `api_error` | Errors occurred internally with Uiza API. |
| `authentication_error` | The keys supplied to Uiza were either missing or invalid. |
| `invalid_request_error` | The parameters supplied to Uiza were either missing or invalid. |
| `rate_limit_error` | Too many requests were sent to Uiza too quickly. |
| `video_error` | There is something wrong with your video or live stream. |
# Quick Starts
Welcome to the most exciting part of Uiza Documentation. Now, we will accompany you in streaming your first video, and live broadcasting your very first session with Uiza APIs. :partying\_face::partying\_face::partying\_face:
{% content-ref url="/pages/-LvsA4FyDRUwKP4Z7tjP" %}
[Live Streaming](/2022-06-06/getting-started/quick-starts/quickstart)
{% endcontent-ref %}
{% content-ref url="/pages/-Lwm3LFbLppQcOYeL\_pt" %}
[Video Streaming](/2022-06-06/getting-started/quick-starts/video-streaming)
{% endcontent-ref %}
# Live Streaming
Our *REST APIs* use standard *HTTP* response codes, authentication, and verbs, and return *JSON-encoded responses*. Using these APIs, you will be able to start a live event and stream the content to our network, which will deliver that content to your audiences. Once a live entity is created, Uiza allocates dedicated resources and return an *RTMP* server to ingest and deliver your stream. The overall framework is articulated in the diagram below.
## **Step 1: Create a live entity**
To start streaming, you need a [`live_entity`](https://docs.uiza.io/api-reference/live-entities) to be created with resources allocated, ready to broadcast the live signal. You could create a live entity by using ***Create A Live Entity*** ***API***.
## /v1/live\_entities
`POST` `https://api.uiza.sh/v1/live_entities`
#### Request Body
| Name | Type | Description |
| ----------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| name | string | The name of your live entity. |
| region | string | Choose the region closest to the location of your streamer. |
| description | string | The description of your live entity (maximum is 1000 characters) |
| dvr | boolean | Indicates whether Digital Video Record (DVR) is enabled for the `live_entity`. Set as `true` to enable and as `false` to disable. The default value is false. |
| encode | boolean | Indicates whether encoding mode is enabled for the `live_entity`. Set as `true` to enable and as `false` to disable. The default value is false, when the encode is true, it required a `preset_id`. |
| preset\_id | string | The identifier of the `video_preset` to be applied when encoding your signal. |
| relay | array | A list of ingest servers to be relayed. Contains `url` and `key` and `name` (optional) in each ingest server. |
{% tabs %}
{% tab title="200 " %}
{% tabs %}
{% tab title=" live\_entities without encoding" %}
```
"id": "2b970a39-874a-4d2a-be8a-fd445646d74c",
"name": "Test event without encoding",
"description": "Event for Test",
"region": "in-bangalore-1",
"status": "init",
"dvr": false,
"encode": false,
"ingest": null,
"playback": null,
"relay": [
{
"url": "rtmp://youtu.be/live",
"key": "Abco1",
"name": "Youtube 1"
}
],
"preset": null,
"created_at": "2020-03-23T07:22:34Z",
"updated_at": "2020-03-23T07:22:34Z"
}
```
{% endtab %}
{% tab title=" live\_entities with encoding" %}
```
{
"id": "b7f02d48-d0ec-4c34-86d1-247a38eda4e1",
"name": "Test event with encoding",
"description": "Event for Test",
"ingest": null,
"playback": null,
"relay": [
{
"url": "rtmp://youtu.be/live",
"key": "Abco1",
"name": "Youtube 1"
}
],
"region": "in-bangalore-1",
"status": "init",
"dvr": false,
"encode": true,
"preset": {
"id": "9432fa62-5988-11ea-883b-028fc5698662",
"name": "Uiza LIVE 720p",
"description": "",
"is_default": true,
"profiles": [
{
"id": "85844e8b-6281-11ea-883b-028fc5698662",
"name": "720p H264 30fps Normal Latency",
"segment_duration": 4,
"orientation": "landscape",
"video_profile": {
"video_resolution": "720",
"video_codec": "H264",
"video_bitrate": "2000K",
"video_frame_rate": "30"
},
"audio_profile": {
"audio_channel": "2",
"audio_codec": "AAC",
"audio_bitrate": "128K",
"audio_frame_rate": "1"
}
}
],
"created_at": "2020-02-27T17:42:52Z",
"updated_at": "2020-02-29T16:47:34Z"
},
"created_at": "2020-03-23T07:22:34Z",
"updated_at": "2020-03-23T07:22:34Z"
}
```
{% endtab %}
{% endtabs %}
{% endtab %}
{% endtabs %}
{% code title="Sample Request" %}
```go
curl -X POST https://api.uiza.sh/v1/live_entities \
-H 'Authorization: uap-c1ffbff4db954ddcb050c6af0b43ba56-41193b64' \
-d '{"name": "Test Event", "region": "in-bangalore-1", "description": "Test 1"}'
```
{% endcode %}
{% hint style="info" %}
Please pay attention that you entered a supported region, else the API will return an error message. Defining correct region helps Uiza allocates the resource that is closest to the streamer location. This will minimize the risks of network issues and reduce the impact on your business. While we are adding more and more regions to Uiza Network, please check the current available regions below:
`in-bangalore-1` (Bangalore - India)
`in-mumbai-1` (Mumbai - India)
`sg-singapore-1`(Singapore)
`vn-saigon-1` (Vietnam)
{% endhint %}
## **Step 2: Retrieve a live entity**
You will need the `ingest.key` and `ingest.url` to configure your broadcasting software. These 2 attributes could be retrieved by using the `id` you get in the response in ***Step 1*** for the ***Retrieve an entity*** API.
{% hint style="warning" %}
It is important that the value of the **`status`** you get from the response is **`ready`**, meaning that resources have been allocated and ready to ingest and broadcast your live feed. If the **`status`** of your entity is **`init`**, meaning that Uiza is still allocating resources for your entity and your live signal will not be able to be ingested and broadcasted during this process. Please, be patient and keep requesting for the entity's information until you get the **`ready`** status. This process may take up to 1 minute.
{% endhint %}
## /v1/live\_entities/:id
`GET` `https://api.uiza.sh/v1/live_entities/:id`
#### Path Parameters
| Name | Type | Description |
| ---- | ------ | ------------------------------------------------------------------ |
| id | string | The unique identifier of a live entity to be retrieved information |
{% tabs %}
{% tab title="200 " %}
```
{
"id": "2b970a39-874a-4d2a-be8a-fd445646d74c",
"name": "Test Event",
"description": "Test 1",
"ingest": {
"url": "rtmp://f45dd07a0e-in.uizadev.io/transcode",
"key": "live_TB62vHgxSY"
},
"playback": {
"hls": "https://f45dd07a0e.uizadev.io/fmp4/22013d8a-d5fa-48f0-9a63-1f471ca9e81d/master.m3u8"
},
"region": "in-bangalore-1",
"status": "ready",
"dvr": false,
"broadcast": "offline",
"created_at": "2019-12-11T02:47:04Z",
"updated_at": "2019-12-16T02:53:30Z"
}
```
{% endtab %}
{% endtabs %}
{% code title="Sample Request" %}
```go
curl -X GET https://api.uiza.sh/v1/live_entities/2b970a39-874a-4d2a-be8a-fd445646d74c \
-H 'Authorization: uap-c1ffbff4db954ddcb050c6af0b43ba56-41193b64'
```
{% endcode %}
{% hint style="info" %}
You could also set up a [webhook](https://docs.uiza.io/api-reference/webhook_endpoints) to be notified automatically when your `live_entity` is ready.
{% endhint %}
## **Step 3: Configure your broadcasting software and start broadcasting**
Most available broadcasting software uses [RTMP protocol](https://en.wikipedia.org/wiki/Real-Time_Messaging_Protocol) which requires a *server's URL* and a *Stream Key* to direct the live signal to the ingest servers. Use the `ingest.url` and `ingest.key` obtained at **Step 2** to configure your broadcasting software in their Settings. The following are the 2 most popular broadcasting software that we strongly recommend.
{% hint style="info" %}
**OBS Studio** (Available for Mac, Windows, and Linux**)** - Get it [here](https://obsproject.com/).
{% endhint %}
{% hint style="info" %}
**Streamlabs (**The best live streaming app for iPhone & Android**)** - Get it [here](https://streamlabs.com/mobile-app).
{% endhint %}
Once you have configured the `ingest.url` and `ingest.key`, you could start streaming right away.
## **Step 4: Configure the playback link to your player and start watching your live stream!**
The playback links (`hls` for HLS streaming and `mpd` for MPEG-dash streaming) of your live entity is the value of `playback` returned in ***Step 2*****.** With the HLS link obtained, you could play your live stream by these methods:
1. Configure the HLS link to Player SDK.
2. Paste the HLS link to Safari and play directly with Apple's native player.
3. Install the HLS extension and play it on Google Chrome browser.
The `mpd` video format could be played natively by [Microsoft Edge](https://www.microsoftedgeinsider.com/en-us/).
By following these *4 steps*, you will be able to live stream your event using Uiza:pray:. We understand that this beta version of ours requires quite some amount of manual involvement, but we are working hard to deliver a more delightful experience with more APIs and automation. If you are ready to live-stream your first event, let's move on to the ***API Reference***.
# Video Streaming
**Streaming videos** with Uiza is pretty straightforward where the whole process could be summarized in 4 simple steps:
1. You give us the video,
2. You allow us to publish the video,
3. We let you know when your video is published, and
4. You tell your player to start streaming :nerd:
## Step 1: Create a video entity
You can create a [`video_entity`](https://docs.uiza.io/api-reference/video-entities) using HTTP/HTTPS URL links to your original video files. In case the video file is located in your PC, you can upload the video via the [Uiza Developer Console](https://app.uiza.io/) by following these steps:
1. Login to Uiza Developer Console
2. **Start** your application, then go to **Upload Video** page
3. Browse to your local video file or enter multiple HTTP/HTTPS URLs
4. Click **Proceed** to start uploading your selected video files
Successfully uploaded `video_entities` will be ingested and listed out in the Developer Console. To transcode the video, click on "Publish" or move to step 2.
Go to **Entities** page and select created video entity for checking `id` and other details.
## Step 2: Publish the video entity
The renditions of your video, as the output of transcoding, will be distributed to Uiza's [Content Delivery Network](https://en.wikipedia.org/wiki/Content_delivery_network) (CDN) through which it is delivered to viewers.
To let Uiza know that you are ready to publish your video to your viewers, you can use [Uiza Developer Console](https://app.uiza.io/) or send a request to ***Publish a video entity*** API.
## /v1/video\_entities/:id/publish
`POST` `https://api.uiza.sh/v1/video_entities/:id/publish`
#### Path Parameters
| Name | Type | Description |
| ---- | ------ | --------------------------------------------------- |
| id | string | The identifier of the video entity to be published. |
{% tabs %}
{% tab title="200 " %}
```
{
"message": "Video entity started to publish successfully"
}
```
{% endtab %}
{% endtabs %}
{% code title="Sample Request" %}
```
curl -X POST https://api.uiza.sh/v1/video_entities/f42b4ac3-869e-4010-8e21-042e40be7655/publish
-H 'Accept: */*'
-H 'Authorization: uap-c1ffbff4db954ddcb050c6af0b43ba56-41193b64'
-H 'Cache-Control: no-cache'
-H 'Connection: keep-alive'
```
{% endcode %}
## Step 3: Retrieve the video entity's information
The process of transferring the renditions of your video to Uiza's CDN takes time. You player can only start playing the video after it has been successfully published. To keep track of this process, retrieve the video entity's information. The `publish_to_cdn` argument indicates the publishing status of your video entity. If the value is `success`, you are good to go.
## /v1/video\_entities/:id
`GET` `https://api.uiza.sh/v1/video_entities/:id`
#### Path Parameters
| Name | Type | Description |
| ---- | ------ | --------------------------------------------------- |
| id | string | The identifier of the video entity to be retrieved. |
{% tabs %}
{% tab title="200 " %}
{% tabs %}
{% tab title="The Video Entity has not been published" %}
```
{
"id": "f42b4ac3-869e-4010-8e21-042e40be7655",
"name": "Sample Demo-Video",
"description": "Lorem ipsum dolor sit amet, vis odio oratio scripserit ut",
"short_description": "Duo ad graeci principes, legimus mnesarchum scribentur ut pro",
"view": 1000,
"poster": "Lorem ipsum dolor",
"thumbnail": "Lorem ipsum dolor",
"type": "VOD",
"duration": 11213,
"publish_to_cdn": "queue",
"created_at": "2019-12-11T02:47:04Z",
"updated_at": "2019-12-11T02:47:04Z"
}
```
{% endtab %}
{% tab title="The Video Entity is published successfully" %}
```
{
"id": "77123e09-a30b-456b-b954-c16fe81f97f7",
"name": "test 998",
"description": "Entity for Test",
"short_description": "",
"view": 0,
"poster": "",
"thumbnail": "",
"input_type": "UNKNOWNVODINPUTTYPE",
"duration": 269.588,
"publish_to_cdn": "success",
"playback": {
"hls": "https://dvr-playback-secure.uizadev.io/05bb5869-e134-4e9e-a2d2-de5c77dd182f/77123e09-a30b-456b-b954-c16fe81f97f7/master.m3u8",
"hls_ts": "",
"mpd": ""
},
"created_at": "2020-02-12T12:28:00Z",
"updated_at": "2020-02-12T12:32:30Z"
}
```
{% endtab %}
{% endtabs %}
{% endtab %}
{% endtabs %}
{% code title="Sample Request" %}
```
curl -X GET https://api.uiza.sh/v1/live_entities/22013d8a-d5fa-48f0-9a63-1f471ca9e81d
-H 'Accept: */*'
-H 'Accept-Encoding: gzip, deflate'
-H 'Authorization: uap-c1ffbff4db954ddcb050c6af0b43ba56-41193b64'
-H 'Cache-Control: no-cache'
-H 'Connection: keep-alive'
```
{% endcode %}
## Step 4: **Configure the playback link to your player and start streaming!**
Three playback links are returned in the response of Step 3. These playback links represent the 3 streaming protocols that Uiza currently supports:
* `hls` for HLS fMP4 streaming,
* `hls_ts` for HLS ts streaming, and
* `mpd` for MPEG-dash streaming.
Configure these playback links to your player will enable your player to get the video chunks from Uiza's CDN, decode and display them to your viewers. And that is How to stream your first video with Uiza in 4 simple steps. :wink:
# Pagination
Uiza's List method is using page-based pagination, this is one of the simplest forms of paging. Initially, only a certain number of results will be returned at a time. The default is 50.
#### Arguments
> **`limit`** *number*
>
> The maximum number of objects to be returned per call, between 1 and 50. The default `limit` is 50.
> **`page`** *number*
>
> Indicates the page number, the page being the one requested. By default, this query parameter is equal to 1.
{% code title="Sample Response" %}
```
{
"data": {
"items": [
{
"id": "22013d8a-d5fa-48f0-9a63-1f471ca9e81d",
"name": "Demo app 1",
"description": "Demo application for documentation",
"dvr": true,
"encoding_template": "none",
"ingest": {
"url": "rtmp://f45dd07a0e-in.uizadev.io/transcode",
"key": "live_TB62vHgxSY"
},
"playback": {
"hls": "https://f45dd07a0e.uizadev.io/fmp4/22013d8a-d5fa-48f0-9a63-1f471ca9e81d/master.m3u8",
"dash": "https://f45dd07a0e.uizadev.io/fmp4/22013d8a-d5fa-48f0-9a63-1f471ca9e81d/manifest.mpd"
},
"region": "in-mumbai-1",
"relay": [
{
"id": "8cf47749-1fa4-40e9-8303-580b34f14683",
"name": "Replay name3333",
"url": "rtmp://a.rtmp.youtube.com/live2",
"key": "0df3-76bz-6t4r-1by5xxxxxx",
"status": "enable",
"created_at": "2020-06-24T16:25:58Z",
"updated_at": "2020-06-24T16:25:58Z"
}
],
"status": "ready",
"created_at": "2020-03-10T03:20:37.202Z",
"updated_at": "2020-03-10T03:20:37.202Z"
}
],
"total": 99
}
}
```
{% endcode %}
# Recommended Specifications
*Live broadcasting*, especially in high resolution, consumes significant resources from your devices. Therefore, we recommend the following specifications for the *optimal* streaming experience.:metal:
| | >";
const url = "https://api.uiza.sh/api/v5/live/entities";
const default_headers = {
"Content-Type": "application/json",
"Authorization": authorization_key
}
```
Then we import Axios to send `GET` and `POST` requests:
```javascript
const axios = require('axios').default;
```
#### Paging and navigation.
We divide the app into two parts:
1. Broadcast Page: Will contain the functionality to create a new broadcast.
2. View Page: This will display all broadcasts currently in the system, with online broadcasts as a green tile and offline broadcasts as an orange-red.
### Step 3. Building the Broadcast Page
Let us start with the broadcast page design.
#### Creating default states
We use application-wide states that can be displayed in the application, and manipulated at run-time. As you can see, we can set default values with states. Our default region value is `in-bangalore-1`
```javascript
state = {
message: '',
region_value: 'in-bangalore-1',
broadcast_url: '',
broadcast_key: ''
};
```
#### Define a function to start a broadcast
We define this function as `start_broadcast`. We clear the states and set the message state to `fetching`. Then we start loading the information.
```javascript
this.setState({message: "Fetching"});
this.setState({broadcast_url: ""});
this.setState({broadcast_key: ""});
```
Now we set the parameters, so that we can make the `create entity` call. The below structure contains all the information of the HTTP request that we pass to Axios. As you can see, we make use of the `region_value` state to set the region to a supported value.
```javascript
var broadcast_create_options = {
"method": "post",
"url": "https://development-api.uizadev.io/api/v5/live/entities",
"headers": default_headers,
"data": {
"name": 'Demo app',
"region": this.state.region_value,
"description": 'Application description'
}
};
```
Now let's create the polling call structure so that we don't end up creating the same structure from the loop. As you can see it will be a `GET` request. Authorization header will expect your API key.
```javascript
var broadcast_polling_options = {
"method": "get",
"headers": default_headers,
"data": {
"name": 'Demo app',
"region": this.state.region_value,
"description": 'Application description'
}
};
```
We make a `POST` request to create an entity.
```javascript
var create_response = await axios(broadcast_create_options);
console.log('Response Received')
```
The call returns the entity `id` in the respone.
```javascript
var broadcast_id = create_response.data.id;
this.setState({message: 'broadcast Created: '+ broadcast_id});
```
The `GET` method takes the entity `id` and returns the broadcast information (including the stream URL and key).
```javascript
broadcast_polling_options["url"] = url + "/" + broadcast_id;
```
To get the stream URL and key, the entity has to be in a `ready` state. We use `setInterval` to poll the API every 3 seconds to check the status of the entity using `response.data.status`.
The initial status of an entity is `init`. When the server is ready with a stream URL and key, the status becomes `ready`.
If the status is not`ready` yet, we continue polling and the current state of `message` will be set to `Polling`.
Once the status is `ready` we can extract `url` and `key` from the response.
`self.setState({ message: 'Polling' + '.'.repeat(1 + counter%3) });`
The above code creates a nice text animation so that we know the program is not stuck and is working.
```javascript
var counter = 0;
var self = this;
var poll_interval = setInterval(async function() {
try {
var response = await axios(broadcast_polling_options);
if (response.data.status === "ready") {
self.setState({ message: "Stream is now ready" });
self.setState({ broadcast_url: "URL: " + response.data.ingest.url });
self.setState({ broadcast_key: "Key: " + response.data.ingest.key });
clearInterval(poll_interval);
} else {
self.setState({ message: 'Polling' + '.'.repeat(1 + counter%3) });
}
counter = counter + 1;
} catch (error) { console.log(error) }
}, 3000);
```
### Step 4. Building the broadcast page UI
We build a very simple user interface. The front page will have a drop-down menu to select the `region_value`. This drop-down contains the following regions (you can find the available regions here: [Regions](https://starboy.gitbook.io/uiza-doc/getting-started/regions)):
* in-bangalore-1
* in-mumbai-1
We create a `Start broadcast` button to call the `start_broadcast` function. The three lines below are important. They leverage the state value to display current states.
The first line displays the messages from the program's status: `Fetching`, `Polling` etc.
```javascript
{this.state.message}
``` The second line contains the stream URL (i.e. `stream_url`) ```javascript {this.state.broadcast_url}
``` The third line contains the key for the stream key (i.e `stream_key`) ```javascript {this.state.broadcast_key}
``` #### Putting the broadcast page UI together: ```javascript render() { return (
)
}
}
export default App;
```
### Step 5. Building the View Page
The view page contains tiles that correspond to available streams. Green tiles are online entities and red tiles are offline entities.
The following `load_alive_streams` function loads the streams. Available streams are loaded and saved to `state` so that they update automatically.
```javascript
load_alive_streams = async () => {
var options = {
"method": "get",
"url": url,
"headers": {
"Content-Type": "application/json",
"Authorization": authorization_key
}
};
var response = await axios(options);
var data = response.data.data;
var streams = [];
data.forEach(element => {
try {
streams.push({
online: element.broadcast === 'online' ? true : false,
stream_url: element.ingest.stream_url,
stream_key: element.ingest.stream_key,
playback_url: element.playback.hls
})
} catch (err) { }
});
this.setState({
streams: streams,
last_loaded: new Date()
});
console.log(`Completed reading data: ${streams.length} streams are online now!`);
}
```
#### Rendering the view page UI
We create a dynamic list of VideoTiles, and populate it on every render(). We use a 5-second interval between each render, to not overdo it. Then we access the details from the properties of the Video at the time of creation. We use the properties to pass values to the inner components of the tile and make it look functional.
For example: `{this.props._url}` accesses the `_url` parameter from `` The same approach is used for the key and the playback URL.
The tile has to be clickable and take the viewer to the live stream. For that, we make use of routing in our application and send the user to a page with video playback url. The playback page is dynamically generated and plays the video.
```javascript
```
The above line sends the user to an `href` link which is understood by the router later. The regex removes the protocol from the URL (i.e http / https)
Following code shows the VideoTile component:
```javascript
class VideoTile extends Component {
render() {
return (
)
}
```
### Step 6. Playback the live stream
Now we have the video tiles ready but what do we show when this tile is clicked? This clever little view code launches the player on screen. We launched the player on the screen when the tile is clicked with the following code:
```javascript
function VideoPage() {
let { videoid } = useParams();
return (
)
}
}
```
The streams are loaded when we click on the viewer with the below line. Following line loads the streams on click: `Viewer Page`
The routing path below with `*` wildcard enables video stream url to be parsed with `/` and to be sent to the video page. Otherwise, the videoid is split at the first occurence of `/`
```javascript
# Java Live Streaming App
How to build your live streaming web app with Uiza’s API using React and Java
Uiza provides intuitive APIs, which simplifies the integration of live streaming functionality into your platform. This guide is a step-by-step tutorial on how to build your live streaming app with Uiza’s APIs. The web app will have two components: the broadcaster web app, to start a stream, and the viewer app, to list all broadcasts and playback the broadcast.
## Components of our live streaming app
Sample code is provided below on how to build a simple web app to call on Uiza’s API. The language used for web app is Javascript.
#### Uiza Streaming Concept
To understand the flow of the this tutorial, following terminologies are explained by the graph below.
During this documentation, broadcast, live streaming and streaming will be usede interchangeably.
#### Building a Live streaming Web App with Uiza
To have a live streaming app, we have to distinguish between a broadcaster and a viewer. A broadcaster streams the live stream and a viewer watches the live stream - this is a one way interaction channel, hence we have to build 2 separate pages: a broadcasting page and a viewer page. Tha broadcaster needs to start a broadcast through a stream URL and key, while the viewer sees the active live streams and can watch them through the web app.
## Building the live streaming JAVA app (Backend)
### Step 1. Getting started with Uiza Java application
To start a broadcast with Uiza Java App, we will need to configure stream\_url and stream\_key in application propeties file.
We need an API key to access Uiza's services. To get your API key, create an account at Uiza here: [Sign Up Link](https://id.uiza.io/register). Once you are in the developer console, you will see your API key. Configured your API key and URL in application properties as below.
We have created Java because we can not pass API key through browser. If we pass API key through browser then anyone can stole our API key and use Uiza api. So using JAVA app, we are storing this API key in the JAVA property file and calling Uiza api from Java App.
```
application.uiza.url= https://api.uiza./v1/live_entities
application.uiza.authorization-token="API Key"
```
### Step 2. Deploy/Run Java App
Download the Java sample code at [Github link](https://github.com/uizaio/uiza-live-java-server-integration)
1. Go To Project Directory
```
cd uiza
```
2. Run below command
```
mvn clean install
```
3. After step 2 finishes installation, go to `target` directory inside the project.
```
cd target
```
4. Run the below command to run java application. Java application will run 8080 port.
```
java -jar uiza-0.0.1-SNAPSHOT.jar
```
### Step 3. This guide will help you create a simple REST service using Spring Boot.
In this guide, we will create three services using proper URIs and HTTP methods:
* @GetMapping("/app/live/entities"): You can retrieve the live entities using request method Get and example uri /app/live/entities.
* @GetMapping("/app/live/entities/{id}"): You can retrieve a specific live entity using request method Get and example uri /app/live/entities/1.
* @PostMapping("/app/live/entities") : You can create a live entity by sending a POST request to URI /app/live/entities
#### Using appropriate Request Methods
Always use HTTP Methods. Best practices with respect to each HTTP method is described below:
* `GET` : Should not update anything. Should be idempotent (same result in multiple calls). Possible Return Codes 200 (OK) + 404 (NOT FOUND) +400 (BAD REQUEST)
* `POST` : Should create new resource. Ideally return JSON with link to newly created resource. Same return codes as get possible. In addition : Return code 201 (CREATED) is possible.
* `PUT` : Update a known resource. ex: update client details. Possible Return Codes : 200(OK)
* `DELETE` : Used to delete a resource.
#### Project Structure
Following screenshot shows the structure of the project we have created.  **A few details:**
* **LiveEntityResource.java** - Rest controller exposing all the three service methods discussed above.
* **LiveEntity.java** - Business Logic for the application.
* **UizaApplication.java** - Launcher for the Spring Boot Application. To run the application, just launch this file as Java Application.
* **pom.xml** - Contains all the dependencies needed to build this project. We will use Spring Boot Starter Web.
#### Adding Couple of GET Rest Services
The Rest Service LiveEntityResource exposes couple of get services.
@Autowired private RestTemplate restTemplate : We are using Spring Autowiring to wire the RestTemplate service into the LiveEntityResource. This rest template will use for call Uiza server api to get/create live entity. @Value("${application.uiza.url}") private String ulzaUrl : Use the uiza server url that we have configured in step1.
@PathVariable String id: Value of live entity id from the uri will be mapped to this parameter. package com.uiza.api.rest;
```
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.client.RestTemplate;
import com.uiza.api.dto.GetLiveEntityResponse;
import com.uiza.api.dto.LiveEntity;
@CrossOrigin(origins = "*")
@RestController
@RequestMapping("/app/live/entities")
public class LiveEntityResource {
@Autowired
private RestTemplate restTemplate;
@Value("${application.uiza.url}")
private String ulzaUrl;
@GetMapping
public GetLiveEntityResponse getLiveEntities() {
ResponseEntity responseEntity = restTemplate.getForEntity(ulzaUrl,
GetLiveEntityResponse.class);
return responseEntity.getBody();
}
@GetMapping("/{id}")
public LiveEntity getLiveEntities(@PathVariable String id) {
ResponseEntity responseEntity = restTemplate.getForEntity(ulzaUrl + "/" + id, LiveEntity.class);
return responseEntity.getBody();
}
}
```
**Executing the Get Service for retrieve all live Using Postman.**
We will fire a request to to test the service. Response is as shown below.
```
[{
"id": "2b970a39-874a-4d2a-be8a-fd445646d74c",
"user_id": "uiza",
"app_id": "uiza",
"name": "Test Event",
"description": "Event for Test",
"region": "in-bangalore-1",
"status": "init",
"created_at": "2019-10-03T17:34:49Z",
"updated_at": "2019-10-03T17:34:49Z"
}]
```
**Executing the Get Service to retrieve live entity by id Using Postman**
We will fire a request to to test the service. Response is as shown below.
```
{
"id": "2b970a39-874a-4d2a-be8a-fd445646d74c",
"user_id": "uiza",
"app_id": "uiza",
"name": "Test Event",
"description": "Event for Test",
"region": "in-bangalore-1",
"status": "init",
"created_at": "2019-10-03T17:34:49Z",
"updated_at": "2019-10-03T17:34:49Z"
}
```
#### Adding a POST Rest Service
A POST Service should return a status of created (201) when the resource creation is successful.
@PostMapping("/app/live/entities"): Mapping a url for the POST Request @RequestBody LiveEntity liveEntity: Using Binding to bind the body of the request to LiveEntity object. responseEntity.getBody(): Return a status of created. Also return the location of created resource as a Response Header.
```
@PostMapping
public LiveEntity createLiveEntity(@RequestBody LiveEntity liveEntity) {
ResponseEntity responseEntity = restTemplate.postForEntity(ulzaUrl, liveEntity, LiveEntity.class);
return responseEntity.getBody();
}
```
**Executing a POST Rest Service**
Example Request is shown below. It contains all the details to create a live entity.
```
{
"name": "Demo",
"description": "AFF CUP",
"region": "in-bangalore-1"
}
```
Example Response is shown below. It contains all the details that has been created for live entity.
```
{
"id": "2b970a39-874a-4d2a-be8a-fd445646d74c",
"user_id": "uiza",
"app_id": "uiza",
"name": "Test Event",
"description": "Event for Test",
"region": "in-bangalore-1",
"status": "init",
"created_at": "2019-10-03T17:34:49Z",
"updated_at": "2019-10-03T17:34:49Z"
}
```
#### Modification in live entity
* Suppose if we have to add new field in live entity then we have to do as below example.
* For example, If we have to add new field(abc) in live entity then we have to do below modification in LiveEntity.java
```javascript
private String abc;
public String getAbc(){ return abc; }
public void setAbc(String abc){ this.abc = abc; }
```
## Building the live streaming app (front-end part)
```
## Step 1. Creating a new Project and install dependencies
To build a broadcast web app, we start with creating a new react web application.
Let us create a brand new application.
Open terminal / command prompt and execute the below lines to create a starter app:
1. Create a new project
```
### Step 1. Creating a new Project and install dependencies
To build a broadcast web app, we start with creating a new react web application.
Let us create a brand new application.
Open terminal / command prompt and execute the below lines to create a starter app:
#### 1. Create a new project
To build a broadcast web app, we start with creating a new react web application. Let us create a brand new application. Open terminal / command prompt and execute the below lines to create a starter app:
`npx create-react-app uiza`
#### 2. Get into the project directory
`cd uiza`
#### 3. Start the development server.
`npm start`
#### Getting started with Uiza
To start a broadcast with Uiza we will need to do two things:
1. Create a live entity in Uiza servers.
2. Get the stream\_url and stream\_key for this entity.
#### Install program dependencies
To increase the readability of this tutorial, we use the Axios library to send requests to the Uiza server. Install Axios with the following command:
`` `npm install axios` ``
To play the video stream we will need a player control. Install react-player with the following command:
`` `npm install react-player` ``
### Step 2. Make changes to the App.js
Open the \`App.js\` file in the \`src\` directory.
#### Import repositories
Import react, router, react video player and css file.
```javascript
import React, { Component } from 'react';
import ReactPlayer from 'react-player';
import './App.css';
import {
BrowserRouter as Router,
Switch,
Route,
Link,
useParams
} from "react-router-dom";
```
We need an JAVA API to access Uiza's services.
```javascript
const url = "https://api.uiza.sh/app/live/entities";
const default_headers = {
"Content-Type": "application/json"
}
```
Then we import axios to send get and post requests:
```javascript
const axios = require('axios').default;
```
#### Paging and navigation.
We divide the app into two parts:
1. Broadcast Page: Will contain the functionality to create a new broadcast.
2. View Page: This will display all broadcasts currently in the system, with online broadcasts as a green tile and offline broadcasts as an orange-red.
### Step 3. Building the Broadcast Page
Let us start with the broadcast page design.
#### Creating default states
We use application-wide states that can be displayed in the application, and manipulated at run-time. As you can see, we can set default values with states. Our default region value is `in-bangalore-1`
```javascript
state = {
message: '',
region_value: 'in-bangalore-1',
broadcast_url: '',
broadcast_key: ''
};
```
#### Define a function to start a broadcast
We define this function as `start_broadcast`. We clear the states and set the message state to `fetching`. Then we start loading the information.
```javascript
this.setState({message: "Fetching"});
this.setState({broadcast_url: ""});
this.setState({broadcast_key: ""});
```
Now we set the parameters, so that we can make the `create entity` call. The below structure contains all the information of the HTTP request that we pass to Axios. As you can see, we make use of the `region_value` state to set the region to a supported value.
```javascript
var broadcast_create_options = {
"method": "post",
"url": "https://api.uiza.sh/api/v5/live/entities",
"headers": default_headers,
"data": {
"name": 'Demo app',
"region": this.state.region_value,
"description": 'Application description'
}
};
```
Now let's create the polling call structure so that we don't end up creating the same structure from the loop. As you can see it will be a `GET` request. Authorization header will expect your API key.
```javascript
var broadcast_polling_options = {
"method": "get",
"headers": default_headers,
"data": {
"name": 'Demo app',
"region": this.state.region_value,
"description": 'Application description'
}
};
```
We make a `POST` request to create an entity.
```javascript
var create_response = await axios(broadcast_create_options);
console.log('Response Received')
```
The call returns the entity `id` in the response.
```javascript
var broadcast_id = create_response.data.id;
this.setState({message: 'broadcast Created: '+ broadcast_id});
```
The `GET` method takes the entity `id` and returns the broadcast information (including the stream URL and key).
```javascript
broadcast_polling_options["url"] = url + "/" + broadcast_id;
```
To get the stream URL and key, the entity has to be in a `ready` state. We use setInterval to poll the API every 3 seconds to check the status of the entity using `response.data.status` The initial status of an entity is `init`. When the server is ready with a stream URL and key, the status becomes `ready`
If the status is not`ready` yet, we continue polling and the current state of `message` will be set to `Polling`
Once the status is `ready` we can extract `url` and `key` from the response.
`self.setState({ message: 'Polling' + '.'.repeat(1 + counter%3) });`
The above code creates a nice text animation so that we know the program is not stuck and is working.
```javascript
var counter = 0;
var self = this;
var poll_interval = setInterval(async function() {
try {
var response = await axios(broadcast_polling_options);
if (response.data.status === "ready") {
self.setState({ message: "Stream is now ready" });
self.setState({ broadcast_url: "URL: " + response.data.ingest.url });
self.setState({ broadcast_key: "Key: " + response.data.ingest.key });
clearInterval(poll_interval);
} else {
self.setState({ message: 'Polling' + '.'.repeat(1 + counter%3) });
}
counter = counter + 1;
} catch (error) { console.log(error) }
}, 3000);
```
### Step 4. Building the broadcast page UI
We build a very simple user interface. The front page will have a drop-down menu to select the `region_value`. This drop-down contains the following regions (you can find the available regions here: [Regions](https://starboy.gitbook.io/uiza-doc/getting-started/regions)):
* in-bangalore-1
* in-mumbai-1
We create a `Start broadcast` button to call the `start_broadcast` function. The three lines below are important. They leverage the state value to display current states.
The first line displays the messages from the program's status: `Fetching`, `Polling` etc.
```javascript
{this.state.message}
``` The second line contains the stream URL (i.e. `stream_url`) ```javascript {this.state.broadcast_url}
``` The third line contains the key for the stream key (i.e `stream_key`) ```javascript {this.state.broadcast_key}
``` #### Putting the broadcast page UI together: ```javascript render() { return (
)
}
}
export default App;
```
### Step 5. Building the View Page
The view page contains tiles that correspond to available streams. Green tiles are online entities and red tiles are offline entities.
The following `load_alive_streams` function loads the streams. Available streams are loaded and saved to `state` so that they update automatically.
```javascript
load_alive_streams = async () => {
var options = {
"method": "get",
"url": url,
"headers": {
"Content-Type": "application/json"
}
};
var response = await axios(options);
var data = response.data.data;
var streams = [];
data.forEach(element => {
try {
streams.push({
online: element.broadcast === 'online' ? true : false,
stream_url: element.ingest.url,
stream_key: element.ingest.key,
playback_url: element.playback.hls
})
} catch (err) { }
});
this.setState({
streams: streams,
last_loaded: new Date()
});
console.log(`Completed reading data: ${streams.length} streams are online now!`);
}
```
#### Rendering the view page UI
We create a dynamic list of VideoTiles, and populate it on every render(). We use a 5-second interval between each render, to not overdo it. Then we access the details from the properties of the Video at the time of creation. We use the properties to pass values to the inner components of the tile and make it look functional.
For example: `{this.props._url}` accesses the `_url` parameter from `` The same approach is used for the key and the playback URL.
The tile has to be clickable and take the viewer to the live stream. For that, we make use of routing in our application and send the user to a page with video playback url. The playback page is dynamically generated and plays the video.
```javascript
```
The above line sends the user to an `href` link which is understood by the router later. The regex removes the protocol from the URL (i.e http / https)
Following code shows the VideoTile component:
```javascript
class VideoTile extends Component {
render() {
return (
)
}
```
### Step 6. Playback the live stream
Now we have the video tiles ready but what do we show when this tile is clicked? This clever little view code launches the player on screen. We launched the player on the screen when the tile is clicked with the following code:
```javascript
function VideoPage() {
let { videoid } = useParams();
return (
)
}
}
```
The streams are loaded when we click on the viewer with the below line. Following line loads the streams on click: `Viewer Page`
The routing path below with `*` wildcard enables video stream url to be parsed with `/` and to be sent to the video page. Otherwise, the videoid is split at the first occurence of `/`
```javascript
# Python Live Streaming App
How to build your live streaming web app with Uiza’s API using Python
Uiza provides intuitive APIs, which simplifies the integration of live streaming functionality into your platform. This guide is a step-by-step tutorial on how to build your live streaming app with Uiza’s APIs. The web app will have two components: the broadcaster web app, to start a stream, and the viewer app, to list all broadcasts and playback the broadcast.
## Components of our live streaming app
Sample code is provided below on how to build a simple web app to call on Uiza’s API. The language used for web app is Python.
#### Uiza Streaming Concept
To understand the flow of the this tutorial, following terminologies are explained by the graph below.
During this documentation, broadcast, live streaming and streaming will be usede interchangeably.
#### Building a Live streaming Web App with Uiza
To have a live streaming app, we have to distinguish between a broadcaster and a viewer. A broadcaster streams the live stream and a viewer watches the live stream - this is a one way interaction channel, hence we have to build 2 separate pages: a broadcasting page and a viewer page. Tha broadcaster needs to start a broadcast through a stream URL and key, while the viewer sees the active live streams and can watch them through the web app.
## Building the live streaming app
### Prerequisites
Install following dependencies in terminal
### Step 1. Creating a new Project and install dependencies
#### Dependencies
`pip install python`
`pip install django`
`pip install json`
To build a broadcast web app, we start with creating a new python project.
#### Creating a new Project
1. Open your favorite editor
2. Open the terminal
3. Type: django-admin createproject (this makes a directory with your project name) in the terminal
4. Go to your project directory `cd project name`
5. To create your app, type: `django-admin createApp `(this creates an app inside your project)
6. Create a templates folder in which your html files will be held.Templates folder will be in project folder.
your project directory structure should look like this
**Don't worry about the project and app name, as any name will work.**
7. Open `setting.py` and add the app name to the installed apps list. Also add templates path to templates dir.
#### Setting up the templates folder
Create 4 html files in templates folder:
1. `base.html`
2. `homepage.html`
3. `viewspage.html`
4. `broadcastpage.html`
For now leave these empty.
#### Django connects and renders:
We will define some urls in the `urls.py` file in project directory. There we write the view name, which performs some functions and renders a html file.
`url eg: path('viewers/', views.viewerspage, name = 'viewers')` so here 'viewers/' is the url that will be added to localhost, views.viewerspage is name of views which will perform some functions on this url and name = 'viewers' is used to redirect to another view from html file after submission which we will use later.
### Step 2. Setting up the URLS
You must have noticed the `urls.py` file in the project directory. Lets open it and see what it does. In the file we see some imports and a list named url patterns. As discussed we need to connect urls and views, so we will import views to `urls.py` file
`from app name import views`
We will make some urls in url patterns list like this.
`admin/` was defined already, that is the default url provided by Django and Django is known for this feature of providing an admin portal which keeps all the database of your website. But let's take example of `viewers/` url. Lets divide this into 3 parts: url, view, and name
**URL** - what URL should appear at the URL bar
**View** - what view to call when user puts this URL in the URL bar.
**Name** - this is name of url which we will use when talking about templates to redirect to other urls from html pages.(don't worry if it is not clear now)
````
now we will make some urls in url patterns list like this.
so 'admin/' was defined already, that is the default url provided by django and django is known for this feature of providing an admin portal which keeps all the database of your website.
But let's take example of 'viewers/' url.
so lets divide this into 3 parts url,view,name
**Url** - what url should appear at the url bar
**View** - what view to call when user puts this url in the url bar.
**Name** - this is name of url which we will use when talking about templates to redirect to other urls from html pages.(don't worry if it is not clear now)
## Step 2. Setting up authorization
We need an API key to access Uiza's services. The URL to access the services will be the same, so we're saving it as a constant. The default headers will be common for every API call.
To get your API key, create an account at Uiza here: [Sign Up Link](https://id.uiza.io/register). Once you are in the developer console, you will see your API key.
Following code shows the constants:
```python=
Authorization_key = "<>"
url = 'https://development-api.uizadev.io/v1/live_entities'
````
### Step 2. Setting up authorization
We need an API key to access Uiza's services. The URL to access the services will be the same, so we're saving it as a constant. The default headers will be common for every API call.
To get your API key, create an account at Uiza here: [Sign Up Link](https://id.uiza.io/register). Once you are in the developer console, you will see your API key.
Following code shows the constants:
```python
Authorization_key = "<>"
url = 'https://development-api.uizadev.io/v1/live_entities'
```
#### Paging and navigation.
We divide the app into two parts:
1. Broadcast Page: Will contain the functionality to create a new broadcast.
2. View Page: This will display all broadcasts currently in the system, with online broadcasts as a green tile and offline broadcasts as an orange-red.
### Step 3. Building the Broadcast Page
Let us start with the broadcast page design.
#### Creating default states
We use global variables that can be displayed in the application, and manipulated at run-time.
```python
stream_key = ''
stream_url = ''
stream_hls = ''
NotPlayable = True
```
#### Define a view to start a broadcast
**Note:** a function in python is called a view in Django. The below structure contains all the information of the HTTP request.
As you can see, we make use of the `region` state to set the region to a supported value.
We will create an Entity using the `POST` method:
So what below view does?
First, it checks if the request method is a POST method. If it is not, then a simple html page is rendered.
Otherwise, the if condition is triggered and the POST method will be called after the submit button of form is clicked, which we will see in the html file.
Then we make a POST request using the parameters and get back a json response from the Uiza API
The parameter are defined in Uiza's API documentation.
```python
#when broadcast button is click post method is triggered
def create_event(request):
if request.method == "POST":
region = request.POST['region']
# necessary headers and data for the post request
headers = {'Authorization': Authorization_key ,
'Content-Type': 'application/json',
'cache-control': 'no-cache' }
data = {
"name":"Demo",
"region":region,
"description":"AFF CUP"
}
#post request for the id of live stream
response = requests.post(url = url, headers = headers, params= data)
print(response.text)
#convert the response to json
live_response = json.loads(response.text)
#retrieved id from json
created_id = live_response["id"]
```
Using the retrieved entity, we call the 'GET' method with `id` as value. The authorization header expects your API key.
```python
# Now make the get request using the headers and using the id retrieve the stream_key,stream_url and playback
get_headers = {
'Accept': '*/*',
'Accept-Encoding': 'gzip, deflate',
'Authorization': Authorization_key,
'Cache-Control': 'no-cache',
'Connection': 'keep-alive'
}
newUrl = url+'/' + created_id
```
Now let's create the polling call structure. This loop will run until the 'status' returned is 'ready'. As soon as the status becomes 'ready', the global variables for `stream_url`, `stream_key`, and `stream_hls` are retrieved from the GET request.
```python
#This while loop will make the get request from the uiza UPI till the status is not ready and retrieve the necessary info and then will render the homepage
while True:
retrieve_entity = requests.get(url = newUrl, headers=get_headers)
retrieve_entity_json = json.loads(retrieve_entity.text)
status = retrieve_entity_json["status"]
print(status)
print(i)
if status == "ready":
print(retrieve_entity_json)
global stream_url
stream_url = retrieve_entity_json["ingest"]["url"]
global stream_key
stream_key = retrieve_entity_json["ingest"]["key"]
global stream_hls
stream_hls = retrieve_entity_json['playback']['hls']
global NotPlayable
NotPlayable = False
return render(request,'homepage.html')
return render(request,'broadcastpage.html') #This render will be called if post request is not made.
```
Now we go to our html pages which we created earlier:
### Step 4. Building the broadcast page UI
We build a very simple user interface. The front page will have a drop-down menu to select the regions. This drop-down contains the following regions (you can find the available regions here: [Regions](https://starboy.gitbook.io/uiza-doc/getting-started/regions)):
* in-bangalore-1
* in-mumbai-1
We create a `Start broadcast` button to call the `start_broadcast` function. The three lines below are important. They leverage the state value to display current states.
Now what does this html page do?
It uses some html tags and Django template tagging. Template tagging is used to insert logic into html. Basically this implements a html form and a Javascript polling function. Now have a look at `action` in form. This is a template tag which tells when form is submitted, then goes to a url whose name is broadcast. Remember we gave names to url paths in the `urls.py` file. Under that you will see csrf token which is cross-site request forgery used with forms always.
Now button tag contains value="submit". This means the value selected by user from the drop down will be attached with submit button so that we can use that value in views.
Polling function is just to give animation, so that when broadcast button is clicked, `Polling...` starts till we get response from the Uiza API. Consider it as loading of another html page.
Also consider: `{% extends 'base.html' %}` . This inherits all the html tags from `base.html` . Writing of repetitive html code for every page is prevented with this; the uniformity of the code is maintained as well.
Everything inside
```markup
{% block body_block %}
{% endblock %}
```
is unique to this html file.
```markup
{% extends 'base.html' %}
{% block body_block %}
{% endblock %}
```
### Step 5. Building the View Page
The view page contains tiles that correspond to available streams.
This view will render simple html page when `NotPlayable` is false; when true, it will send the list of responses to `viewerspage.html`in a context dictionary.
Context dictionary is just the information passed to the html page from the view.
```python
def viewerspage(request):
# if broadcast button is not clicked then this view is rendered
if NotPlayable:
print('got here')
list_of_videos = []
return render(request,'viewerspage.html')
else:
# if broadcast button is clicked then this view is rendered and a context dictionary is passed with stream_key, stream_url, playback link
stream_dict= {'stream_key':stream_key,'stream_url':stream_url,'playback':stream_hls}
list_of_videos.append(stream_dict)
#The last parameter of render is the context dictionary, these are the variables which store useful info that we would want to use in out templates
return render(request,'viewerspage.html',{'list_of_videos':list_of_videos})
```
#### Rendering the view page html
We create a dynamic list of VideoTiles, and populate it on every render(). We use a 5-second interval between each render, to not overdo it. Then we access the details from the properties of the Video at the time of creation. We use the properties to pass values to the inner components of the tile and make it look functional.
For example: `{this.props._url}` accesses the `_url` parameter from `| Live entity object | Before (object) | After (array) |
|---|---|---|
| ingest | | |
| Event type | Data (ingest.url) |
|---|---|
| live_entities.updated | |
HD streaming on desktop
(720p)
|Full-HD streaming on desktop
(1080p)
| **Mobile streaming** | | :-----------------------: | :---------------------------------------------------------------------------: | :---------------------------------------------------------------------------------: | :-------------------------------------------------: | | **Processor** |Intel Core i5 - 5th Gen
or AMD Ryzen
|Intel Core i7 - 5th Gen
or AMD Ryzen 2
| ARM Cortex-s 64 bit | | **Memory** | 8GB | 8GB |2GB for iOS
4GB for Android
| | **Graphics** | Intel integrated GPU | NVDIA GTX 1050 | Not applicable | | **Network** |Wi-fi or Ethernet
(at least 5Mbps of upload speed)
|Ethernet
(at least 10Mbps of upload speed)
|Wi-fi
(at least 5Mbps of upload speed)
| | **Operating System** |Windows 10 and above
MacOS High Sierra and above
|Windows 10 and above
MacOS High Sierra and above
|Android 7 and above
iOS 10 and above
| | **Broadcasting Software** | [OBS](https://obsproject.com/) | [OBS](https://obsproject.com/) | [Streamlabs](https://streamlabs.com/) | # Sample Streaming Apps Uiza provides the video and live streaming API and SDK for your app. These samples introduce various applications based on Uiza API. Refer to the following applications. * [NodeJS Basic Live Streaming App](/2022-06-06/getting-started/sample-streaming-apps/nodejs-live-streaming-app): The project is a sample application written in **NodeJS** and **React** composed of common live streaming features. * [Python Basic Live Streaming App](/2022-06-06/getting-started/sample-streaming-apps/python-live-streaming-app): The project is a sample application written in **Python** composed of common live streaming features. * [Java Basic Live Streaming App](/2022-06-06/getting-started/sample-streaming-apps/java-live-streaming-app): The project is a sample application written in **Java** and **React** composed of common live streaming features. The web app will have two components: the broadcaster web app, to start a stream, and the viewer app, to list all broadcasts and playback the broadcast. This is just a head start! If there’s an integration or sample application you’d like to see or if you’d like to partner with us, [ping us!](mailto:kevin@uiza.io) # NodeJS Live Streaming App How to build your live streaming web app with Uiza’s API using React and NodeJS Uiza provides intuitive APIs, which simplifies the integration of live streaming functionality into your platform. This guide is a step-by-step tutorial on how to build your live streaming app with Uiza’s APIs. The web app will have two components: the broadcaster web app, to start a stream, and the viewer app, to list all broadcasts and playback the broadcast. ## Components of our live streaming app Sample code is provided below on how to build a simple web app to call on Uiza’s API. The language used for web app is Javascript. #### Uiza Streaming Concept To understand the flow of the this tutorial, following terminologies are explained by the graph below.  During this documentation, broadcast, live streaming and streaming will be usede interchangeably. #### Building a Live streaming Web App with Uiza To have a live streaming app, we have to distinguish between a broadcaster and a viewer. A broadcaster streams the live stream and a viewer watches the live stream - this is a one way interaction channel, hence we have to build 2 separate pages: a broadcasting page and a viewer page. The broadcaster needs to start a broadcast through a stream URL and key, while the viewer sees the active live streams and can watch them through the web app. ## Building the live streaming app ### Step 1. Creating a new Project and install dependencies To build a broadcast web app, we start with creating a new react web application. Let us create a brand new application. Open terminal / command prompt and execute the below lines to create a starter app: 1. Create a new project ``` npx create-react-app uiza ``` 2. Get into the project directory ``` cd uiza ``` 3. Start the development server. ``` npm start ``` #### Getting started with Uiza To start a broadcast with Uiza we will need to do two things: 1\. Create a live entity in Uiza servers. 2\. Get the ingest.url and ingest.key for this entity. #### Install program dependencies To increase the readability of this tutorial, we use the Axios library to send requests to the Uiza server. Install Axios with the following command: ```javascript npm install axios ``` To play the video stream we will need a player control. Install react-player with the following command: ```javascript npm install react-player ``` ### Step 2. Make changes to the App.js Open the `App.js` file in the `src` directory. #### Import repositories Import react, router, react video player and css file. ```javascript import React, { Component } from 'react'; import ReactPlayer from 'react-player'; import './App.css'; import { BrowserRouter as Router, Switch, Route, Link, useParams } from "react-router-dom"; ``` We need an API key to access Uiza's services. The URL to access the services will be the same, so we're saving it as a constant. The default headers will be common for every API call. To get your API key, create an account at Uiza here: [Sign Up Link](https://id.uiza.io/register). Once you are in the developer console, you will see your API key. The code snippet shows the constants: ```javascript const authorization_key = "<``` The second line contains the stream URL (i.e. `stream_url`) ```javascript {this.state.broadcast_url}
``` The third line contains the key for the stream key (i.e `stream_key`) ```javascript {this.state.broadcast_key}
``` #### Putting the broadcast page UI together: ```javascript render() { return (
Uiza Guide
Start broadcast
{this.state.message}
{this.state.broadcast_url}
{this.state.broadcast_key}
{/* remove http(s) */}
URL: {this.props._url}
KEY: {this.props._key}
PLAYBACK: {this.props._playback_url}
)
}
}
```
As mentioned above, requests are only made every 5-seconds. We attach the parameters to the VideoTile element. After putting it all together:
```javascript
render() {
try {
if (typeof this.state.last_loaded === "string" || ((new Date() - this.state.last_loaded) / 1000) > 5) {
var items = [];
this.load_alive_streams().then((result) => {
for (const [index, value] of this.state.streams.entries()) {
items.push(KEY: {this.props._key}
PLAYBACK: {this.props._playback_url}
Uiza Online Videos
{this.state.items}
{/* A looks through its children s and
renders the first one that matches the current URL. */}
``` The second line contains the stream URL (i.e. `stream_url`) ```javascript {this.state.broadcast_url}
``` The third line contains the key for the stream key (i.e `stream_key`) ```javascript {this.state.broadcast_key}
``` #### Putting the broadcast page UI together: ```javascript render() { return (
Uiza Guide
Start broadcast
{this.state.message}
{this.state.broadcast_url}
{this.state.broadcast_key}
{/* remove http(s) */}
URL: {this.props._url}
KEY: {this.props._key}
PLAYBACK: {this.props._playback_url}
)
}
}
```
As mentioned above, requests are only made every 5-seconds. We attach the parameters to the VideoTile element. After putting it all together:
```javascript
render() {
try {
if (typeof this.state.last_loaded === "string" || ((new Date() - this.state.last_loaded) / 1000) > 5) {
var items = [];
this.load_alive_streams().then((result) => {
for (const [index, value] of this.state.streams.entries()) {
items.push(KEY: {this.props._key}
PLAYBACK: {this.props._playback_url}
Uiza Online Videos
{this.state.items}
{/* A looks through its children s and
renders the first one that matches the current URL. */}
UIZA GUIDE
UIZA ONLINE VIDEOS
{% for each in list_of_videos %}
{% for key, value in each.items %}
{% if key == 'playback' %}
{% else %}
{% endif %}
{% endfor %}
{% endfor %}
{% endblock %}
```
## Conclusion
That's how you can integrate live streaming into your app using Uiza's APIs. With just two API methods, you will have your stream key and stream URL to start a live stream. If you have any questions please check out our Github repo where this entire project has been uploaded with source code [here](https://github.com/info3g/python-uiza) and if you have any other questions please contact us here: tag:
```
```
3\. This code creates an UIZA player:
```
```
4\. Full code example:
```
" %}
# Release Notes
Release Notes is our update that we share with you our new features, improvements or why we change the API to serve you better so you can easily stay up to date on what’s new.
## 2022-06-06
### Auto load-balancing
We now change the ingest point to use the 8099 port, which supports auto-choose a server to serve your stream with the best performance.
{% hint style="warning" %}
*Note that all the current ingest points have no port on the ingest URL (use port 1935 as default), so before we upgrade the system, please help us to integrate with the changes, so your application can work perfectly without any issues.*
{% endhint %}
#### *Integration: there are 2 options to do đź’Ş*
1\. Uiza sends the new ingest info to the webhook endpoint: we will send the data to your webhook endpoint - send all the new ingest to the live\_entities.updated event. We can also provide the API to trigger it manually for your testing.
*Sample webhook data:*
2\. The customer update all the ingest endpoint with port 8099, for example, `rtmp://ingest.uiza.io` -> `rtmp://ingest.uiza.io:8099`. Please contact us for more information.
*Live entity data changes:*
| Live entity object | Before | After |
| ------------------ | ---------------------------------- | --------------------------------------------- |
| **ingest.url** | `rtmp://g-rtmp.gcpsg.uiza.io/live` | `rtmp://g-rtmp.gcpsg.uiza.io/live`**`:8099`** |
## 2020-07-01
### Rewatch the last 30 minutes of a live stream!
We have built a Timeshift feature for maximum viewer experience. When you use an Uiza Player SDK, your viewer can switch between watching a live video and rewinding upto 30minutes with our Timeshift feature.
### Reduced Latency
We have reduced the HLS Playback latency by up to 50%!
### Webhooks: performance and scalability improvements
We know that webhook is one of the most important features for the integration with Uiza APIs. In this release, by the focus on improving the throughput of our webhooks service, Uiza provides you a faster and more reliable webhooks ever.
When your server responds to Uiza the bad status, an event now will be retried to send to your webhook endpoint every hour up to a day, instead of retry many times in minutes, which is too short for any action if your server has trouble.
### Uiza node-kafka-client
There are several problems to solve while enhancing the performance of our services. In the case of message broker enhancement, we decided to release the library of Kafka client run on NodeJS on Github [here](https://github.com/uizaio/node-kafka-client). Which is a wrapper library of [node-rdkafka](https://github.com/Blizzard/node-rdkafka) with extended features, easy to control the workflow, please feel free to use or give us feedback to improve.
## 2020-06-10
### More regions for better performance and more global reach
We have added following regions for your users to use as ingestion points:
{% hint style="success" %}
`us-oregon-1` (Oregon - USA)
`aus-sydney-1` (Sydney - Australia)
`ie-dublin-1` (Dublin - Ireland)
{% endhint %}
## 2020-05-28
### Get notified when we cannot allocate resources for your entity
We try our best to power your broadcasting session by allocating the dedicated resource, returning an RTMP server to ingest and delivering your stream in seconds. Furthermore, we know your time is wasted when you create a [live entity](https://docs.uiza.io/api-reference/live-entities) and the status `init` doesn't change.
So in this release, we added a new live entity status: `resource_allocate_fail` . When the allocating resources for an entity passes a threshold of time, we'll set the entity's status to `resource_allocate_fail` and delete it automatically after 15 minutes.
In case the entity status becomes `resource_allocate_fail`, ~~disaster 🌋🌊 may occur~~ it will not be counted on your usage data. You can create a new live entity afterwards.
### Suspended accounts
Uiza's invoice day is 3rd day of the month, we process to charge your invoice until the 16th day of the month. If the next day we still not charge your invoice successfully, your account will be set to suspend and we prevent your interaction with our core services via API calls.
### Support for MPEG-DASH Playback
Read more about MPEG-DASH [here](https://www.encoding.com/mpeg-dash/).
## 2020-05-07
### New region in Vietnam region is finally available!
Provide your users with improved connectivity through our new region. The new region is:`vn-saigon-1`
### Added PATCH methods to modify objects
Instead of replacing your resource for a simple modification, you can now update the resource using the PATCH method. We will deprecate the PUT methods in the future.
## 2020-04-21
### Track your encoding minutes!
You can now see how many minutes you have encoded using Uiza. For more details on how we calculate your encoding minutes, go to this [link](https://help.uiza.io/data-usage)
### Uiza's Player for better viewer experience
Integrate Uiza's player into your website for optimal playback. Our player supports ABR, playback speed, and playback in a smaller window.
## 2020-03-26
### Behold! DVR
You can now rewatch your live stream with DVR. We record your live stream and convert it to a [video entity](https://docs.uiza.io/api-reference/video-entities), and your users can watch your live stream recording if they missed it.
### Broadcast your moment to multiple destinations simultaneously
Using our `Relay Destination` feature, you can broadcast your live stream to multiple social networks (Facebook, Youtube, Twitch, etc) or RTMP endpoint simultaneously. Update your fans on all platforms and let us handle the signal!
### Give your end user the best experience with ABR
You can create up to 6 video profile outputs (Business Tier) with your stream, to cater towards different networks and mobile devices. Your viewer can choose different resolutions, or our Uiza player will recognize the most fitting profile depending on your user's bandwidth, and adjust their bitrate accordingly.
# API Changelog
API changelog describes to you what we change on the newest API dated version we've made so you can easily stay up to date on what’s new.
## 2020-07-01
**What’s new**
* Support enable/disable of live relay destination and added the identity attributes to the relay object: id, status, created\_at , and updated\_at.
* Faster and more reliable Webhook service.
* Separate Delivery overusage to different regions with distinct costs. [Read more here.](https://help.uiza.io/data-usage)
* Adjust the overuse invoice template to include items for delivery regions, unit prices, and exceeded values.
* Support for enabling/disabling CCU display on Uiza’s WebSDK. [Read more here](https://github.com/uizaio/uiza-javascript-sdk-player#customizing-the-ui-button).
**Changes**
* Time interval to retry Webhook changed from multiple times per minute to an hourly basis for a duration of 24 hours.
* Update subscription plans according to the new pricing model ([Pricing](https://uiza.io/pricing)).
**Fixes**
* Fixed issue with user suspension in case of failed payment when changing the current subscription
## 2020-05-28
**What's new**
* User suspension - User’s who missed payment after the invoice period will be suspended.
* New status when creating live entity: `resource_allocation_fail` - when the entity takes too long to look for resources. User’s will receive a message and will be prompted to create a new entity.
* SDK player updates
* Live button to return to live moment
* Analytics and CCU displayed on Uiza’s players
* Support for [MPEG-DASH](https://www.encoding.com/mpeg-dash/) playback .
**Fixes**
* Fixed bug when deleting a live entity assigned to a preset.
* Fixed minor bug with wrong message response when creating a webhook endpoint but missing url parameter.
* Fixed bug returning inconsistent playback.url of live entity in Live API and Event API.
* Fixed confusing error message when creating a [live entity](https://docs.uiza.io/api-reference/live-entities) with missing parameters.
* Fixed confusing error message when creating a [webhook endpoint](https://docs.uiza.io/api-reference/webhook_endpoints) with missing parameters.
* Fixed bug allowing Team & Business tier users to profiles to Uiza presets.
* Fixed bug with randomly returned error type when client calls APIs.
* Fixed issue with retry request live resource.
## 2020-05-07
### What's new
* Added new API: [Update a live entity](https://docs.uiza.io/v/2020-05-07/api-reference/live-entities/update-a-live-entity) using PATCH method
* Added new API: [Update a webhook endpoint](https://docs.uiza.io/v/2020-05-07/api-reference/webhook_endpoints/update-webhook-endpoint) using PATCH method
### Changed
* Deprecated [Update a live entity](https://docs.uiza.io/v/2020-05-07/api-reference/live-entities/deprecated-update-a-live-entityhttps://docs.uiza.io/v/2020-05-07/api-reference/live-entities/deprecated-update-a-live-entity) API using PUT method
* Deprecated [Update a webhook endpoint](https://docs.uiza.io/v/2020-05-07/api-reference/webhook_endpoints/deprecated-update-webhook-endpoint) API using PUT method
### Fixed
* Inconsistent entity status on events when update entity status to ready
* Fixed bug when calling list events API returns `internal-error`
## 2020-04-21
### What's new
* Expose new API to reset Ingest Key of a Live Entity.
* Expose new API to get Invoice Detail.
* Support clearing Live Entity's relay setting by updating relay parameter as empty
* Support exporting Invoice to PDF.
* Support deleting source files of video entity.
### Changes
* Replace field `type` by `input_type` in `video_entity` event object.
### Fixes
* Fixed bug incorrect error response when updating invalid video preset/profile.
* Fixed bug where user can login without verifying email address.
* Fixed bug displaying empty `live_entity_id` in the `live_session` event object.
## 2020-03-26
### What's new
* Added new event `video_entities.created` in [Event Types](https://docs.uiza.io/api-reference/events/event-types).
* Added `video_entity_id` attribute to [Live Session](https://docs.uiza.io/api-reference/live-sessions) to link the live records with its video entity.
* Support DVR option in [Live Entity](https://docs.uiza.io/api-reference/live-entities). Included two new APIs to enable and disable DVR.
* Support login with Google.
* Support multiple destination broadcast and added `relay` attribute to [Live Entity](https://docs.uiza.io/api-reference/live-entities) .
* Added `encode` attribute to [Live Entity](https://docs.uiza.io/api-reference/live-entities) .
* Introduced [Video Profile](https://docs.uiza.io/api-reference/video-profiles) & [Video Preset](https://docs.uiza.io/api-reference/video-presets) to support live with `encode` option.
* Added new attribute `preset` in [Live Entity](https://docs.uiza.io/api-reference/live-entities) .
* Support filtering [Live Sessions](https://docs.uiza.io/api-reference/live-sessions) by DVR attribute and added new attribute `preset` in Live Session details
* Support filter live video by `live_entity_id`.
* Increase resource allocation speed up to 500 live entities per 5 seconds.
* Support categorize Ulas by `encode` feature.
### Changes
* Live Session attribute `entity_id` changed to `live_entity_id` to differentiate with `video_entity_id`.
* Following [Google API Design guideline](https://cloud.google.com/apis/design/standard_methods#delete), all `DELETE` APIs should return empty body.
* Remove `Reset ingest key` API in version 2020-01-10. We no longer support resetting ingest key, because conflicts with the end of signal occurs when an user resets the ingest key while streaming. We are working on this problem.
* Remove emit event log form. All event logs related to entity should be executed in Live Entity server.
* Update submodule by removing `googleapis`. This update shortens the times of build time from 10 minutes to about 2 minutes.
* Support allocating request based on available vCPUs and Memory
* Enhance the performance of allocating by moving DNS logic part to be a DNS Service.
### Fixes
* Webhook endpoints can now send to Slack without error and return the valid error message.
* Delete DNS when deleting a live entity.
* Fixed bug where user ID is undefined when creating a live entity.
* Fixed inconsistency of API response between live entity API and webhook endpoints API.
* Fixed bug where updating the video entity returns bad request.
* Fixed inconsistency in boolean value in events API.
* Fixing crashing issue due to not handling case of Axios - fail on getting a response from Prometheus.
* Handle multi node down trigger fail over.
* Fixed bug where retrieving live entities causes long time to allocate resource.
* Cannot get Ulas disk metrics during scaling action.
# Hola! đź‘‹
### **Welcome to Uiza, the video streaming as code!**
We aim to provide developers with an end-to-end video streaming solution that offers simple integration and stable performance at scale. At the very beginning of our roadmap, we tackle the problem that is considered the most severe, ***video and live stream delivery***. The proximity between the infrastructure and the streamer/viewer is the key factor that influence the quality of the video streams. Setting up and managing a wide network of infrastructures that penetrates locally to reach out as closely as possible to the streamers and viewers in various cities are tough. The first version of our brand-new platform is created to solve this problem.
{% hint style="success" %}
Our **key differentiation** is that we are developing a diversified network of infrastructures that does not only rely on public cloud like Amazon Web Services, Google Cloud Platform, or Digital Ocean, but also a wide range of local infrastructures those are rooted in lower-tier cities like *Bengaluru, Kolkata, Chennai*... This means your viewers will most likely *watch the videos being streamed from the infrastructure located in the same city of theirs*, which improves the quality and scalability of the video streams significantly.
{% endhint %}
# Introduction
Uiza helps you broadcast your live stream to your audiences with literally a few lines of codes, or at least we are trying hard to get there:muscle::muscle::muscle:. But before experiencing the magic, let's make sure that you understand the terms correctly.
* ***`live_entity`***: Live entities are basically live events, with or without a live feed. A live entity contains the information required for Uiza to allocate resources to power the live event, and direct your live feed toward these resources for ingestion and broadcasting.
* ***`live_session`***: The duration of one session is counted from the moment Uiza receives the first signal until the last of that live feed. Therefore, one entity could contain multiple sessions. The durations of these sessions are calculated as *Live Minutes* in your billing.
* ***Streamer***: Streamers record the live events and are the source of the live signals that Uiza receives.
* ***Viewer***: Viewers are the users who watch the live stream on their devices. They are the destination of the delivery of the live stream.
Now that we are on the same page, let's navigate to the **Quickstart** to start *live streaming*.
{% content-ref url="/pages/-LwqhgC-FZjkAy13MWg8" %}
[Authentication](/2021-09-21/getting-started/authentication)
{% endcontent-ref %}
---
[Next Page](/llms-full.txt/1)
| Event type | Data (ingest.url) |
|---|---|
| live_entities.updated | |