Viewing cookies and authentication troubleshooting

Hello,

I’m fairly new at all this. :slight_smile:

My backend is an Express application with Passport for authentication. My frontend is Vue, and I check for authentication status in the Vue Router using router.beforeEach to grant access to pages that require you to be logged in. To make calls from frontend to backend, I’m using axios and have set ‘withCredentials: true’

Authentication and authorization worked well on localhost. I deployed to AWS (backend as lambda, frontend in S3), and authentication and authorization still worked will on my laptop. I have problems on mobile, though.

Safari on iOS is fine. But in Chrome, when I submit the login form, it appears to authenticate properly and attempts to route me to the next view, but then it sends me back to the login page, so I assume that the authentication check in the router is failing.

I don’t know how to troubleshoot Chrome on iOS directly. So to try to see what’s happening, I’ve modified the login page to display the full response from the backend after submitting the form. I’d also like to display the sessionID cookie from Passport, but I can’t figure out how to access the browser’s cookies.

I’ve tried

document.cookie

and also installed vue-cookie and tried

this.$cookie.get('sessionId')

but I’m not able to get anything. Like I said, I’m fairly new to all this. Can someone help me access the cookies so I can display them on the login page?

Thanks,
Dave

Hey Dave,

stupid question: did you set the cookie?

Besides, you can take a look at the localStorage of the browser.

Thanks for your reply. Not a stupid question at all. I’m still gaining knowledge here.

Working locally, if I delete all cookies and then submit the login form, I get a response from the backend containing these headers:

set-cookie: sessionId=eyJwYXNzcG9ydCI6eyJ1c2VyIjoiMDJmYzcxNTYtNzhlZi00MDBmLTg4OTgtOGIzMTMwYTcxZGQzIn19; path=/; httponly

set-cookie: sessionId.sig=MTZAY92Cy_yzRsKZ0qpmGfjjwfs; path=/; httponly

And when I check the cookies for localhost, I see those cookies.

So I’m not explicitly setting any cookies, and just assume the browser is handling that.

I’d like to confirm that those cookies are being created in Chrome on iOS, so what I’d like to do is get the value of those cookies and display them on the login page after submitting the form. But for some reason I’m not able to access them. Should I be able to get them using document.cookie?

Thanks,
Dave

I see now that the cookies are being set by Passport with “httponly”. That’s why I can’t access them via Javascript. I want to figure out how to set httponly = falst for Passport, but I’m not finding a way to do that.