Up next in 10
Build a Node.js Express Google OAuth2 Login & Logout System With Sessions Using google-auth library
Dec 10, 2025
Get the full source code of application here:
https://codingshiksha.com/node/build-a-node-js-express-google-oauth2-login-logout-system-with-sessions-using-google-auth-library/
Show More Show Less View Video Transcript
0:00
Uh hello guys, welcome to this video. So
0:02
in this video I will show you uh the
0:05
complete Google authentication system
0:07
how to build this inside uh NodeJS
0:10
express. So we have this live demo
0:12
available to us and we have this login
0:15
with Google button and as soon as you
0:17
click the login with Google button you
0:18
will be redirected to a screen where you
0:20
will be able to select your Google
0:22
account. So it's a consent screen and as
0:24
soon as I select my Google account I
0:27
need to grant the permission. So simply
0:29
click on continue. As soon as you click
0:31
continue, you will see he will display
0:34
the username. This is your
0:39
username right here. Email address. This
0:42
is your profile picture that is not
0:45
showing it due to course issue but it
0:49
also returns. So we also see the log out
0:51
button as well. So the thing is that we
0:53
are storing this information in
0:54
sessions. So that when you refresh the
0:56
page as well, let's suppose I close this
0:59
tab and re reopen this tab. So it will
1:02
automatically detect that I'm already
1:04
logged in. So it will refresh and uh
1:07
redirect to my profile page. [snorts] So
1:10
we are storing this information in
1:12
sessions using express session
1:14
middleware and [snorts] we are also
1:16
using EJS template engine if just to
1:19
serve the HTML
1:22
and apart from that we are using a
1:24
special package in NodeJS which is for
1:27
authentication for doing the Google O.
1:30
So this package name is uh Google O
1:33
library.
1:35
So if you just search for this package,
1:38
it's a Google API client library. So the
1:42
command is simple. You just need to
1:44
install this. I've already installed it
1:47
almost having 11 million weekly
1:49
downloads. It's a very popular package
1:51
for implementing the Google
1:52
authentication.
1:54
So now for implementing this, I have
1:57
given the step-by-step instruction with
1:59
a detailed blog post. You can go to the
2:01
description link to follow along with
2:04
this video.
2:05
So first of all guys what we need to do
2:07
I will simply delete everything and
2:10
start from scratch.
2:14
[snorts] So
2:17
let me delete everything
2:20
and start from scratch. So
2:24
let me show you all the modules that we
2:27
need for this tutorial. So if you see in
2:30
the package dojson file we are using
2:33
this
2:34
env which is the module necessary for
2:37
storing sensitive information. So inside
2:40
this we will store the client ID client
2:42
secret. We have the EJS module express
2:46
and then the express session which used
2:48
to store information inside your
2:50
sessions variables and then this Google
2:52
o library. These five packages are
2:56
required. Simply install this by simple
2:58
command. Go to your terminal. Just type
3:00
npmi and install all those five
3:03
packages. Now to get started just create
3:06
a simple index.js file inside the root
3:09
directory. And uh apart from that we
3:12
also need to create av file where we
3:15
will store all this information which is
3:18
your client secret client ID redirect
3:22
URI.
3:24
So
3:25
just create these three variables and
3:27
the session secret as well. So
3:30
for implementing this express session
3:32
middleware you need this session secret.
3:34
This can be anything. I'm just calling
3:36
it as secret. So these four variables
3:40
client ID client secret redirect URI.
3:43
So for obtaining this information you
3:45
need to go to your Google cloud console
3:47
account and
3:51
just create account here. I've already
3:53
have one account. So just go to
3:55
credentials and uh create a O client ID.
4:01
So simply tap this option and simply
4:04
click O client ID and uh
4:10
so from the drop-down simply select web
4:12
application and uh in the authorized
4:14
JavaScript origin you need to paste the
4:18
full URL of your homepage. So where are
4:21
your application resides? So I'm running
4:23
this application on localhost 3000.
4:26
Apart from that we also need to paste
4:29
the localhost version right here. So
4:32
both these two links we need to paste
4:33
right here. And apart from that in the
4:36
authorized redirect URI we need to paste
4:38
the same URL. So simply copy this and
4:41
paste it right here. And then we need to
4:43
click the create button. And as soon as
4:46
as soon as you click the create button,
4:48
it will give you your client ID. So this
4:51
is your client ID. Simply copy this
4:55
and uh replace it right here. So this
4:59
will be different for you. So and then
5:03
similarly it also gives you the client
5:06
secret as well. So
5:10
simply copy this and same redirect URI
5:14
you will
5:16
so whatever redirect URI you used in
5:19
that
5:21
let me copy this redirect URI and paste
5:25
so which is http localhost
5:27
3000/google/allback
5:31
so I'm just going it
5:35
and replacing it the same URL in the
5:38
authorized redirect URI. Simply paste
5:40
the same URL right here and then click
5:44
on save. So that's all that we need to
5:46
do inside the configuration. So now you
5:48
can close this and lastly which we have
5:52
the C session secret. So just define
5:54
this. So now you can close this env file
5:57
and
6:00
after doing this authentication now we
6:02
can start our sample express server
6:05
where we will start our [snorts] web
6:07
application. So
6:10
for this we will need to start a basic
6:13
express server. So we'll require express
6:17
and also we'll be requiring the express
6:20
session middleware
6:28
and then we also need to require
6:31
the OOTH 2 client
6:37
which will be coming from Google O
6:39
library
6:41
and then we also need the built-in path
6:43
package of NodeJS. this
6:48
and then we'll be requiring this env
6:50
package for loading the enviables. So
6:53
envon
6:56
and then we will simply start a basic
6:58
express app
7:01
and I will listen on this port number
7:03
3000.
7:10
So app is listening on port 3000.
7:14
So in this way you can start your basic
7:16
express app. So if you go to localhost
7:18
3000. So we do need to define a route
7:22
here. So we simply say app.get.
7:26
So whenever you go to the homepage we
7:28
will show a simple EJS template.
7:33
So we just need to set the view engine.
7:35
So you say app dot set view engine EJS.
7:39
So then we can render this simple
7:41
template
7:43
index. So for this EJS we need to create
7:45
a views folder
7:48
and then just define this template
7:50
index.js.
7:52
So here you will paste your HTML
7:57
code. So this will simply contain the
8:00
login button.
8:03
So you can go to my blog post as well to
8:06
get this HTML code directly. paste that.
8:09
So this simply contains this H1 tag.
8:12
Welcome to the Google login demo. And we
8:16
have a button anchor tag. And as soon as
8:19
you click this button, you will be
8:20
redirected to / Google.
8:24
So if you refresh now, you see this. But
8:27
we haven't made this route localhost
8:30
3000/GL.
8:32
So now we just need to define this
8:34
route. So just go to your index.js. JS.
8:39
So right here
8:44
we will define this route here which
8:47
will be app dot get slash O
8:54
/ Google and here we will redirect the
8:57
user to the authentication URL. So
9:02
client
9:05
I think we haven't made this.
9:10
So first of all uh we need to pass the
9:12
middleware app dot use. So your session
9:17
D express session. So here it takes
9:19
three options the secret. So the secret
9:22
is available in the process. TNB and we
9:26
have defined this
9:29
environment variable session secret and
9:31
then it also takes the resave option and
9:34
this is typically set to false. The
9:37
third option is save on uninitialized it
9:40
is typically set to true. So in this way
9:43
you can pass your expressed middleware
9:46
and then here we need to now define the
9:49
oath client. So we'll be defining the
9:52
new instance of O2 client and here it
9:55
takes three arguments. First of all your
9:58
client ID. So we have defined all these
10:01
three variables the environment
10:04
variables. So one by one we will pass
10:06
it. Secondly which is your client
10:10
secret.
10:13
Then we have
10:16
the redirect URI. So,
10:26
so you can see in this way we have
10:28
passed all these three things which we
10:30
defined in the env file.
10:35
So after you do this now we will inside
10:38
this request we will
10:42
inside this call back
10:45
this client object. It actually contains
10:48
a function which is used to create the
10:51
authentication URL.
10:54
So it contains this function client dot
10:57
generate o url and uh here we need to
11:01
pass the option access type to offline
11:05
and here we need to pass the scope. So
11:07
which information you are accessing of
11:09
this user. So we need the simple profile
11:12
information and the email of the user.
11:15
So here we are explicitly
11:17
telling
11:21
so this is actually a array not an
11:23
object. So just change it to square
11:25
brackets. So here we are simply telling
11:28
the API to request the profile and the
11:31
email of the user. So now they will give
11:33
us this URL. So now we need to simply
11:36
redirect the user. So response do
11:38
redirect and URL. So now what happens?
11:42
So if you click this link here.
11:47
So if you go to click this button you
11:50
will be redirected to the Google consent
11:52
screen where you will see the series of
11:54
accounts Google account. So as soon as
11:56
you click the account now you need to
11:58
grant the permission. Simply click
12:00
continue and now this call back redirect
12:04
URI uh which hasn't been defined here.
12:08
So this authorization code you can see
12:10
right here. We now need to exchange it
12:12
with the access token. So now we need to
12:14
define this redirect URI which we
12:17
mentioned in the Google cloud console.
12:19
So now after this we will define this
12:28
uh uh get route where we will be
12:32
exchanging this authorization code that
12:34
we have with the access token to get the
12:36
profile information. So this direct URI
12:40
which is / Google/
12:44
callback. This can be anything. I'm just
12:46
calling it like this
12:49
request response async function. And
12:52
here we first of all store this
12:54
authorization code by request dot query
12:57
dot code. After getting this
12:59
authorization code now this library
13:02
contains a function. So we will write
13:04
all this code in the try catch block.
13:06
So,
13:12
so right here uh we first of all
13:17
extract this access token.
13:21
So, this client dot we have this
13:23
function get token. So here we need to
13:26
pass the authorization code. So this
13:27
will get give us this access token. So
13:32
now we need to verify this access token.
13:34
So we can simply say
13:37
const ticket await. So there is a
13:40
function here for this as well. So
13:43
client dot verify
13:45
id token
13:51
and this actually takes an object right
13:54
here this function and here you need to
13:56
pass your ID token which is available
13:59
inside tokens do id token
14:04
and then the audience.
14:07
So audience here we need to pass your
14:09
Google client ID which is stored inside
14:12
the environment variable.
14:14
So now this will give us this data and
14:20
it contains this ticket get payload
14:22
function.
14:25
So now this payload will be your user
14:28
data user profile data. Now we need to
14:30
save this information in the session. So
14:32
you simply say request dot session dot
14:35
user and we are simply creating a new
14:37
variable in the session. So user object
14:40
and it will contain three properties
14:43
payload and it contains your name. Then
14:48
we need to store the email of the user.
14:51
Then the profile picture.
14:54
So payload
14:57
dot picture. So we are storing these
14:59
three details name, email and picture.
15:02
Now we just need to redirect the user
15:04
back to the homepage. So we simply say
15:07
response redirect homepage.
15:10
So now what happens if you see uh after
15:13
redirect we redirect the user back to
15:15
the homepage. So now we need to change
15:18
this template. We need to hide this
15:20
Google login with Google button because
15:22
we now need to show the profile
15:24
information. So for this
15:28
[snorts]
15:31
we need to define another
15:33
EJS template. So just create the view
15:36
inside the views folder we need to
15:38
create profile. EJS.
15:41
So here we will be displaying the actual
15:44
profile of the user. So
15:48
and now we need to make change in the
15:51
get route. So whenever you go to the
15:53
home route
15:56
because we are statically loading this
15:57
template here response. But here we need
16:00
to now make a condition that if the user
16:03
is already in the session if the session
16:06
exist then we need to render out this
16:08
template which is the profile template.
16:11
So the user will be already logged in.
16:13
So we need to pass the logged in user
16:16
which is contained inside response
16:18
request. session dot user.
16:22
So in the else block if the user is not
16:25
logged in if the session doesn't exist
16:27
then we show the login page. So we just
16:30
make this condition. So
16:33
now we can show the profile information.
16:36
If you refresh now,
16:44
so as soon as you click the button, you
16:46
will see you will now be redirected to
16:49
the profile route. The login button has
16:51
been hidden. So now in this profile
16:53
route to show this user profile
16:56
information, we are getting this object
16:59
passed.
17:01
So we can directly access the properties
17:03
and display a simple welcome message. So
17:07
we will use some EJS. So user dot name.
17:12
So this percentage sign is a simple
17:14
syntax of EJS.
17:17
So similarly uh we can display
17:21
simple profile information. So I will
17:24
just paste this code. So you can get
17:25
this using the blog post. So if you
17:28
refresh now you will see this data
17:30
appearing. This is your username, email
17:32
address and profile information. Profile
17:35
picture doesn't typically display
17:37
because of course error because the
17:40
picture is belonging to a different
17:41
domain. So we can't directly access it.
17:45
Sometimes it display sometimes it
17:47
doesn't. But we get this profile
17:49
information. If you see and now if I
17:53
close this again access it then also it
17:56
will it will work you can see
17:58
automatically it detects that we are
18:00
already logged in. So we added this log
18:02
out function as well. So if I click the
18:04
log out button we haven't implemented
18:06
this uh route here. When we click the
18:08
log out button we need to uh delete the
18:12
information from the session so that the
18:14
user is successfully logged out. So we
18:17
just need to go to index.js JS and just
18:19
make this request.
18:32
So inside this request we simply make
18:35
the session variable to null so that the
18:38
information stored of the user becomes
18:43
null. So,
18:47
so there is a function here which
18:49
request dot session.destroy. So, this
18:51
will destroy the session.
18:57
That's all. So, if you refresh now,
19:09
[snorts]
19:10
so now you already logged in. So if I go
19:13
again to the homepage, I will redirect
19:16
to the profile page. But as soon as I
19:18
click the log out button,
19:28
oh sorry, we missed a condition right
19:30
here. After destroying the session, we
19:33
also need to redirect the user to the
19:34
homepage. So we add need to add this
19:38
line response redirect
19:40
to the homepage. So now what happens as
19:43
soon as you click the log out button you
19:45
will be redirected to the homepage. So
19:47
now you can see that. So in this way
19:50
guys you can implement uh user
19:52
authentication of Google inside NodeJS
19:55
express using this package.
19:58
All the source code will be given in the
20:00
description of this video and also check
20:02
out my website as well
20:04
freemediatools.com
20:06
uh which contains thousands of tools
20:08
regarding audio, video and image and I
20:11
will be seeing you guys in the next
20:12
video. Until then, thank you very