Code Monkey home page Code Monkey logo

on-device-authentication's Introduction

On-device-authentication

Overview

This channel demonstrates how to implement on-device signups and sign-ins and grant customers access to content. It shows how to use the ChannelStore node and Roku Web Service API to check for an active Roku subscription, and how to use the roRegistrySection() object and ChannelStore node to check for access tokens in the device registry and Roku Cloud, respectively. If the customer does not have an active subscription or their subscription cannot be validated (because it was purchased on a different platform), the sample shows how to use the Roku Pay Request for Information (RFI) screen to sign customers up for a new Roku subscription and sign them in to their existing subscription.

You must incorporate this sample with the products and test users linked to your channel to observe its entire functionality. Your channel must also be enabled for billing testing.

Components

MainScene

The MainScene component validates whether the Roku account linked to the device has a purchased a subscription for the sample channel. If a customer does not have a subscription or their subscription cannot be validated, it displays a landing screen page where customers can sign up for a subscription or sign in to their existing one. It monitors the Sign Up and Sign In buttons on the landing page to determine which RFI screen context ("signup" or "signin") to display when a button is pressed. For sign-ups, it creates a new subscriptions through Roku Pay; for sign-ins, it verifies the credentials and then grants access to content. The logic used in this component follows the On-Device Authentication document to verify access to content and create new Roku subscriptions.

This sample uses hardcoded values for the access token and email validation flag instead of calls to authentication and entitlement server endpoints. You can replace these hardcoded values with calls to your endpoints to test your services with this sample channel.

In this case, you must change the bs_const=sampleHardCodedValues flag in the channel manifest to false, replace the sample API key ("devAPIKey") in the MainScene.brs file with your developer API key, and provide the URLs of your endpoints in the commented out makeRequest() methods (these include a field with a placeholder value such as "PUBLISHER...LINK GOES HERE").

SignUpScreen and SignInScreen

The SignUpScreen component is used to handle customers that click Cancel on the RFI screen when signing up for a subscription because they do not want to share their Roku customer account information with the channel. This component enables customers to manually enter their email address in a StandardKeyboardDialog; the entered email address is then displayed in a TextEditBox. When the customer clicks Sign Up, the component returns the customer to the MainScene component to purchase a subscription.

The SignInScreen component is used to collect the customer's email address and password after they click Sign In on the landing page. If the customer elects to share the email address associated with their Roku customer account information in the RFI screen, it pre-populates a TextEditBox with the customer's email address, and then displays a StandardKeyboardDialog for them to enter their password. The obfuscated password is displayed in a TextEditBox. If the customer clicks Use different email in the RFI screen, it displays a StandardKeyboardDialog for them to enter their email address. When the customer clicks Sign In, the channel validates the credentials, and then displays the ContentScreen component, which displays video content that can be played.

ChannelStoreProduct

The ChannelStoreProduct component provides the user interface for this sample channel. It includes LayoutGroup nodes for displaying the names, codes, and prices for the mock products, and it includes a Poster node for marking products as "purchased" when they are bought.

RegTask

The RegTask component provides methods for reading, writing, and deleting this sample channel's registry section on a Roku device.

UriFetcher

The UriFetcher component provides a simple, non-blocking implementation of a basic download manager which is capable of multiple asynchronous URL requests implemented through a long-lived data task. This can be used in on-device authentication to make asynchronous calls to authentication and entitlement services, for example.

Feed Parser

The FeedParser component retrieves the video content items used in this sample from an XML feed and then indexes and transforms them into ContentNodes so they can be displayed in BrightScript components. This process is useful if you do not have a web service for pulling content IDs from your feed (for example, your feed is maintained in an Amazon S3 bucket).

Specifically, the FeedParser component stores the stream URLs and other meta data for each content item in the feed in an array of associative arrays. The captured meta data includes a thumbnail image (used for the channel's poster and background images), description, and title. Importantly, it stores the items' GUIDs as content IDs and links them to the metadata. This enables you to pass the GUIDs in ECP cURL commands and deep link into the associated content. To display the content items on the screen, it formats the items into ContentNodes and then populates them in a RowItem.

ContentScreen

The ContentScreen component displays and plays video content once a customer's subscription purchase is validated.

Installation

To run this sample, follow these steps:

  1. Download and then extract the sample.

  2. Expand the extracted On-Device-Authentication-Sample folder, and then compress the contents in to a ZIP file.

  3. Follow the steps in Loading and Running Your Application to enable developer mode on your device and sideload the ZIP file containing the sample onto it. Optionally, you can launch the sample channel via the device UI. The sample channel is named On Device Authentication Sample (dev).

  4. Upon launching the channel, click Sign Up. In the RFI screen, click Continue to grant the sample channel access to your Roku customer account information (or click Cancel to manually enter your information).

  5. Click a product in the sample channel UI. Complete the transaction for the product. The product will be marked as "Purchased" when you open the sample channel again.

    This sample requires that you to use the in-channel products linked to your development channel.

    Your device must be running Roku OS 9.2 or greater to ensure that the sample channel runs properly after cancelling mock purchases in the Roku Pay screen.

  6. Access is granted to the channel's video catalog.

  7. To re-purchase products, replace the Api Key (devAPIKey) in the MainScene.brs file with your developer API key. Press the Option (*) button on the Roku remote control to delete the sample channel's registry, and then go to the Test Users page in the Developer Dashboard to void the product transactions associated with a test user linked to your channel.

  8. To test the sign-in flow upon launching the channel, click Sign In. In the RFI screen, click Continue to grant the sample channel access to the email address associated with your Roku customer account (or click Use different email to manually enter it). Enter a password, and then click Sign In.

on-device-authentication's People

Contributors

jduval23 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.