Implement Visitor Authentication using Node and Auth0
Last updated
Last updated
In this guide, we will show you how to set up Visitor Authentication using Auth0 and Node.
git
, node
, and npm
are installed on your computer. Familiarity with the terminal (or command line). You can learn how to install these tools here: Git and Node. NPM is bundled with Node.
First, sign in to Auth0 platform and create a new application (or use an existing one) by clicking the Applications button in the left sidebar. If creating a new application, name it appropriately and choose "Regular Web Application" as the option. We will be using Regular Web Application for the sake of this guide. Click Create.
A quickstart panel will show up. Select Node.js (Express) option and then select "I want to integrate my app." You will see a screen prompting you to configure Auth0. It should look like the image below
Click on Save Settings And Continue.
The rest of this guide requires you to be comfortable working with common developer tools such as git and the terminal (or command prompt if you're on Windows). We will come back to Auth0 in a minute.
Now, we will create the backend responsible for authenticating the visitors to your space.
On your computer, clone the git repository by running
git clone https://github.com/GitbookIO/auth0-visitor-authentication-example
in the directory (folder) you want to be working from. Open the folder in your favorite code editor (say, VS Code).
We will edit the server.js
file and enter the details of our Auth0 application there.
Your config object should look like the following right now:
You will also find a config
object on the Auth0 page you were on.
If you're not seeing the Configure Router page shown below and are still seeing the Configure Auth0 prompt, you might have to click on Save Settings and Continue again to get to this page.
Copy the config
object from this page and replace the config
object in your code editor with this.
In your code editor, for the secret
field in the config object, you can choose one yourself or you can generate a new secret by using the terminal. Open the terminal app on your computer and run openssl rand -hex 32
. This will generate a secret that you can enter as the value for the secret
. You can hardcode it directly in the code or you can retrieve it from env (recommended for production use. In this demo, we will hardcode this value.)
Your config
object in your code editor should now look something like this:
Note that your secret,clientId
, and issuerBaseUrl
will be different from the ones shown above.
Now, we need to use GitBook. Go to the space you want to publish behind visitor authentication. Open the Share modal and click "Share to an audience", and enable the "Publish with Visitor Authentication" toggle.
Make note of the Private key and the Space URL. We will need them.
Enter http://localhost:3000
as the Fallback URL. Click Save.
Go back to your code editor and in the following line
Replace gitbook signing key
with the Private key you copied. This line should look something like:
Note that your signing key will be different from the one entered above.
In your code editor, in the following line
Replace everything before ?
with the Space URL you copied from the GitBook Share modal. Make sure there's only one /
right before the ?
.
Save the server.js
file.
Open up the terminal and make sure you're in the auth0-visitor-authentication-example
directory.
Run npm install
which will install the dependencies of our project, including the library needed for communicating with Auth0.
After the installation of dependencies is complete, run node server.js
from the command line. If successful, you will see the following message:
Your Visitor Authentication setup is now complete! If you visit your published space URL now, you will be prompted to sign in using Auth0.
You can configure how you want users to login (say, with Google/GitHub or with email/password, or with other options like SAML) in the Auth0 Authentication dashboard.