ApsaraVideo VOD demo

Summary

1. Introduction
2. Prerequisites
3. ApsaraVideo VOD Configuration
4. Compilation
5. Installation
6. Credits
7. Support

Introduction

The goal of this demo is to demonstrate how to use ApsaraVideo VOD with a simple web application written in Java.

Prerequisites

The first step is to create an Alibaba Cloud account, complete the real-name authentication and create a RAM user. The RAM user should have an access key and the AliyunVoDFullAccess policy (note: in this demo we use AliyunVoDFullAccess to make things simpler, but access rights can be further restricted).

Because we need to use CDNs, a domain is mandatory. We can either buy one (such as "my-sample-domain.xyz") or transfer it. It is technically possible to use another domain registrar, but to make things simpler this demo expects a domain registered in Alibaba Cloud.

ApsaraVideo VOD Configuration

Let's start with the domain configuration:

• Go to the VOD console.
• In the left menu, click on "Domain Names".
• Click on the "Add Domain Name" button.
• Fill up the form with the following values:
  • Domain Name: domain name you want to use to upload and download videos. It should be something different from your website domain name. Example value: vod.my-sample-domain.xyz
  • Origin type: to keep it simple, select "OSS Domain Name" and keep the default bucket.
  • Origin port: in order to minimize configuration, select "80". This is the HTTP port. If you prefer HTTPS, select the port 443, but you will need to configure HTTPS.
  • Acceleration Region: select "Outside Mainland China" if you don't have a website in China (selecting "Mainland China" or "Global" requires you to obtain an ICP license).
• Submit the form and go back to the Domain Names page.
• Wait for few seconds and regularly refresh the page until your registered domain contains a value in the "CNAME" column (it should be something like "vod.my-sample-domain.xyz.w.kunlunsl.com"). Then copy this CNAME value into your clipboard.
• Go to the domains console.
• Click on the "Resolve" link next to your domain.
• Click on the "Add Record" button and fill-up the form with the following parameters:
  • Type: CNAME
  • Host: your sub-domain name, such as "vod".
  • ISP Line: Default
  • Value: paste the CNAME from your clipboard (e.g. "vod.my-sample-domain.xyz.w.kunlunsl.com")
  • TTL: 10 minutes
• Submit the form, then immediately click on the "Add Record" button again. Fill-up the form like above but with the following difference:
  • ISP Line: Outside Mainland China
• Submit the form and go back to the Domain Names page of the VOD console.
• Wait for few seconds and refresh the page regularly until the little "warning icon" next to the CNAME disappear.

Now that our domain is registered, let's configure transcoding templates:

• Go to the Transcode page.
• Select your region on the top menu bar.
• Click on the "Create Template" button.
• Set the "Template Name" to "multiple-sizes". The current displayed form should have "Low definition" in its "Basic Parameters / Definition".
• Click on the "+ Add Template" button and select "Standard Definition".
• Click on the "+ Add Template" button and select "High Definition".
• Click on the "+ Add Template" button and select "Ultra High Definition".
• Click on the "Save" button.
• Back to the Transcode page, we can see our "multiple-sizes" template group. Copy the value in the "ID" column (e.g. 46fdd77a0231241a5db0a105de540e81).

We can now configure the application. In the file src/main/resources/application.properties, the following properties will need to be set:

# Apsara Video VOD
apsaraVideoVod.accessKeyId=Access key ID you got when you have created your RAM user.
apsaraVideoVod.accessKeySecret=Access key secret you got when you have created your RAM user.
apsaraVideoVod.regionId=Region of the VOD service (e.g. ap-southeast-1).
apsaraVideoVod.templateGroupId=ID of your "multiple-sizes" template.

Note 1: You can obtain the region ID from this page.

Note 2: If you don't want to modify the file application.properties, you can pass these parameters as program arguments, as shown in the next section.

Compilation

Note: In order to compile this demo, you need to have JDK 11+ and Apache Maven 3.6+ on your machine.

Please open a terminal and enter the following commands:

# Navigate to this project directory
cd ~/projects/vod-demo

# Note: make sure you have configured src/main/resources/application.properties

# Compile and package the application
mvn clean package

If you want to run the application locally, run the following command:

# Run the application locally
mvn spring-boot:run \
    -DapsaraVideoVod.accessKeyId=access-key-id-of-your-AliyunVoDFullAccess-ram-user \
    -DapsaraVideoVod.accessKeySecret=access-key-secret-of-your-AliyunVoDFullAccess-ram-user \
    -DapsaraVideoVod.regionId=vod-service-region-id \
    -DapsaraVideoVod.templateGroupId=id-of-your-multiple-sizes-template

You can then open the page http://localhost:8080 in your web browser.

Note: you will have CORS issues because the web application domain ("localhost") is different from the one used for VOD (e.g. "vod.my-sample-domain.xyz"). A quick solution is to use a web browser add-on, such as CORS Everywhere.

Installation

Note 1: In order to deploy this demo in Alibaba Cloud, you need to Terraform installed on your computer.

Note 2: you need an access key id and secret attached to your main user account, or to a RAM user with the AdministratorAccess policy.

Note 3: your will need the identifier for your region (such as "ap-southeast-1"), please read this documentation to find it.

Now that the application is packaged (file "target/vod-demo-x.y.z.jar"), we can deploy it in Alibaba Cloud with the following commands:

# Navigate to this project directory
cd ~/projects/vod-demo

# Navigate to the infrastructure directory, where Terraform scripts are located
cd infrastructure

# Configure the Terraform scripts
export ALICLOUD_ACCESS_KEY="Access key ID attached to an administrator."
export ALICLOUD_SECRET_KEY="Access key secret attached to an administrator."
export ALICLOUD_REGION="Region ID (e.g. ap-southeast-1)"

export TF_VAR_top_domain_name="The top domain you have registered in Alibaba Cloud (e.g. my-sample-domain.xyz)."
export TF_VAR_sub_domain_name="Sub domain name for this demo (e.g. vod-demo)."
export TF_VAR_ecs_root_password="Root password of the ECS instance (e.g. YourS3cretP@ssword)."
export TF_VAR_vod_service_access_key_id="Access key ID of your RAM user with the AliyunVoDFullAccess policy."
export TF_VAR_vod_service_access_key_secret="Access key secret of your RAM user with the AliyunVoDFullAccess policy."
export TF_VAR_vod_service_region_id="Region of the VOD service (e.g. ap-southeast-1)."
export TF_VAR_vod_service_template_group_id="ID of the 'multiple-sizes' template."

# Initialize and run terraform
terraform init
terraform apply

The Terraform script automatically installs the demo on the ECS instance.

You can now test your application by opening your web browser on the domain you have configured (e.g. "http://vod-demo.my-sample-domain.xyz").

Credits

• OpenJDK
• Spring Boot
• JQuery
• JavaScript upload SDK
• Web player SDK
• Bootstrap
• Apache Maven
• Terraform

Support

Don't hesitate to contact us if you have questions or remarks.