Passport auth in express backend using React Native/Expo - reactjs

I've been working on a companion app in React Native/Expo for a MERN web app that I created. In the back end, I have an Express server with Passport to authenticate users to Spotify as part of the sign in process, bound to the route /auth/spotify. On my web app, if I click the login button I'm redirected to the Spotify auth page. However, I can't seem to get it to work on React Native. Currently I'm using axios to send a GET request to /auth/spotify but it's seemingly not doing anything. I've checked the logs and the auth route is returning a 302 status, but the /callback url is never accessed. In the callback I have a console.log plus some code that accesses the database, but I've confirmed that neither of them are run when trying to auth from React Native.
I looked for tutorials but a lot of the stuff I found was outdated or used deprecated packages, so I'm kind of lost right now. Would greatly appreciate it if someone could point me in the right direction. Thanks!

Related

Setting up React app using Firebase and Spotify Web API

I’m in the process of creating a React application that will use Spotify’s web api to compile different types of analytics from each users’ Spotify account.
I set up my react app to use Firebase’s authentication so users can create an account and once logged in, link their spotify to that account.
The goal is to store important info in the user database like the web api’s refresh token so they don’t have to re-link their account in the future when they log in. However, I have very little experience with any of these frameworks and don’t know the best way to handle authenticating each users’ spotify account within my React app.
Should I also create an express server to handle the callbacks for my spotify authentication, database queries, and sending data to the front end, or can all of this be handled in React? And if it can be handled in react, where should I set the callback uri to go? The app has a home page for new users to see its features, and a dashboard page that they go to once logged in.
Sorry if this isn’t very well described, but Im basically just looking for the best practice stack to use for a React-Firebase App that uses the spotify web api, and whether or not I need to separate the spotify authentication into some backend to handle those requests.
I tried setting the callback to go to the Dashboard, but that means every time the user goes to the dashboard it has to check for the callback url parameters that it sends, which doesn’t seem like the best way to handle it.
I also tried creating a /callback page to handle the spotify authentication, which worked but meant there was a random callback page on my site, which also doesn’t seem ideal, so Im not sure what the best way to handle it is.

React Facebook Login not working on production

I have been trying to use react facebook login libraries for social authentication. In a local setup using a ngrok domain its working well but on my remote server where I add my app domain login status becomes cancelled. May someone help me understand where I may be getting it wrong. I have used react-facebook-login, react-social-login, #greatsumini/react-facebook-login - and I seem to be getting the same problem

Django Rest Framework user auth with React

Can anybody tell me the updated way to use User Authentication for Django Rest Framework?
Each tutorial seems outdated.
I would like to sign up, login logout using React with fetch function.
Please share your experience.

Authentication issue DRF, Firebase, React

I am developing a web app which is using Django-rest for the backend, react-admin for the frontend, and firebase for authentication. Currently, I am developing the user part and have faced an issue. I have not used firebase before and the docs provided in firebase are not very clear to me.
The problem that I am having is that when I try to log in from the frontend it gives me access and lets me inside the website for a second and then it kicks me giving a 401 unauthorized status error and on the screen, a message pops up saying that my session has expired. When I check the console, everything is synced up and reads all of my credentials, generates a uid but somehow it denies it.
Here is the code.
This is the view from django
This is my react-admin setup
Could someone experienced help with my issue or guide me somehow, please?

Error when POSTing to react app after SAML auth

Completely stumped on an issue I'm dealing with, and I feel like I've looked everywhere, just can't wrap my head around it.
I've got an app that's built as follows:
React frontend, built using Create React App
A separate API, running on a separate server, which the frontend interacts with via RESTful calls
Auth0 handling auth, using a SAML connection. Authentication is successful against the SAML connection.
App is hosted on Heroku, and uses the #mars/create-react-app buildback.
The issue I'm experiencing is that after the SAML authentication, there is a redirect back to my app as a POST. My app doesn't know what to do with said POST, and I'm unsure why.
The ideal scenario I'm looking for is:
User visits domain.com/login
User is redirected to SAML IdP, which asks for login
User logs in with IdP, and is sent back to my app, preferably just to the path /explorer. This should all be straight GET.
I'm happy to post any code related, but unsure what would be the most helpful. Despite me having set the SAML protocol binding to "redirect" on Auth0, it continues to post back to my app. I might simply be misunderstanding that piece, however.
Again, happy to post whatever code would help, just unsure what's most useful to see. Like I said, it seems that auth is working, just that after the authentication, there's a POST back to my root, and my app has zero clue what to do with it. There is no nginx config to speak of.
Thanks for any tips or hints about where to look.
Quick followup. Solved this (I think) by spinning up a simple Express server to serve the React app with, and routed POST / to index.html, which seems to have worked for now.

Resources