Using AWS-Amplify with Firefox

Question

I hope you are all doing good,

I have a question that I've been stuck on for the past couple of days. I am building a website with React that uses AWS-Amplify for user authentications (For users on the Cognito AWS database).

I am working on the Log-in and Sign-up page, and it's working fine when using Chrome, but whenever I am using Firefox there is an issue (Specifically the Log-in).

Problem: There is a part in the JS code that uses the Auth.signin() function from the aws-amplify extension. This function takes in the username and password and returns if the user is authenticated or not. However, when using Firefox, this function gets timed-out, as if the browser can't get the response from the server. Here is a screenshot of the console:

Seems like the response is 403 but I am guessing it's because of the time-out. (The try/catch doesn't catch anything because it looks as if the page freezes)

I hope I made it clear, and thank you for your time reading everything!

Answer 1

Do your request headers/body contain the correct username and password for the user in Firefox, and is it sending the request to the same endpoint as in Chrome? The 403 code makes me think that the endpoint is malformed on the Firefox request. Finally, is it sending with SRP_AUTH or USER_PASSWORD_AUTH ?

Also, since you're using React with Cognito+Amplify for auth*, you might want to consider using the withAuthenticator higher-order-component provided by aws-amplify-react and styling it to your needs. Then you won't need to maintain your own login logic, won't need to worry about fixing it yourself if a browser change breaks your code, etc.