In this article, we are going to implement (OAuth) login with google in Nest JS. Coming from Express, implementing OAuth in Nest JS may seem not so...
For further actions, you may consider blocking this person and/or reporting abuse
@imichaelowolabi,
done
callback should not be used invalidate
method, because it is invoked internally by nestjs/passport. It is better to just return user object from validate:Thanks for this detailed explanation.
I am working on angular + nestJs project, which are configured at different ports (localhost:4200 and localhost:8080). I am trying to request from angular to nestJs.
But it is not redirected on CallbackUrl, rather it is giving me some CORS error. However,
I have put, localhost:8080 and my endpoint at authorized URI and also configured app.enablecors() in main.js
I am having this error instead,
Access to XMLHttpRequest at 'https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A8080%2Fv1%2Fauth%2Fredirect&scope=email%20profile&client_id=XXX' (redirected from 'localhost:8080/v1/auth') from origin 'localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
....
However, after clicking that redirection link manually, it is working properly. Did I miss anything?
Any help is appreciated.
Hi Kaivan,
Thanks for the feedback. As per the error you're getting, this simply has to do with the "Authorized Javascript origin" and the redirect URI. Kindly crosscheck these two values from your google console to ensure they are the correct endpoints for your frontend and backend app.
Thanks for your reply,
As I am requesting from angular and default port is 4200, I have given localhost:4200 in authorized JavaScript uri and I am redirecting it to the backend, thus I have given localhost:8080 over there in the redirect uri.
Kindly can refer this picture.
dev-to-uploads.s3.amazonaws.com/up...
Hello Kaivan,
Did you find a solution? cuz I have the same problem. I'm using nextJs and I have a cors problem even if I've enabled it
Hello WassilaBen,
Did you find a solution? cuz I have the same problem too...😅
vcs resolveram o problema? como?
In your Nest Js app open your main.ts add this
after creating an instance of nest application
Change the origin to localhost:8080
I've faced the same issue, please share your solution if you find finally.
vcs resolveram o problema? como?
did you find a solution because i got the same problem
(redirected from 'localhost:3000/google') from origin 'localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
InternalOAuthError: Failed to obtain access token
at GoogleStrategy.OAuth2Strategy._createOAuthError (C:\Work_test\google-oauth-nestjs\node_modules\passport-oauth2\lib\strategy.js:408:17)
i just test github.com/iMichaelOwolabi/google-...
I got the correct google account login interface and logged in successfully, but reported an error when calling back the localhost:3000/google/redirect?cod....
How can I tell if I have a problem with my google project settings or JS code?
Hi Zicjin, try to reconfirm your redirect URL both on google and in your code as well as the scope. Sometimes when asking for non-existent scope, you may get such error.
Please let me know how it goes.
For others: double check your client ID and secret for the typos.
I am getting the following error after applying this method.
node_modules/apollo-server-core/dist/ApolloServer.d.ts:5:8 - error TS1259: Module '"/Users///node_modules/@types/ws/index"' can only be default-imported using the 'esModuleInterop' flag
5 import WebSocket from 'ws';
~~~~~~~~~
node_modules/@types/ws/index.d.ts:270:1
270 export = WebSocket;
~~~~~~~~~~~~~~~~~~~
This module is declared with using 'export =', and can only be used with a default import when using the 'esModuleInterop' flag.
Sorry, this Error is not related to this module.
Thanks for the clarification Humayun
I am getting following error when I ran npm run start
src/app.controller.ts:1:49 - error TS2307: Cannot find module '@nestjs/common' or its corresponding type declarations.
1 import { Controller, Get, Req, UseGuards } from '@nestjs/common';
~~~~
~~~~src/app.module.ts:1:24 - error TS2307: Cannot find module '@nestjs/common' or its corresponding type declarations.
1 import { Module } from '@nestjs/common';
~
~~~~~~~src/app.service.ts:1:28 - error TS2307: Cannot find module '@nestjs/common' or its corresponding type declarations.
1 import { Injectable } from '@nestjs/common';
~~~~
~~~~src/google.strategy.ts:5:28 - error TS2307: Cannot find module '@nestjs/common' or its corresponding type declarations.
5 import { Injectable } from '@nestjs/common';
~
~~~~~src/google.strategy.ts:14:17 - error TS2580: Cannot find name 'process'. Do you need to install type definitions for node? Try
npm i --save-dev @types/node
.14 clientID: process.env.GOOGLE_CLIENT_ID,
~~
~~~~src/google.strategy.ts:15:21 - error TS2580: Cannot find name 'process'. Do you need to install type definitions for node? Try
npm i --save-dev @types/node
.15 clientSecret: process.env.GOOGLE_SECRET,
~~
src/main.ts:1:29 - error TS2307: Cannot find module '@nestjs/core' or its corresponding type declarations.
1 import { NestFactory } from '@nestjs/core';
~~~~
~~../node_modules/@nestjs/passport/dist/auth.guard.d.ts:1:29 - error TS2307: Cannot find module '@nestjs/common' or its corresponding type declarations.
1 import { CanActivate } from '@nestjs/common';
~~~~
~~~~../node_modules/@nestjs/passport/dist/interfaces/auth-module.options.d.ts:1:38 - error TS2307: Cannot find module '@nestjs/common/interfaces' or its corresponding type declarations.
1 import { ModuleMetadata, Type } from '@nestjs/common/interfaces';
~
~~~~~~~~~~../node_modules/@nestjs/passport/dist/passport.module.d.ts:1:31 - error TS2307: Cannot find module '@nestjs/common' or its corresponding type declarations.
1 import { DynamicModule } from '@nestjs/common';
~~~~
~~~~../node_modules/dotenv/types/index.d.ts:2:23 - error TS2688: Cannot find type definition file for 'node'.
2 ///
~~~~
../node_modules/dotenv/types/index.d.ts:23:17 - error TS2580: Cannot find name 'Buffer'. Do you need to install type definitions for node? Try
npm i --save-dev @types/node
.You miss install
@nestjs/core
and@nestjs/common
, and don't forget to install @types/node an dev dependencies 😅hi, thanks for the code works perfectly;).
on the other hand I have a question when the page reloads I have an
Error Server:
error: TokenError: Bad Request
at GoogleStrategy.OAuth2Strategy.parseErrorResponse,
Page:
statusCode: 500
message: "Internal server error",
how would you solve the problem? thank you so much.
Hi, have same issue, could u help with solving this error?
How to load ClientID, ClientSecret and CallbackURL from database instead of loading from env in this example. Here is the code where you are loading it from env.
I am facing this error when login with google
Any body face this issue and resolved it?
{"statusCode":404,"message":"Cannot GET /google/redirect?code=4/0AX4XfWg_370s0nW_gRVvaBql7g8u0TPVmgoLkly22yTxM7JIccz0-tFAht0ELvLn6BOQ7A&scope=email%20profile%20https://www.googleapis.com/auth/userinfo.email%20https://www.googleapis.com/auth/userinfo.profile%20openid&authuser=0&prompt=consent","error":"Not Found"}
Hi,
From the error message you shared, it seems the redirect endpoint doesn't exist or doesn't have use the right HTTP method in your app.
You should confirm that you have the google redirect endpoint setup in your application with the right GET http method and try again
Thx for the Article,
But i have an problem with this.
I am using graphl with this first i had an problem that i had not an Response object i fixed this with
but now i dont get any real response at all.
i debuged alot and found out that the google-strategy never calls success, error or fail to realy end the transaction.
the only function that calls these is self._oauth2.getOAuthAccessToken
but this gets also never called.
i also could not find where this function is called at all i search for this function in my node_modules folder and only found the declaration.
Thx for Help
Greetings
i think i found an fix for that.
the problem is that the oauth2 strategy is looking for req.query.code
so one fix is just write the token in the req.query.code in the getRequest function
did think that this fixes the issue but no.
does anyone has experience with nestjs + passport (google) and graphql?
Hi there! thanks for the article, but I keep having this error that I can't fix. I get:
"Access blocked: Authorization Error
Missing required parameter: scope
Error 400: invalid_request"
I do have the scope parameter, and I have my callback URL also, any other ideas? I don't know what else to try.
Hey Michael, this is a nice guide to get started, but isn't it incomplete? Every time I visit a guarded page I'm redirected to Google's OAuth page again. Shouldn't there be a step to use the received
accessToken
? Or how should the server handle subsequent requests?Hello @thisismydesign thank you for your kind words.
About your question, yes the received access token should be used but the use will differ across various applications which will be determined by the use case in the application and the developer. My aim in writing this article is just to show to authenticate with Google OAuth in a Nest application.
Man! You're amazing! Real omo iya mi! I've been using resources to build Nest.js + Passport (for Google). All confusing but I moved on. But something was off still... This is the last resource I've visited and now, it works! Why am I appreciating you especially? Just the fact that you added that I could visit the Google endpoint and other details you've given!
the refreshtoken comes as undefined and even the accestype offline parameter wont solve it. Please Help
Does anybody know why after login I get this
Well done, very useful.
Thanks Rodolfo, glad it helped.
this one's neat!! but can u make the graphql version of this ??
Thanks a lot for the article!
You're welcome Barin. Glad it helped
Nice piece. Keep it up!!!
Thank you man
Nice content boss. it was really helpful
Thanks man.
Super useful and straith forward.
No errors encountered too.
Thanks a lot.
5 mins setup and my app now supports google login.
i'm trying to make now authentication to connect to google calendar api and bring calendar data.
any hint?
Hi Any tutorial u suggest to integrate with this stack :
NestJS + GraphQL + passport-google-oauth20
completely hit the roadblock on this one. 😢
Hi I'm looking for a way to integrate google calendar using nestjs. However I am confused with authentication using OAuth2.
Good article
Hello,
Objective **: To get **refresh_token.
Can you please suggest on how to add
access_type=offline
approval_prompt=force
as parameter for the OAuth url?
Hi Michael,
How to store the user info in cookie session in Nest? Could you point me to the right direction?
Hi, I think this example is for jwt.
If you want to use a cookie session you can add a route guard that creates a session cookie for you.
Controller
Guard
At this point you have a cookie and you can redirect the user back to front end ( if you have one ) and do another request to ask user information.
Man, thanks a lot for the great article! I've set up login using google in 10 mins thanks to it!
Works Perfectly
how to get phone number