calypso

calypso

Generate csrf token, send it to frontend, put token in header in following request not working

Hello everybody
I have a react frontend and and phoenix backend. The frontend is not served from phoenix.
Now I would like to generate a csrf token in the phoenix backend, send it to the frontend and put it in the request header to access protected resources. Here are the important code snippets:

router.ex

pipeline :frontend do
plug :accepts, [“json”]
plug :fetch_session
plug :protect_from_forgery
plug :put_secure_browser_headers
end

pipeline :frontend_no_csrf do
plug :accepts, [“json”]
end

scope “/users/”, UserBackendWeb do
pipe_through [:frontend_no_csrf]
scope “/v1/” do
post “/csrf”, UserController, :csrf
end
end
scope “/users/”, UserBackendWeb do
pipe_through [:frontend]
scope “/v1/” do
post “/test”, UserController, :test
end
end

user_controller.ex

def csrf(conn, _opts) do
csrf_token = get_csrf_token()
conn
|> put_resp_cookie(“_csrf_token”, csrf_token, sign: false, same_site: “secure”)
|> json(%{_csrf_token: csrf_token})
end

To access now http://localhost:4000/users/v1/test I use postman and the header is correctly set:

x-csrf-token: fHcxKyYgdz9paj0ZIkkKAD4WL3EQGXU808TIEGEf-ZTwo-8KkWY7ZaLE
Content-Type: application/json
User-Agent: PostmanRuntime 7.28.0
Accept: /
Postman-Token: 4ae26e18-87d9-4d61-9bf5-d8e16f726486
Host: localhost:4000
Accept-Encoding: gzip, deflate, br
Connection: keep-alive
Content-Length: 73
Cookie: _csrf_token=fHcxKyYgdz9paj0ZIkkKAD4WL3EQGXU808TIEGEf-ZTwo-8KkWY7ZaLE

Put I get a 403 back, because the token seems not to be seen?
Converted error Plug.CSRFProtection.InvalidCSRFTokenError to 403 response

Where do I make a mistake?
Best

Most Liked

derek-zhou

derek-zhou

The point of csrf is to verify two things match, usually a hidden field in the form matches with the session. The csfr token by itself does not prove anything. You’d need to maintain a phoenix session cookie as well.

calypso

calypso

So the actual solution would be to to be store the csrf_token in the session.

def csrf(conn, _opts) do
csrf_token = get_csrf_token()
conn
|> put_session(“_csrf_token”, Process.get(:plug_unmasked_csrf_token))
|> json(%{_csrf_token: csrf_token})

Consequently the token in the x-csrf-token header will be valid.

wanton7

wanton7

Are you sure you even need CSRF token? If you are creating a JSON only API and verify POST content type is application/json I don’t think there is a way to do an CSRF attack if your CORS headers are properly set.

Where Next?

Popular in Questions Top

sen
Hi All, I set a environment variables in dev.exs , like below code. when i start server, how can i set the ${enable} value? thanks. d...
New
nobody
How to bind a phoenix app to a specific ip address? could not find anything about that, nowhere, unfortunately, but for me this is quite...
New
beno
I will often find my self writing things similar to: case some_value do nil -> something() "" -> something() _ -> somethi...
New
Darmani72
If I have a post route which an argument: post /my_post_route/:my_param1, MyController.my_post_handler How would get the post params ...
New
baxterw3b
Hi guys, i’m new in the Elixir world, and i have to say, that i love it! i’m having some problem to understand anonymous functions with ...
New
stefanluptak
Hello everybody, usually, I use a 29" ultra-wide monitor for VSCode which can easily accomodate explorer (files panel) + file with code ...
New
sergio_101
I am VERY much an elixir newbie. I have taken one elixir course and one phoenix course on Udemy. During that course, I saw the instructor...
New
komlanvi
Hi everyone, I was playing with phoenix liveView but I run into an issue. I have a form and want to validate each input text when the te...
New
yawaramin
In the Dialyzer docs ( dialyzer — OTP 29.0.2 (dialyzer 6.0.1) ), there is a way to turn off a specific warning for a function: -dialyzer...
New
jaysoifer
Is there a way to rollback a specific migration and only that one (“skipping” all the other ones)? Would mix ecto.rollback -v 200809061...
New

Other popular topics Top

sen
Hi All, I set a environment variables in dev.exs , like below code. when i start server, how can i set the ${enable} value? thanks. d...
New
danschultzer
None of the current solutions worked well for me, so I went ahead and built a user management system from scratch. This project took far...
548 29603 241
New
baxterw3b
Hi guys, i’m new in the Elixir world, and i have to say, that i love it! i’m having some problem to understand anonymous functions with ...
New
greenz1
I have a phoenix application from which a user can download multiple(5-6) files of size 1MB. I couldn’t find anything related to sending ...
New
jononomo
I am trying to figure out how Mix knows whether the environment is test, dev, or prod – where is this set? Thanks.
New
belgoros
I’m not a pro in using Regex and can’t figure out why the following behaviour happens, especially if we take into account the difference ...
New
Qqwy
Original source of discussion: This topic on the Pragmatic Programmers’ Functional Web Development with Elixir, OTP, and Phoenix forum. ...
New
alice
Hey, Just curious what are the main benefits of Elixir compared to Clojure? When is Elixir more useful than Clojure and vice versa? Th...
New
boundedvariable
I am going through the kafka architecture. All the features what the kafka is providing are already in Erlang. I would like hear your opi...
New
joaquinalcerro
Hi there, I am working with Ecto-Postgresql and I need to call all of the records from a specific table but the table has 40,000 records...
New

Latest on Elixir Forum

Elixir Forum

We're in Beta

About us Mission Statement