This codebase is built on top of the FusionAuth's main Device Authorization Grant flow example. You can find the original example on the FusionAuth GitHub repository.
Read the full article walking you through the Device Authorization Grant and how it can help your users log in to your application.
A basic HTML/JavaScript app demonstrating the Device Authorization Request and Device Access Token Request of the OAuth2 Device Authorization Grant specification.
Use in conjunction with an installation of FusionAuth to demo the entire Device Grant workflow.
-
Download and install FusionAuth:
Start by downloading and installing FusionAuth.
-
- Enable Device Grant on the OAuth tab under "Enabled grants."
- Enter a Device Verification URL.
- This URL should be as short (and sweet) as possible.
- This URL will be either the landing page to your application that can perform a 302 redirect to the FusionAuth device page with the required request parameters or a URL configured in a proxy to perform the same redirect.
- For example,
https://acme.com/activate
which would be able to redirect tohttps://login.acme.com/oauth2/device?client_id={client_id}&tenantId={tenantId}
wherehttps://login.acme.com
is the URL of your FusionAuth service.
- Click save (blue icon at the top right).
-
Update the FusionAuth CORS policy:
- Add
http://localhost:8000
to "Allowed origins." - Check "POST" as an "Allowed method."
- Click save.
- Add
-
Edit the main.js file in this project:
- Change
baseFusionAuthURL
to your base FusionAuth URL. - Change
clientId
to that of the newly created Application in the previous step.
- Change
-
Run this example:
- Run
python3 -m http.server
to start a simple HTTP server for theindex.html
file. - Open
localhost:8000
in your browser. - Click the "Click to Start" button.
- Browse to the URL provided and enter the code or scan the QR code with your phone.
- Run
For more information about FusionAuth and its core concepts for applications, refer to the FusionAuth documentation.