Need Help Setting Up NextAuth with Facebook Provider
I'm encountering difficulties setting up NextAuth with the Facebook provider. Here's my current situation:
- I have a verified business account running in live mode.
- I need to set up login with Facebook functionality.
- Testing in localhost gives me the error "Insecure login blocked. You can't get an access token or log in to this app from an insecure page. Try reloading the page as https://."
- Deploying the app on a staging environment gives me the error "It looks like this app isn't available."
Account setup details:
- Inside App Settings > Basic, my domains include localhost, live.domain.com, and dev.domainname.com.
- Site URL: http://localhost:3000/
Inside Products > Facebook Login for Business > Settings:
- Valid OAuth Redirect URIs include https://fbl.staging.domainname.com/public/api/connect, https://fbl.domainname.com/public/api/connect, https://localhost:3000/api/auth/callback/facebook, https://dev.domainname.com/api/auth/callback/facebook, and https://live.domainname.com/api/auth/callback/facebook.
- Allowed Domains for the JavaScript SDK include https://fbl.staging.domainname.com/ and https://fbl.domainname.com/.
I'm reaching out to the Discord community for assistance. Setting this up has been frustrating, and I'm struggling to debug it on my own.
If anyone has successfully implemented this setup, please share where I might be going wrong.
Thank you for any help or guidance you can provide!
1 Reply
This sounds like this should be a backend post. While frontend does take username and password, you'll want to pass credentials securely to the auth service. Doing so with javascript will have to be carefully implemented so passwords cannot be tracked or revealed, despite an HTTPS implementation.
I.E. industry practice is to have backend handle redirects with POST to frontend using a secure form upload.