score:40

Accepted answer

you can paste authenticity_token into react component.

using gem react-rails

= react_component 'form', authenticity_token: form_authenticity_token

form_authenticity_token is the rails helper.

so you can paste it into your form.

<form role='form' accept-charset="utf-8" action='/action' method='post'>
  ...
  <input type='hidden' name='authenticity_token' value={this.props.authenticity_token} />
  ...
</form>

it's not the best solution. i would be happy if someone will tell a better solution.

score:1

you can render your form inside an invisible block and then clone it into a react component

/* app/assets/stylesheets/users.scss */
.invisible-form-container {
  display: none;
}

# app/views/users/edit.html.haml
.invisible-form-container
  = render 'form'
.react-container

# app/assets/javascripts/components/form.js.jsx.coffee
class @form extends react.component
  html_form: ->
    {__html: $('.invisible-form-container').html()}
  render: ->
    `<div dangerouslysetinnerhtml={this.html_form()} />`

# app/assets/javascripts/initializer.coffee
$ ->
  reactdom.render(
    `<form />`,
    $('.react-container')[0]
  )

hope this helps.

score:8

if you render the base html with rails and embed a react component to it with react-rails, you can write like this:

var yourform = react.createclass({
  render: function() {
    var csrftoken = $('meta[name=csrf-token]').attr('content');
    return (
      <form action='/users' method='post' accept-charset='utf-8'>
        <input type='hidden' name='_method' value='patch' />
        <input type='hidden' name='utf8' value='✓' />
        <input type='hidden' name='authenticity_token' value={csrftoken} />
        ...
      </form>
    );
  }
});

score:13

you can do something like this:

$(document).ready(function(){
  $.ajaxsetup({
    headers: {
      'x-csrf-token': $('meta[name="csrf-token"]').attr('content')
    }
  });
});

and put the csrf-token into a meta tag inside your view/layout if it isn't already there.


Related Query

More Query from same tag