"WARNING: Can't verify CSRF token authenticity" iOS browser with rails app.

Updated July 26 2017:

Please read: CSRF DEMYSTIFIED

Rails have some ways to prevent CSRF attacks for HTML requests so if you see this warning: "WARNING: Can't verify CSRF token authenticity" is telling you one of your forms you are submitting some how is not preserving the CSRF token.

I was doing HTML Media Capture

HTML Media Capture was the DAP's first go at standardizing media capture on the web. It works by overloading the <input type="file"> and adding new values for the accept parameter.

If you wanted to let users take a snapshot of themselves with the webcam, that's possible with capture=camera:

<input type="file" accept="image/*;capture=camera">  

And when I submitted this form I was receiving this issue "WARNING: Can't verify CSRF token authenticity"

I found 2 ways of solving this:

Solution #1

Create and hidden input to preserve the auth_token once my native camera was open, but sadly this breaks my previous functionality because it's create loading the page after submit

html.erb

<input name="authenticity_token" type="hidden" value="<%= form_authenticity_token.to_s %>"></input>

Solution #2

So I noticed an extra param in the request I was doing with the data in the fileInput, so the issue here it was because I was not clearing this extra file input.

<input type="file" id="fileControl">

then just do:

$("#fileControl").val('');

to reset the file control. And the good part of this second solution this kept my previous functionality and this does not reload my page breaking ajax request.

After this WARNING: Can't verify CSRF token authenticity would be gone, and you can't continue with your normal life.

That's all folks!

Victor Velazquez

Coder, Musician, Startups, Passionate Dancer & Life Lover. Software Engineer at MagmaLabs, Co-founder of Web Dev Talks, Co-founder of Voltaire, Co-founder of Paqkit, Ex-co-founder of Zaznova.

Subscribe to The zazvick's blog

Get the latest posts delivered right to your inbox.

or subscribe via RSS with Feedly!