Hi, I am complete new to handling cookies and storing tokens in order to send request from phoenix template html page to api endpoint, authenticated by auth plug (via ajax), so I need a way to store the auth token to send them along with every request, but if I normally store it in cookie as key value pair, it can be read by every one, I am not much versed with cookie , I came to know about various flags to make the cookies secure, but I tried this one
put_resp_cookie("auth_token", "some value", [same_site: "strict", secure: true, http_only: true])
but i see nothing is being stored, I think I am getting it wrong , please suggest me how I can send ajax request using auth token in header from my phoenix html pages( had it been any front end framework, i could have many options, but currently i need to implement it using normal html phoenix page and js/ajax) .
If you use the http_only flag the browser will not let any Javascript access the cookie, therefore you JS code will not be able to read the auth_token to use in an Ajax call.
Read more about securing cookies here:
Now, if you need to use this auth_token to call a thrid-party API, then the only secure approach is to delegate that task to your Phoenix backend that will then return the response to the browser via a socket event.
but how will i have socket between a normal js file that dont have access to anything other than DOM, Can you please elaborate, and FYI I am sending the ajax request to my same site, just I am calling the API endpoint (callable from Mobile app/ frontend framework) from Normal html templates in phoenix via javascript instead.
You can use Phoenix Channels:
https://hexdocs.pm/phoenix/channels.html
Just send a request to the backend via a Phoenix Channel to get a new auth_token with some seconds worth of time to expire, and then do the Ajax request to the API endpoint.
Any data you need to get from the same API endpoints you may want to do it internally from your backend.
So, just request the data via a Phoenix Channel and then update your DOM when you get a response, as per examples in the above link to Phoenix Channels docs. Maybe instead you prefer to just use Phoenix LiveView if you decide to go down this route.
If you want to go old school by using a normal AJAX request, then your security will be weaker, because you cannot secure secrets in the client side. As you already know in the browser all it takes is to use F12 to get the auth_token or it can be stolen from another JS script, but even in your mobile app the auth_token to query the API can be extracted, despite the code being in binary format(the APK) on the client side.
Just to clarify. Sockets (Phoenix Channels) and a request (fetch/ajax) are two different things. Most likely what you need is a simple request.
Make sure you check out the official Phoenix tutorial on sessions: https://phoenixframework.readme.io/v0.13.0/docs/sessions
There they use put_session and get_session to save/read session variables.
Does that answer your question?
hi, is it the case that , plug.session key-value pairs are not visible to anyone right? so I wont be able to access the value using javascript, even if i store it, because I cannot access sesssion value from js, so any way around?
yes. session variables are server-only information.
