Enquiry Form

Month: January 2020

Linking Registration Works in ROKU

How Rendezvous Linking Registration Works in ROKU?

4 Way Technologies is one of the leading Roku Application Development companies across the globe. We provide a comprehensive end-to-end software solution and help you in developing highly scalable, feature-rich, growth-oriented, and powerful applications as per the requirements and needs of your business.

There are many different ways of linking a Roku channel with an online account. One of the easiest and most fun is rendezvous-style linking registration, developed by Roku developers to benefit the ARM developers. In Rendezvous, linking a channel displays a code to the user and asks them to use the computer to enter that Roku linking code into a website to complete the Roku registration process.

This blog deals with the process of Rendezvous linking registration on the ROKU Channel.

So, let us start!

Table of Contents
1. Introduction
2. How Does Authentication Flow?
2.1. Step 1: Pre-Registration
2.2. Step 2: Device Linking
2.3. Step 3: Linking Success
3. Conclusion

Introduction

Rendezvous linking is the typical flow and API used for registering and linking a device to an authentication service. The primary and recommended method for linking a device involves 3 main steps that combine to form rendezvous-style linking.

The steps are as follows – 

  • The channel presents a short on-screen Roku registration code on the device.
  • The user links the devices by inserting the registration code, provided on the provider’s website/service.
  • After the Roku linking code gets confirmed by the service to be correct then a token is issued to the Roku device. Once the token has been downloaded on the device, then a pop-up comes with a congratulations message on the channel allowing the user to access the video service. Afterward, every time the channel gets launched the verification of the token takes place automatically. 

In this way, rendezvous linking registration takes place for the user; entering the code, again and again, isn’t required. The Roku TV developers keep it simple for the users as well as for the ARM developers.

How Does Authentication Flow?

Many activities between the device and the provider server perform the authentication. The steps are as follows:

1. Pre-Registration:

  • First, the Roku device sends a “pre-registration” request to the server.
  • The server produces a short Roku registration code and makes an entry in the database linking the code with the temporary request for linking.
  • The Roku device receives the response made and shows the Roku linking code to the user.

2. Device Linking:

  • The Roku device starts making a series of “link” requests to the server.
  • The server replies to the link request with a “not completed” code till the user successfully enters the right and complete code into the website, or either the code expires.

3. Linking Success:

  • When the user successfully enters the Roku linking code and other required credentials on the provider website, the server re-links the code with the user’s real account.
  • Whenever the next time Roku device makes a “link” inquiry, the server acknowledges with a permanent code(token) that can be used to access the user’s account every time the user requests. 

Every subsequent API request uses this token to uniquely identify the user and the linked device. A request can be made anytime as HTTP GET with values in parameters, or HTTP POST with values in the body of the request, for example, like XML or JSON. The Roku development team makes it far too easy.

Step 1: Pre-Registration

This step is used to recover the Roku registration code from the server for device registration. The token is illustrated on the screen by the Roku device and the user is requested to go to the website and enter this token. It is advisable to make the code as short as possible in turn to make it easy for the end-user to enter, but assure uniqueness during the retry period. The device should be registered at a particular frequency (retryInterval) during roku registration until the Roku device has been registered or the maximum time has expired (retryDuration).

Pre-Registration Request:

Roku Pre Registration

Response:

Roku Pre Registration Response

Step 2: Device Linking

This step is basically about keeping a check on the Roku registration process, to examine whether the user is able to enter the Roku linking code successfully on the provider’s website to link his/her Roku device. This particular step is about checking the status of the device at a specified time interval (retryInterval) from the point when pre-registration request was made until a successful response is received or either the maximum retry time (retryDuration) has passed. An example of the request/response is illustrated below in XML format:

Link Request:

Roku Device Linking

Intermediate Response:

Roku Device Linking Response

Roku Linking Code

The device linking request can fail because of various reasons, like:

  • Missing or incorrect Roku registration code.
  • Expired code.
  • The issues with the customer account (e.g. not registered, hold, etc.).

Step 3: Linking Success

Roku Linking Success

The final step after successful linking of the device is to send a token (rather than an opaque string) back to the Roku device that will be written on the channel’s registry. This token can be used by the user/viewer to perform further desired operations on the server like play media or games and much more. Afterward, every time the channel is launched the service will match the token. 

This token is the identifier for the account on the server, not the device serial number. This thing makes it easy for the user to unlink a device from an account just by removing that particular channel or she/he can simply factory reset the device which will also result in the token being lost hence, unlinking the device.  

Final Response:

Roku Registration Final Response

Conclusion

We hope you will find this article helpful. Now that you have understood the complete process of how Rendezvous linking registration works in ROKU, you will be easily able to take part in the Roku application development process after going through this article. However, if you still face some issues, feel free to contact 4 Way Technologies for a complete Roku-based software solution.

Roku Advanced Layout Editor

How to use Roku Advanced Layout Editor for Design and Development?

4 Way Technologies is a leading Roku Application Development company across the globe. Hire highly experienced and skilled Roku developers from us in order to get impeccable, powerful, and robust Roku applications for the growth and betterment of your business.

RALE (Roku Advanced Layout Editor) is a graphical tool developed by Roku TV developers that lets the ARM developers examine the user’s SceneGraph and make any modifications if needed.

This article will help you in understanding the process of using the Roku advanced layout editor for designing and development of Roku applications.

Table of Contents
1. Introduction
2. What are the Features of RALE?
3. How To Use RALE?
4. How Does Editing Work in RALE?
5. Conclusion

Introduction

SceneGraph

As all the ARM developers are aware, developing a Roku channel is an iterative process that involves lots of changes in UI and design to get the right theme and to appeal to the masses. To make developing and designing easy for the ARM developers RALE is the right tool.

Developers and designers can dynamically develop/design the UI components of a channel for swift prototyping and design purposes. Any modifications made by you in the tool’s editor will be reflected real-time in an illustration channel on a local Roku device.

The Roku Advanced Layout Editor (RALE) is a tool made by Roku developers that gives a hierarchical view of the node tree in the Roku SceneGraph channel.

Roku SceneGraph channel

What are the Features of RALE?

There are various impeccable features that RALE possesses. Here is the list:

  • Interactive Layout 
  • Component Drag and Drop 
  • Component Fields Editor 
  • Hierarchical RSG View 
  • Channel Templates 
  • Device Manager

Apart from the above mentioned features there are many more being developed and experimented with by the Roku development team on a daily basis.

How To Use RALE?

  • The first step for RALE is to download the application. 
  • Download RALE!!

How to Use RALE

  • After Downloading, when you open the application, a landing page will appear. To start the application, add your Roku device to the device list. On the landing page of the application, click the label “Select Device” at the top of the screen.
  • If you’re a first-time user, RALE has an example node hierarchy tree already built into one of its templates. This template is known as Sliding Panels and it can be reached through the channel samples. Click “Select Channel” situated next to your device after you’ve selected your target Roku device. From here you can select the template you want to use, or upload your own zip to edit.
Select the Template

  • The code for these templates can be located in the Roku developers Eclipse Plugin.
Roku Developers Eclipse Plugin
Sample screen for the Eclipse Plugins

How Does Editing Work in RALE?

Apart from rendering templates, RALE also offers a quick modification feature to transform your SceneGraph components on the spinner. You can use this feature to switch fields, or node hierarchy in your SceneGraph while deployed. After loading your application, RALE will furnish you with a node hierarchy of your SceneGraph application.

How Does Editing Work in RALE

Not only can you modify the fields of these nodes, but the UI elements can actually be changed via a GUI that only RALE gives. Inside the node hierarchy, the layout tab provides a GUI representation of your SceneGraph application. Select the node that you want to modify, and then select the layout tab on the right-side view. From here you can resize, move, or change your UI, whatever you want.

SceneGraph Application

Moving and resizing the node in the GUI will definitely correspond with your Roku application on the TV.

Conclusion

We hope that you will find this article helpful. After going through this blog, you will be easily able to use Roku Advanced Layout Editor for the design and development process of your Roku applications. If you still face some issue, feel free to contact 4 Way Technologies for a complete and robust software solution.

How Roku Payment Works

How Roku Payment Works?

4 Way Technologies is a leading ROKU app development company worldwide. Our highly skilled and professional ROKU app developers are proficient in delivering an outstanding product with a wide range of features in order to outperform the competitors of your organization.

This article will help you in understanding the procedure of how ROKU payment works.

Table of Contents
1. Introduction
2. What are the Steps To Be Followed at Viewers-End?
3. How Does Roku Payment Work for the Developers?
3.1. Is there any specific workflow for In-Channel purchase?
3.2. Creating and Monetizing a Channel
3.3. How does the Purchasing of the Sample Sign-Up Take Place?
4. Sample’s Runtime Flow of Control
5. Conclusion

Introduction

There are a number of reasons for ROKU being number one on the earth. It also offers more content and channels aas compared to many other OTT streaming devices on the market. Netflix, Hulu, sports, and many more genres are available on ROKU. Also, ROKU offers an easier set up. All you need is an internet connection and a credit card or PayPal account for registering your device online and you are done. Roku saves your credit card/PayPal and billing information for on-screen in-app purchases such as purchasing movies from FandangoNOW or subscribing to several SVOD (subscription-based) channels.

Let us understand completely for more clarity.

What are the Steps To Be Followed at Viewers-End?

 If an account doesn’t exist – 

  • Visit my.roku.com on your computer or either smartphone.
  • Create a Roku account. 

How Roku Works

  • Enter all the details. Set a PIN.
Roku Works

Roku Payment

  • Choose a payment method, fill in the details.

Well Done!

If, the account already exists without an added payment method – 

Update Roku Payment Method

  • Sign in to your Roku account.
  • Click on the Update button under the Payment method section.
Update Roku Payment
  • Complete all fields and submit.

When updating re-enter all fields before submitting. (All credit card details/PayPal, full name, address, and phone number should be completed.)

Roku Payment Method

How Does Roku Payment Work for the Developers?

Roku TV developers have developed amazing features to help ARM developers to fix the issues of billing, especially for in-channel purchasing.

Is there any specific workflow for In-Channel purchase?

In-channel purchasing can be concocted and tested programmatically through the tool made by Roku development team “SceneGraph” control node ChannelStore and the Roku Web Service API. The sample described in this report uses ChannelStore to show a simple sign-up scenario, not the entire in-channel purchasing workflow and neither the use of the Web Service API. This report also describes the code to implement purchasing during sign-up.

Workflow diagram to show the work done at the developers-end as well as users-end.

Update Method Roku Payment

Creating and Monetizing a Channel

Roku developers have made it easy for ARM developers to monetize a public or non-certified channel. But before you can monetize your new channel, you need to create it using the Developer Dashboard and then write the code. Your new channel can be a public channel as well but does not publish or certify it prior to adding monetization.

Immediately after creating the Roku channel, do not publish or certify it. Later, once you have tested it and monetized it, you can certify and publish it.

Now, let’s come down to the Roku payment part.

How does the Purchasing of the Sample Sign-Up Take Place?

The ChannelStore_SignupFlow sample shows the code the ARM developer needs to implement to sign up a new user and allow the purchase of a subscription using the SceneGraph ChannelStore object.

Sideload this example channel to see the sign-up screens, including the buying of a subscription. You might be asked for your Roku PIN, so have it available.

  • Once the channel is installed, Start it and the first screen to flash on your screen will be for Login or Sign Up. This sample application only deals with Sign Up i.e. new members, not with the only registered members, so choose “New subscriber“.
Method of Roku Payment

Request for information” will be the next screen to appear. Enter the trial account’s email address and click “Allow” to use.

Request for information

Register a password and click “Continue“.

Register a password

If you see the example “Terms Of Use” screen, select “Accept” to illustrate the correlated products with the channel.

The “Subscription” screen shows the list of the products available for purchase. Choose any sample product.

Subscription

Enter your Roku PIN for confirming the purchase.

Enter your Roku PIN

Once your purchase is confirmed, the in-channel purchase is complete.

purchase is confirmed

And this is how the Roku payment works.

Sample’s Runtime Flow of Control

At the time of launch, the flow through the example uses the custom Roku SignUp segment to check if there is any active Roku subscription for the account, getting all the user’s details like the user’s name, email, and password for a new account, find the purchasing products available in the channel and then sign up the user for the product.

Sample's Runtime Flow of Control

Conclusion

After going through this blog, we understand the working of ROKU’s payment process. As ROKU is one of the most popular streaming devices these days, buy any of your desired subscription on ROKU for endless entertainment. We hope you will find this article helpful. Please provide your feedback in the comment section below.

deploy angular app to aws

Deploy Angular Universal Build Using GitHub on AWS EC2 Instance

Table of Contents
1. Introduction
2. How to Deploy an Angular App to AWS?
3. Conclusion

Introduction

Amazon Web Services (AWS) includes various basic terms that you might be familiar with, such as EC2 instance, security group, and many more.

In simpler words, an EC2 instance acts like a remote system running with the help of Ubuntu or any other Linux base provided by AWS, which allows us to install the required servers, plugins, software, and more.

In this article, we have discussed how to deploy an Angular app on an AWS EC2 instance using GitHub. This is written for beginners who are new to EC2 and Angularjs Development want to deploy Angular App to AWS.

So, Let us dive in!

How to Deploy an Angular App to AWS?

Follow the following steps in order to deploy an Angular app to an AWS EC2 instance.

1. Add Angular App Universal to your project

Angular made it easy to make your app SEO friendly by using Angular App Universal which supports server-side rendering (SSR). Run the command given below on your root folder of the project in terminal.

ng add @nguniversal/express-engine --clientProject Your-application-name

It is just one line code and your application has become SEO friendly.

2. Create Production Build

After successfully completing the first step make your application ready for deployment and creates a production build with server-side-rendering.  Just run this command on your terminal.

npm run build:ssr

This will create a production build for your application. It will create a Dist folder on your application and now you are ready for deployment angular app to AWS EC2 instance.

3. Upload your project folder to GitHub

So there are many ways to upload your application on EC2 like you can upload your build on the S3 bucket and then download using the link on your instance or you can upload your build on GitHub repo and then download it from EC2 instance. 

Actually, the first method is much easier and time-saving but it has some disadvantages as well as it does not maintain version control or if you are using an S3 bucket then there are chances that you have to spend more money than intended.

Personally, I prefer the GitHub method.

All you have to do is create a private GitHub repository and upload your dist folder on it.

4. Download your project folder from GitHub to the instance

I assume that you have already set up your instance or you have already installed Nginx,npm, or Angular CLI.

So when you download the Nginx server then another folder www was created under the hood

Go to your  /var/www folder and clone your GitHub project to this location using the below command.

git clone github-project-link

5. Configure server setup

Once you have successfully downloaded your project from GitHub to instance now it’s time to set up your server so you can run this on your domain name, this is the main part where you need to be focused.

Now go to cd /etc/nginx/site-available now create a file name as your website or the same as your application and delete the default configuration file.

So now do Open the file you have just created inside site-available and paste this code to setup server.

server {
    listen 80;
    listen [::]:80;
    return 301 https://your-site-name.com;
}
server {
  listen 443 ssl http2;
  listen [::]:443 ssl http2;
  server_name https://your-site-name.com;
  server_tokens off;
  index index.html index.htm;
  location / {
        proxy_pass http://127.0.0.1:4000;
        # First attempt to server request as file, then
        # as directory, then fall back to displaying a 404.
        try_files $uri $uri/ /index.html =404;
    }
}

Here in the above code  proxy_pass http://127.0.0.1:4000 this line works as proxy means whenever you search your domain this proxy will work under the hood and load your site. 

6. Install and run PM2

PM2 is a production process manager for Node.js applications with a built-in load balancer. It allows you to keep applications alive forever, reload them without downtime, and facilitate common system admin tasks.

So this will help to run your application on servers localhost http://127.0.0.1:4000;

Just install it using

npm install pm2 -g


And then run PM2 server using

Pm2 start dist/server.js

7. Restart Nginx

Now restart your Nginx server using 

Service nginx restart

And that’s it by following these steps your App is running fine on your domain. I hope you are able to see your Website.

Keep reading, keep coding & if you got stuck somewhere, I am happy to help.

Conclusion

We hope you will find this article helpful. After going through this blog, you will be able to run your app without any hassle even if you are on a beginner level. Let me know if I missed something or if you stuck somewhere during the entire process. Please provide your feedback in the comment section below.

Create Roku Channel

How To Publish ROKU Channel

4 Way Technologies is a leading Roku app development company across the globe. Our highly skilled and experienced Roku app developers are proficient in providing feature-rich and impeccable Roku-based products. Along with robust Roku applications, our development team is also capable of delivering the required software solutions within the given timeline as per the needs of your business.

As the demand for Smart TV app development is increasing day by day, publishing and creating your own Roku channel is a smart move. Publishing your ROKU channel isn’t tough at all, thanks to the ROKU development team. But, mind you publishing does require a few things of the channel such as its source code, images, and fonts all to be “packaged”  into a bundle that gets ciphered. By means of this feature, ROKU developers allow ARM developers to publish their channels while keeping all intellectual property and data safely encrypted. 

In this article, we have discussed the process of publishing the Roku channel.

Table of Contents
1. Introduction
2. What are the Prerequisites and Guidelines for Creating Roku Channel?
3. What are the Steps to Publish the Roku Channel?
3.1. Channel Properties
3.2. Add a Content Feed URL
3.3. Channel Branding
3.4. Add Category Tag(s)
3.5. Channel Store Info
3.6. Screenshots
3.7. Support Information
3.8. Channel Preview
4. Conclusion

Introduction

After you’re done with testing and ready for deployment of your channel, you can publish it using the Developer Dashboard. If you have developed a public channel it will be allowed on the Roku Channel Store, it will be interpreted by Roku developers during the certification process. If you want to update your existing channel, the updated publishing will be done using the Developer Dashboard only.

The Roku platform supports two types of channels –

  • Public channel – distributed in the Roku Channel Store and discoverable from the Search feature on the Roku home page.
  • Non-certified channel – not available in the Channel Store and used for testing purposes or limited sharing. The connection to the channel can be only be established using the channel’s specific access code.

What are the Prerequisites and Guidelines for Creating Roku Channel?

For successfully  creating a Roku channel, you have to follow the steps:

  1. Creating your design assets carefully.
  2. Carefully read the Pre-certification Check List for certification criteria.
  3. Packaging of your Roku Channel.
  4. Publishing your channel. 

After successfully creating your own Roku channel are you concerned about the steps to publish your Roku channel? We’ll together go through the process of publishing your Roku channel, but before let’s learn about Direct Publisher and Developer SDK. 

Roku developers have come up with two ways for ARM developers to publish their channel – Direct Publisher and Developer SDK.  Direct Publisher is the most natural way to generate an amazing TV experience. The Developer SDK is a great option for customized channel Roku development.

Here, we follow the Direct Publisher approach. Roku developers have provided sample assets for the ARM developers to use. You can anytime delete these assets out from your channel’s properties once you’re ready to publish.

Roku App Development Tutorial

Requirements To Follow This Guide:

What are the Steps to Publish the Roku Channel?

Follow the below written steps to publish the Roku channel:

  1. Fill out channel properties.
  2. Add a content feed URL.
  3. Upload channel branding.
  4. Add category tag(s).
  5. Fill out Channel Store information.
  6. Add screenshots of your channel.
  7. Provide customer support information.
  8. Preview the channel on a device.

Important! Most fields in Direct Publisher include a small “?” button next to them. Clicking that icon will show you more information about what they’re used for.

1. Channel Properties

To get started, go to the Manage Channels page in your account and click on “Add Channel:”

Roku App Development

All necessary information on the Channel Properties page starts with default values, so all you have made changes when necessary.

  • Channel Stores: This defines the geographical area i.e. countries where your channel will be accessible. 

Note: Select only those countries where you have the legal right to share your channel’s content.

  • Languages: You will be able to add localized channel descriptions in various languages according to the country for each field you add.
  • Is the channel directed to children: This field helps assure that only age-appropriate ads are showed to children if you opt to include ads in your channel.
  • Parental Hint: You can add a parental hint to make sure your channel is downloaded only by age-appropriate users.
  • Vanity Access Code: You can customize this field as per your channel’s theme to make a more memorable, marketable, and searchable download URL for your channel.

When your channel properties are okay and you’re satisfied, click “Continue” to go to the next screen.

Roku App

2. Add a Content Feed URL

The Feed URL section is where you give your content feed to Roku, which is in a file form that includes information about all the videos(URLs, title, description, language, etc) that are included on your channel. For demonstration purposes, let’s use this sample feed URL that includes a few original Roku videos: https://api.myjson.com/bins/3sa1g

Roku Development Tutorial

3. Channel Branding

The next step takes you to the Branding section! In this step, you can brand your channel with customize logo, a background image, a search icon, and your brand’s colors.

For the tutorial purpose, you can use the sample assets provided to you in the beginning, start with unzipping them. 

This sample asset file includes a channel logo, channel poster, splash screen image, and a search icon that we can use here:

Develop Your Own Roku Channel

Start with uploading the channel logo, splash screen, and search icon images to their respective fields. To match your channel’s aesthetic you can change the colors accordingly on the right or can also upload a customized background image.

Tip: Adobe Color CC is a free tool that can help you with various colors for your channel’s branding. 

Develop Your Own Roku

4. Add Category Tag(s)

The next step heads towards is the Categories section.

Each category you formulate will appear as its own row of content at the end product of yours, your channel. This categorizing will make it more easy for the end-user to find the content they’re interested in viewing. Popular types to categorize the content include genres, directors, or topics.

Direct Publisher has three default categories:

  • Continue Watching (this is always active)
  • Most Popular(most searched)
  • Recently Added
Develop Your Roku Channel

You can make your own unique categories by clicking “Add Category.”

New categories are always made by using tags or playlists from the content that you have provided. The example content feed used in the Feed URL section includes multiple tags, so we’ll use those to demonstrate how to create categories.

Develop Roku Channel

To create your own category, the steps are as follows – 

  1. Enter a suitable name for your category. This is the title that will display on your content row at the end product.
  2. Select whether your category is based on tags or either playlist.
  3. Enter tags clearly that appear in your content feed. Content labeled with these tags will populate your category.
  4. Provide laws for each category you create. Make sure you enter tags carefully if your content looks pretty good with only one tag no need to overpopulate it.
  5. Decide upon the order of categories, in which it should appear. 
  6. Click save to save and update all the changes made.

5. Channel Store Info

The next stop is the Channel Store Info. Here you can customize what information must be shown to the user while they browse new channels to download/buy in the Channel Store.

First, see how to update the description text. After that, we’ll go to use the remaining image that was part of the  .zip file. The image selected will be appeared as the channel icon in the Roku Channel Store. At last, we’ll choose the “Preferred Category” for the channel. This category will be listed within the Roku Channel Store where your channel will be live.

Develop Own Roku Channel

6. Screenshots

The next step is about uploading the screenshots. At the screenshot page, you can upload images of your own Roku channel so that users can have a look at it while browsing the Channel Store. You can upload up to six images, or you can also auto-generate the images.

For this tutorial, we will use auto-generated screenshots:

Create Your Own Roku Channel

7. Support Information

In the end, you have to give some basic customer support information about your channel. So that the customer won’t be worried. 

Create Your Own Roku Channel

NOTE: “Test Accounts” field is not compulsory for Direct Publishers. 

8. Channel Preview

After covering all the 7 steps, your sample channel is fully developed and ready for installation! On the Preview and Publish section, you will observe a URL under “Device Preview.” When you click on this link it will take you directly to a page where you can add your new channel to your own Roku device and preview it. You can share the link with your friends if you want a second opinion on your channel.  

Create Your Roku Channel

It usually takes up to 24 hours to automatically show the channel on a Roku device. If you want to access it immediately, go to your Roku device Settings > System > System Update.

Feed Status

The Preview and Publish page comprises a supplementary page called Feed Status, which provides additional information about the functionality of your content feed.

Create Roku Channel

Congratulations! Your Own Roku channel is created and published using Direct Publisher! Now, you can change the channel and the assets to match your brand. 

Conclusion

We hope you will find this blog helpful. After going through this blog, we understand the complete process of publishing the Roku channel. So, if you want to publish your own Roku channel, this is the time for you. If you still face some issue, contact 4 Way Technologies for robust Roku-based software solutions.

Close Bitnami banner
Bitnami