Getting Missing required parameter: scope Passport.js, express - node.js

Im using Passport.js with express in my app to login with Google Oauth. But when i try to sign in, i get the following error: invalid parameter value for redirect_uri: Missing authority: http:localhost:3000/google/callback from which when i access localhost:3000/google/callback, i get Missing required parameter: scope. The relevant code:
const express = require("express");
const cors = require("cors");
const mongoose = require("mongoose");
const passport = require("passport");
const app = express();
const port = process.env.PORT || 3000;
require("dotenv").config();
require("./passport-setup")
app.use(passport.initialize())
app.use(passport.session())
app.get('/success', (req, res) => {
res.render("/profile.html")
})
app.get('/login', passport.authenticate('google', { scope: 'email' }));
app.get('/google/callback', passport.authenticate('google', { failureRedirect: '/failed' }),
function(req, res) {
// Successful authentication, redirect home.
res.redirect('/success');
}
);
passport config(relevant code):
const passport = require("passport");
const GoogleStrategy = require("passport-google-oauth2").Strategy
passport.use(new GoogleStrategy({
clientID: process.env.GOOGLE_CLIENT_ID,
clientSecret: process.env.GOOGLE_CLIENT_SECRET,
callbackURL: process.env.CALLBACK_URL,
passReqToCallback: true
},function(request,accessToken,refreshToken,profile,done){
console.log(profile)
return done(null, profile)
}
))
PS: I found this answer but i don't know what he means by 'JSON key'. Maybe the API updated.
Any help would be really appreciated.
Thanks in advance.
EDIT
The callback url I provided to google was not matching my `app.get`. Fixed.

PS: I found this answer but i don't know what he means by 'JSON
key' - the person referred to your GoogleStrategy which is A JSON
object contains zero, one, or more key-value pairs.
/* SECURE COOKIES TRUE MADE GOOGLE SIGN IN / SIGNUP WORK */
I was getting an error when trying to Sign in/up with Google account: Missing required parameter: scope and the following lines of code added before app.use(passport.initialize()); made it work!
if (app.get("env") === "production") {
app.set("trust proxy", 1);
session.cookie.secure = true;
}
You might have to implement express-session to make this work (check the npm website for docs on how to use) but simply declare at the top:
const session = require("express-session");
before app.use(passport.initialize()) add this lines:
app.use(
session({
secret: process.env.SESSION_SECRET,
resave: false,
saveUninitialized: false,
cookie: {},
})
);

My callback URL was http:localhost:3000/google/callback
Setting it to /gooogle/callback worked for me.

Related

InternalOAuthError: Failed to obtain access token? - NodeJS Passport

I've been trying all day but I couldn't solve it.
The problem is as follows;
I made an oauth2 system for my own website. But it gives me the error in the title.
I guess it doesn't detect the callback coming from the server side?
res.redirect('http://localhost:2000/callback?code=' + response.data.accessToken);
//Example => http://localhost:2000/callback?code=97a1438b602c76a680297426306785ec9ef49f43
The piece of code where I got the error;
const express = require('express');
const app = express();
const bodyParser = require('body-parser');
let token = 'http://localhost:3000/oauth/token';
let authorization = 'http://localhost:3000/login';
let temproraydata = {};
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
var passport = require('passport');
var OAuth2Strategy = require('passport-oauth').OAuth2Strategy;
passport.use(new OAuth2Strategy({
authorizationURL: authorization,
tokenURL: token,
clientID: 'application',
clientSecret: 'secret',
callbackURL: "http://localhost:2000/callback",
passReqToCallback: true
},
function (accessToken, refreshToken, profile, done) {
console.log(accessToken);
console.log(refreshToken);
temproraydata = profile;
return done(null, profile);
}
));
app.get('/provider', passport.authenticate('oauth2', { session: false }));
app.get('/callback',
passport.authenticate('oauth2', {
successRedirect: '/',
failureRedirect: '/login'
}));
app.listen(2000, function () {
console.log("Listening on port 2000");
});
this is error;
images
I've been working on it all day. I have done oauth server side but I am having problems on user side. I can't figure it out, I'm waiting for your help.

cors issue with passport.js google oauth strategy

I have a setup as such:
-backend
-model
--User.js
-routes
--auth.js
-database
--connection.js
-passport
--passport.js
--server.js
-client
-react folders / files
...
In my server.js:
const express = require("express");
const cookieSession = require("cookie-session");
const passport = require("passport");
const { authRoutes } = require("./routes/auth");
require("./model/User");
require("./services/passport");
require("./services/mongoConnect");
const app = express();
app.use(
cookieSession({
maxAge: "30 * 24 * 60 * 60 * 1000",
keys: "MY-KEY",
})
);
app.use(
cors({
origin: true,
methods: "GET, POST, PATCH, DELETE, PUT",
allowedHeaders: "Content-Type, Authorization",
})
);
app.use(passport.initialize());
app.use(passport.session());
const PORT = process.env.PORT || 5000;
app.use("/", authRoutes);
app.listen(PORT);
Inside my auth.js file inside my router
const passport = require("passport");
const router = require("express").Router();
router.get(
"/auth/google",
passport.authenticate("google", {
scope: ["profile", "email"],
})
);
router.get("/auth/google/callback", passport.authenticate("google"));
router.get("/api/logout", (req, res) => {
req.logout();
res.send(req.user);
});
router.get("/api/current_user", (req, res) => {
res.send(req.user);
});
module.exports = {
authRoutes: router,
};
Inside passport.js file I have
const passport = require("passport");
const GoogleStrategy = require("passport-google-oauth20").Strategy;
const mongoose = require("mongoose");
const User = mongoose.model("users");
passport.use(
new GoogleStrategy(
{
clientID: "MY-ID",
clientSecret: "MY-SECRET",
callbackURL: "/auth/google/callback",
proxy: true,
},
(accessToken, refreshToken, profile, done) => {
User.findOne({ googleId: profile.id }).then((existingUser) => {
if (existingUser) {
done(null, existingUser);
} else {
new User({
googleId: profile.id,
})
.save()
.then((newUser) => {
done(null, newUser);
});
}
});
}
)
);
passport.serializeUser((user, done) => {
done(null, user._id);
});
passport.deserializeUser((id, done) => {
User.findById(id).then((user) => {
done(null, user);
});
});
My frontend consists of a button that hits my auth/google route. However it logs a cors issue error in the console.
(redirected from 'http://localhost:3000/auth/google') from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Doea anyone know how i can solve this? In mu google console I have the redirect url setup as 'http://localhost:3000/auth/google/callback'
First you need to update the cors origin with '*' or your client specific whitelisted url. But that alone is not going to solve the problem.
your button should load the auth url on the browser instead of making an api call to the auth/google route. So you can make the button a href link instead.
You have misconfigured CORS on your backend.
First, you are using wrong syntax when it comes to methods - there should be no spaces when you are listing them (I don't know how they are parsing the string but you should probably stick with the documentation -
according to documentation, you can specify methods either as a string: 'GET,PUT,POST' or a list: ['GET', 'PUT', 'POST'].
Second, you are missing OPTIONS HTTP method in the methods which is used by browsers in preflight request to test server's CORS configuration.
Third, are you sure about the specified headers?
The easiest option is to drop the CORS options configuration completely if you are not sure what you are doing and apply the cors globally before every request.
app.use(cors());
Or to only specific path where you want to allow CORS.
app.get("/somepath", cors(), (req, res) => {...
Maybe you didn't configure cors policy in your backend.
The most simple way is to install cors package if you use Express.
npm install cors
And use it as a middleware of your express app.
var app = express()
var cors = require('cors');
...
app.use(cors());
The problem is even though you have used cors package you have not added the following Access-Control-Allow-Origin option in cors. Try this :
app.use(
cors({
origin: '*',
methods: "GET, POST, PATCH, DELETE, PUT",
allowedHeaders: "Content-Type, Authorization",
})
);
Or as yash has mentioned simply use:
app.use(cors())
For more reference check the official npm cors documentation

MERN OAuth Implementation does not redirect to the google login page

I'm currently running a webserver using the MERN stack, and I'm trying to get OAuth login working properly. However, when I click the "login with google" button, react loads the homepage (but the URL changes). Fetching the URL directly gets a 302 response from the server, but my front-end doesn't change.
Server.js
const express = require('express');
const path = require('path');
const mongoose = require('mongoose');
const bodyParser = require('body-parser');
const logger = require('morgan');
const cors = require('cors');
const secure = require('express-force-https');
const passport = require('passport');
const cookieSession = require('cookie-session');
require('dotenv').config();
const app = express();
const port = process.env.PORT || 5000;
const dbRoute = process.env.MONGODB_URI || 'NO DB ROUTE PROVIDED';
// db setup
mongoose.connect(
dbRoute,
{
useNewUrlParser: true,
useUnifiedTopology: true,
dbName: process.env.DATABASE_NAME,
}
);
let db = mongoose.connection;
db.once('open', () => console.log("Connected to the database"));
db.on('error', console.error.bind(console, "MongoDB connection error: "));
// middleware
app.use(cors());
app.use(bodyParser.urlencoded({ extended: false })); // body parsing
app.use(bodyParser.json());
app.use(logger("dev"));
app.use(express.static(path.join(__dirname, "client", "build"))); // for serving up the clientside code
app.use(secure); // ensure that the connection is using https
app.use(cookieSession({ // cookies!
maxAge: 30 * 24 * 60 * 60 * 1000, // 30 days
keys:['vcxzkjvasddkvaosd'] // yeah i'm sure that's secure enough
}));
// models
require('./models/rule');
require('./models/affix');
require('./models/user');
// passport security
require('./config/passport');
app.use(passport.initialize());
app.use(passport.session());
// routes
app.use(require('./routes'));
// The "catchall" handler: for any request that doesn't
// match one above, send back React's index.html file.
app.get('*', (req, res) => {
res.sendFile(path.join(__dirname+'/client/build/index.html'));
});
app.listen(port);
console.log(`Server listening on ${port}`);
Route (There are a few index files in different folders, so the full path for this route it /api/user/google)
const mongoose = require('mongoose');
const passport = require('passport');
const router = require('express').Router();
const auth = require('../auth');
const User = mongoose.model('User');
router.get('/google',
passport.authenticate('google', {
scope: ['profile', 'email']
})
);
router.get('/google/callback',
passport.authenticate('google', { failureRedirect: '/affixes'}),
(req, res) => {
res.redirect('/?token=' + req.user.token);
}
);
Passport.js
const mongoose = require('mongoose');
const passport = require('passport');
const GoogleStrategy = require('passport-google-oauth20').Strategy;
require('dotenv').config();
const User = mongoose.model('User');
passport.serializeUser(function(user, done) {
done(null, user.id);
});
passport.deserializeUser(function(id, done) {
User.findById(id).then((user) => {
done(null, user);
})
});
passport.use(new GoogleStrategy({
clientID: process.env.OAUTH_CLIENT_ID,
clientSecret: process.env.OAUTH_CLIENT_SECRET,
callbackURL: '/api/user/google/callback',
proxy: true
},
(accessToken, refreshToken, profile, done) => {
User.findOne({ googleId: profile.id })
.then((existingUser) => {
if (existingUser) {
done(null, existingUser);
} else {
new User({ googleId: profile.id }).save()
.then((user) => done(null, user));
}
});
}
));
Frontend login page (has a fetch button and a link button. As described above, different behavior)
import React from 'react';
import {
ComingSoon
} from '../Common';
import {
Button
} from '#material-ui/core';
const handleClick = () => {
fetch('/api/user/google')
}
export default function Login() {
return (
<>
<Button onClick={handleClick}>
Login with Google
</Button>
<button>Log in with Google</button>
</>
);
}
Update: Looks like some kind of CORS issue, although I still don't know how to fix it. Browser spits out
Access to fetch at '...' (redirected from 'http://localhost:3000/api/user/google') from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
Adding the requested header gives me
Access to fetch at '...' (redirected from 'http://localhost:3000/api/user/google') from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request.
It turns out I was quite wrong about the nature of this issue! The problem was that my fetch requests to my OAuth endpoint were calling my frontend, not my backend because the request included text/html in its Accept header. Using the react advanced proxy setup to route to the proper URI fixed the issue.
See: https://github.com/facebook/create-react-app/issues/5103 and https://github.com/facebook/create-react-app/issues/8550

PassportJS not saving session in local strategy

I'm loosely following the tutorial here, and I'm not sure why it's not working. Logging in will work fine -- it accepts and rejects me exactly how I'd expect, it will just not save the session, so visiting any links after will say that I am not authenticated.
Vivaldi dev panel says that no cookies or sessions are saved. I have set it up to save my sessions in redis and user authentication in PostgreSQL, and both databases are connected to fine.
Here is the relevant code:
index.js:
const express = require('express');
const passport = require('passport');
const session = require('express-session');
const Redis = require('ioredis');
const RedisStore = require('connect-redis')(session);
const bodyParser = require('body-parser');
const cookieParser = require('cookie-parser');
const auth = require("./app/authenticate");
const config = require('./config');
const app = express();
var redis_client = new Redis({
host: config.redisStore.host,
port: config.redisStore.port,
lazyConnect: true
});
redis_client.connect().catch(function(err) {
throw err;
});
app.use(cookieParser(config.redisStore.secret));
app.use(session({
cookie : {
maxAge: 36000000000,
secure: true
},
secret: config.redisStore.secret,
store: new RedisStore({ client: redis_client }),
resave: false,
saveUninitialized: true
}));
app.use(passport.initialize());
app.use(passport.session());
app.use(bodyParser.urlencoded({extended: true}));
auth.init.initPassport();
app.post('/login', passport.authenticate('local', {
successRedirect: '/testroute',
failureRedirect: '/'
}));
var urlencodedParser = bodyParser.urlencoded({extended: false});
app.get("/testroute", passport.authenticationMiddleware(), urlencodedParser, function(req, res) {
res.send("You are authenticated!");
});
app.listen(8080);
/app/authenticate/init.js:
const passport = require('passport');
const LocalStrategy = require('passport-local').Strategy;
const scrypt = require("scrypt");
const auth = require("./userfunctions");
const authenticationMiddleware = function() {
return function (req, res, next) {
if (req.isAuthenticated()) {
return next();
}
res.send('ERR: You are not authenticated!');
};
}
module.exports = {
initPassport: function() {
passport.serializeUser(function(user, done) {
done(null, user);
});
passport.deserializeUser(function(id, done) {
auth.getUserById(id, done);
});
passport.use(new LocalStrategy({
usernameField: 'email',
passwordField: 'pwd',
},
function(username, password, done) {
auth.login(username, function(err, user) {
if (err) {console.log(err); return done(err);}
if (!user) {return done(null, false);}
if (!scrypt.verifyKdfSync(user.password, password)) {return done(null, false);}
return done(null, user);
});
}
));
passport.authenticationMiddleware = authenticationMiddleware;
}
};
There are a few other files in /app/authenticate, which are index.js (just adds all the other things to modules.exports) and userfunctions.js, which just includes login and signup functions. I can post these if you need.
I have also omitted the config file, which is just database credentials for PostgreSQL and redis. Finally I have excluded test.html which is served when you GET /, and is just a test HTML login and signup form.
You can use express-session npm module to save your session value.
Below are the steps-
npm install express-session
In your startup JS file write below code
var expressSession = require('express-session');
app.use(expressSession({secret: 'yourothersecretcode', saveUninitialized: true, resave: true}));
Now you can use req.session in your code
req.session is just a json object that gets persisted by the express-session middleware, using a store of your choice e.g. Mongo or Redis.

Google-oauth2 passport not working

I am trying to implement sign-in with google and passport but I am running into a bit of a problem. I successfully authenticate with google, but my data isn't being passed to the front end. I Haven't changed anything from the original code except for the URI and necessary client id and secret. Can anyone tell me what I am missing?
var express = require( 'express' )
, app = express()
, server = require( 'http' ).createServer( app )
, passport = require( 'passport' )
, util = require( 'util' )
, bodyParser = require( 'body-parser' )
, cookieParser = require( 'cookie-parser' )
, session = require( 'express-session' )
, RedisStore = require( 'connect-redis' )( session )
, GoogleStrategy = require( 'passport-google-oauth2' ).Strategy;
// API Access link for creating client ID and secret:
// https://code.google.com/apis/console/
var GOOGLE_CLIENT_ID = "307841191614-1shiak514mrjugtbon3dm2if8hbhnvdv.apps.googleusercontent.com"
, GOOGLE_CLIENT_SECRET = "fgViegEgHWuoc1X-p63iPmpF";
// Passport session setup.
// To support persistent login sessions, Passport needs to be able to
// serialize users into and deserialize users out of the session. Typically,
// this will be as simple as storing the user ID when serializing, and finding
// the user by ID when deserializing. However, since this example does not
// have a database of user records, the complete Google profile is
// serialized and deserialized.
passport.serializeUser(function(user, done) {
done(null, user);
console.log("User: "+ user.displayName); // If there is a persistent session, the console logs out the displayName
});
passport.deserializeUser(function(obj, done) {
done(null, obj);
});
// Use the GoogleStrategy within Passport.
// Strategies in Passport require a `verify` function, which accept
// credentials (in this case, an accessToken, refreshToken, and Google
// profile), and invoke a callback with a user object.
passport.use(new GoogleStrategy({
clientID: GOOGLE_CLIENT_ID,
clientSecret: GOOGLE_CLIENT_SECRET,
//NOTE :
//Carefull ! and avoid usage of Private IP, otherwise you will get the device_id device_name issue for Private IP during authentication
//The workaround is to set up thru the google cloud console a fully qualified domain name such as http://mydomain:3000/
//then edit your /etc/hosts local file to point on your private IP.
//Also both sign-in button + callbackURL has to be share the same url, otherwise two cookies will be created and lead to lost your session
//if you use it.
callbackURL: "http://127.0.0.1:3000/oauth2callback",
passReqToCallback : true
},
function(request, accessToken, refreshToken, profile, done) {
// asynchronous verification, for effect...
process.nextTick(function () {
// To keep the example simple, the user's Google profile is returned to
// represent the logged-in user. In a typical application, you would want
// to associate the Google account with a user record in your database,
// and return that user instead.
console.log(profile); //logs google profile successfully
return done(null, profile);
});
}
));
// configure Express
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
app.use( express.static(__dirname + '/public'));
app.use( cookieParser());
app.use( bodyParser.json());
app.use( bodyParser.urlencoded({
extended: true
}));
app.use( session({
secret: 'cookie_secret',
name: 'kaas',
store: new RedisStore({
host: '127.0.0.1',
port: 6379
}),
proxy: true,
resave: true,
saveUninitialized: true
}));
app.use( passport.initialize());
app.use( passport.session());
/*
===
===
===
Here is where the data is not being read.
*/
app.get('/', function(req, res){
res.render('index', { user: req.user });
console.log(req.user); //Output: undefined
});
app.get('/account', ensureAuthenticated, function(req, res){
res.render('account', { user: req.user });
});
app.get('/login', function(req, res){
res.render('login', { user: req.user });
});
// GET /auth/google
// Use passport.authenticate() as route middleware to authenticate the
// request. The first step in Google authentication will involve
// redirecting the user to google.com. After authorization, Google
// will redirect the user back to this application at /auth/google/callback
app.get('/auth/google', passport.authenticate('google', { scope: [
'https://www.googleapis.com/auth/plus.login',
'https://www.googleapis.com/auth/plus.profile.emails.read']
}));
// GET /auth/google/callback
// Use passport.authenticate() as route middleware to authenticate the
// request. If authentication fails, the user will be redirected back to the
// login page. Otherwise, the primary route function function will be called,
// which, in this example, will redirect the user to the home page.
app.get( '/oauth2callback',
passport.authenticate( 'google', {
successRedirect: '/',
failureRedirect: '/login'
}));
app.get('/logout', function(req, res){
req.logout();
res.redirect('/');
});
server.listen( 3000 );
// Simple route middleware to ensure user is authenticated.
// Use this route middleware on any resource that needs to be protected. If
// the request is authenticated (typically via a persistent login session),
// the request will proceed. Otherwise, the user will be redirected to the
// login page.
function ensureAuthenticated(req, res, next) {
if (req.isAuthenticated()) { return next(); }
res.redirect('/login');
}
`
Here is the simple layout that doesn't seem to be receiving any data.
<% if (!user) { %>
<h2>Welcome! Please log in.</h2>
<% } else { %>
<h2>Hello, <%= user.displayName %>.</h2>
<% } %>
Your code works, I just used same example on my app.
I had the same problem and I realized that I'm not using a valid account in my tests.
This API retrieves data from Google+ profile. Are you using a valid Google account with linked Google+ profile to authenticate?

Resources