Skip to content

Sample client application for 10Duke Identity and Entitlement, written in React

Notifications You must be signed in to change notification settings

10Duke/react-sample

Repository files navigation

This is a test / demo client for 10Duke Identity and Entitlement service. The application demonstrates the following features:

  • Single Sign-On against 10Duke using OpenID Connect with PKCE (Proof Key for Code Exchange)
  • Consuming and releasing licenses
  • Single Sign-Out

Sample licensed features of the test client are FOSS games. This test client uses the 10Duke Entitlement service for determining if user logged in to the test client has license required for accessing each game. Licenses for these games should be configured in the 10Duke Entitlement service against which testing. The games and the respective licensed item names used for 10Duke license checks are given in the table below:

Licensed item The game License
2048 2048 The MIT License (MIT)
Copyright (c) 2014 Gabriele Cirulli
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
Pacman pacman-canvas Creative Commons License
Pacman Canvas by Platzh1rsch is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.
Based on a work at https://github.com/platzhersh/pacman-canvas.
SimonSays react-simon-says Beerware / weslleyaraujo

Prerequisites

⚠️ Must be run in a secure context (HTTPS)

The application uses SubtleCrypto of Web Crypto API for computing PKCE hashes, and SubtleCrypto requires secure context. localhost is considered a secure context, but with other hosts HTTPS is required.

The application uses Fetch API for HTTP requests.

Running locally (using dev server)

First, make sure you have installed all dependencies of the test application with npm install.

Add file named .env.local in the project root directory (this directory) on your machine. This file can be used for overriding configuration parameters of .env and to configure this application to run with your 10Duke server deployment. Example content of .env.local:

REACT_APP_SRV_BASE=https://my-10duke-accounts.example.com
REACT_APP_CLIENT_ID=my-test-client

Here, REACT_APP_SRV_BASE=https://my-10duke-accounts.example.com points to your 10Duke Identity and Entitlement service. REACT_APP_CLIENT_ID=my-test-client specifies id of this this test client, as configured on the 10Duke service.

In the 10Duke service, this test application must be configured as an OAuth client with these details:

  • Client id: As configured in .env.local (see above)
  • OAuth flow: PKCE (Authorization Code Grant flow with Proof Key for Code Exchange), client secret not used
  • Login callback URL: http://localhost:3000/logincb
  • Logout callback URL: http://localhost:3000/signoutcb

Now you can run the test client locally using npm start (see below).

Building and publishing Docker image

The project comes with Dockerfile that can be used for building a Docker image with this application. Some basic commands for building and publishing the image are listed below:

# Build the image
docker build -t 10duke/duke-test-client:<version> .

# Tag for publishing to your internal Docker repo
docker tag <imageId> docker-repo.example.com:<port>/10duke/duke-test-client:<version>
docker tag <imageId> docker-repo.example.com:<port>/10duke/duke-test-client:latest

# Push to your internal Docker repo
docker push docker-repo.example.com:<port>/10duke/duke-test-client:<version>
docker push docker-repo.example.com:<port>/10duke/duke-test-client:latest

Using the image

# Pull image from your internal Docker repo
docker pull docker-repo.example.com:<port>/10duke/duke-test-client:latest
# Run the image (in HTTPS port 48444)
docker run -d -p 48444:443 docker-repo.example.com:<port>/10duke/duke-test-client:latest

Available Scripts (as initialized by Create React App)

This project was bootstrapped with Create React App.

In the project directory, you can run:

npm install

Install the application in the current directory.

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

npm run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

Learn More

You can learn more in the Create React App documentation.

About

Sample client application for 10Duke Identity and Entitlement, written in React

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published