CSRF Setup

๐Ÿ‘จโ€๐Ÿ’ผ Great! You should now be able to get that cookie value set in the browser's "cookie jar." You can verify this by opening the browser's developer tools and looking at the cookies for the page under the "Application" tab. The cookie will be called "csrf" and have a value that looks like a bunch of nonsense like:
IjdDa3p6WkV1d3NNel&nev3r&60nna&gIv3&yoU&uP&UW0zYmxDMDNyRjQi.NM71601wmCvZ%2FZaGIG6wV%2FuX%2FvGafzDEAmamK1hNu88
And while you can't visually verify it, that (unsigned) token value is in the browser as well. You can check by executing this in the console (note that this will only work when viewing the app in a separate tab, else it will look for the token at the wrong port):
__remixContext.state.loaderData.root.csrfToken
Which should get you something like this:
7Ck&Nev3r&60nna&1et&yoU&d0wn&UOfQm3blC03rF4
So the next step is to get that into our form and verify it to prove that the form was submitted using our app and not some other site. Let's go!
Login to get access to the exclusive discord channel.
  • general
    Welcome to EpicWeb.dev! Say Hello ๐Ÿ‘‹
    Kent C. Dodds โ—† ๐Ÿš€๐Ÿ†๐ŸŒŒ:
    This is the first post of many hopefully!
    • 18
    81 ยท a month ago
  • general
    npm install everytime I setup a new playground
    Duki ๐ŸŒŒ:
    Is it normal that I have to run `npm install` in my playground directory, everytime I setup the play...
    • โœ…1
    2 ยท a month ago
  • ๐Ÿ“forms
    Review - Professional Web Forms
    Baghira ๐ŸŒŒ:
    So I finished the second workshop last week. I wnated to digest and let some timepast before I wante...
    • โœ…1
    1 ยท 3 months ago
  • ๐Ÿ’พdata
    ๐Ÿ“forms
    ๐Ÿ”ญfoundations
    Reviewing foundations, Mutations, Actions
    silvanet ๐Ÿš€ ๐ŸŒŒ:
    Forgive me for this. I went over the file size limit. I don't want to sign up for being able to exce...
    • โœ…1
    2 ยท 7 months ago
  • general
    Migration to Vite: Server-only module referenced by client
    Fabian ๐ŸŒŒ:
    Hi, I'm working on migrating to Vite following the remix docs (https://remix.run/docs/en/main/guides...
    • โœ…1
    1 ยท 4 months ago
  • ๐Ÿ’พdata
    ๐Ÿ“forms
    Getting a TS error that is not present in the course files
    OtterlyPunk:
    So I'm working in parallel and I'm feeling the problem is I'm using a new version of something in my...
    • โœ…2
    12 ยท 9 months ago
  • general
    Remix Vite Plugin
    Binalfew ๐Ÿš€ ๐ŸŒŒ:
    <@105755735731781632> Now that remix officially supports vite (though not stable) what does it mean...
    • โœ…1
    3 ยท a year ago
  • general
    ๐Ÿ”ญfoundations
    Solutions video on localhost:5639 ?
    quang ๐Ÿš€ ๐ŸŒŒ:
    Hi, so I'm having a hard time navigating (hopefully will be better with time) The nav on epicweb.de...
    • โœ…1
    9 ยท a year ago
  • ๐Ÿ“forms
    Loading into disk
    DiogoVaz ๐ŸŒŒ:
    I am going through the File Upload section and I completely understand the benefits of loading the a...
    • โœ…1
    2 ยท 5 months ago
  • general
    Epicshop is now social and mobile friendly!
    Kent C. Dodds โ—† ๐Ÿš€๐Ÿ†๐ŸŒŒ:
    I'm excited to announce that now the Epic Web workshops are mobile friendly! https://foundations.ep...
    • ๐ŸŽ‰2
    0 ยท 6 months ago
  • ๐Ÿ’พdata
    ๐Ÿ“forms
    ๐Ÿ”ญfoundations
    How can I do this?
    silvanet ๐Ÿš€ ๐ŸŒŒ:
    Viewing the Intro (from the Workshop) for Mutations, the course has an embedded video where Kent exp...
    • โœ…1
    3 ยท 7 months ago
  • ๐Ÿ’พdata
    general
    ๐Ÿ“forms
    ๐Ÿ”ญfoundations
    double underscore?
    trendaaang ๐ŸŒŒ:
    What with the `__note-editor.tsx`? I don't see that in the Remix docs and I don't remember Kent talk...
    • โœ…1
    2 ยท 7 months ago
  • ๐Ÿ“forms
    Unable to start the playground
    Payapula ๐Ÿš€ ๐ŸŒŒ:
    Today morning I have updated the workshop for web-form - https://github.com/epicweb-dev/web-forms/co...
    • โœ…1
    16 ยท 8 months ago
  • ๐Ÿ”ญfoundations
    ๐Ÿ’พdata
    general
    ๐Ÿ“forms
    ๐Ÿ”auth
    Native Logging
    trendaaang ๐ŸŒŒ:
    I was thinking that it could be useful to log every CRUD operation to help track down errors. Is tha...
    • โœ…1
    6 ยท 8 months ago
  • ๐Ÿ“forms
    File upload `unstable_parseMultipartFormData` vs `File`
    QzCurious ๐ŸŒŒ:
    I'd like to ask why we want to use `unstable_parseMultipartFormData` at first place? It seems to me ...
    • โœ…1
    8 ยท 8 months ago
  • ๐Ÿ“forms
    Purpose of conform.fieldset() in the excercise
    blue_cat_blues ๐ŸŒŒ ๐Ÿš€:
    In the solution for Web forms 05/01 (complex structures/ nested objects) there is a call to `conform...
    • โœ…1
    4 ยท 8 months ago