Facebook and Google Login Using Passport With Netlify Functions

Hi Netlify Community,

I am working on switching a few applications over to Netlify and switching from the MERN stack to the JAMStack. I am rewriting my old server code to use Netlify functions with Express.

When trying to authenticate someone using both Facebook and Google with Passport.js at my site here: https://mystifying-montalcini-ff4150.netlify.com/ they make it through the whole flow and the user information gets saved in MongoDB like usual.

However, they are redirected back to the index page instead of being taken to my waitlist page meaning they are not logged in. To access the waitlist page you need to be authenticated and I have a simple if statement in my code to check. I have gotten it to work once after clearing all my cookies and then logging in with Google. Unfortunately, it wouldn’t work for any other accounts after this and I kept getting the same behavior.

This is the only thing stopping me from switching all my applications over to Netlify. I would love any help I can get to make this work!

Here is my repository on GitHub:
https://github.com/William-Boomer-Baker/oauth-viral-loop

Awesome that you are checking out the jamstack for your projects!

I took a look at what you are trying to accomplish, but unfortunately I can only be helpful to a point - It doesn’t seem like there are clear issues with our service, here, and so it goes a bit beyond what we can help with.

Here’s what we can do - firstly, one I idea i have for you is that you check that your redirects are happening after you have a user object, i.e. you redirect here:
https://github.com/William-Boomer-Baker/oauth-viral-loop/blob/master/server/api.js#L73
but does console.log(YOUR_USER_OBJECT) return your object by that point?

Secondly, while my hands are a bit tied in terms of digging further into your custom code, we do have a ton of knowledgeable people here in the forums that might be able to help, so we will absolutely leave this request open for you.

Let us know if checking out your redirects more closely changes things at all.

1 Like

Hi Jen!

Thank you for the reply! I love Netlify and its performance. I really want to get this to work so I’ll be able to switch my company over to using it D:

I tried what you recommended above, but I only see [object Object] when trying to console log the whole req object. I think this may be because I am using Netlify dev?

When I set up a custom server using express on Heroku I don’t have any issues with the code I use to authenticate people using Google and Facebook. I am able to easily console.log certain aspects of my code to debug things, but I need to change the structure a bit to get express to work with Netlify functions. This is also why I use Netlify dev to make sure everything works before deploying live. The only small thing that gets changed is putting “serverless(app)” at the bottom of my function which is how I saw Netlify’s documentation do it.

Hi @Boomer , I haven’t actually followed this tutorial myself, but have you looked at Implementing an Authentication Flow with Passport and Netlify Functions - Markus Oberlehner to see if you can get some insights into why yours is failing?
Also, objects aren’t strings, [object Object] is the default string representation of an object. If you want the evaluated string value of an object so you can print it, then you should log JSON.stringify(obj) with obj being the object you want to print.

Hi @futuregerald and @jen, I still haven’t been able to figure this out, unfortunately.

@futuregerald Thank you for sending that link. Yes, I have checked out that tutorial and tried replicating aspects of it with no luck :confused:

@jen After console logging multiple aspects of my code it appears that after my application gets the “/auth/facebook/callback” route on my API I have my req.user object like I should. However, after redirecting to the waitlist page the req.user object seems to disappear for some reason.

Could you help me figure out what I am doing wrong?

Hey @Boomer,
Looks like you made the repo private. If you’d like us to take another look, you’ll have to make it public :slight_smile: