如何将csrf令牌传递给antd的上传组件?

时间:2018-02-07 00:58:48

标签: node.js reactjs csrf antd

在传递csrf标记的形式中,我使用隐藏输入将值传递给long。

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p>
<button class="btn btn-default" id="content-background-disabled-btn">
content-background-disabled-btn
</button>
</p>

<p>
<button class="btn btn-default" id="content-background-enabled-btn">
content-background-enabled-btn
</button>
</p>

当你有这样的组件时,你怎么做?这是来自antd的上传组件。

<Form method="post" action="/account/user" onSubmit={this.onSubmit}>
  <Input name="_csrf" type="hidden" value={this.state.session.csrfToken} onChange={()=>{}}/>
  <FormGroup row>
    <Label sm={2}>Name:</Label>
    <Col sm={10} md={8}>
      <Input name="name" value={this.state.name} onChange={this.handleChange}/>
    </Col>
  </FormGroup>
</Form>

1 个答案:

答案 0 :(得分:1)

结束了我可以包含的称为标题的道具。希望在此过程中帮助其他人。

render() {
            const props = {
                name: 'file',
                action: '//localhost/file/upload',
                headers: {
                   'X-CSRF-Token': 'somelongtokenstring'
                }
                onChange(info) {

                }
            };

            return (
                   <Dragger {...props}>
                       // drag and drop area
                   </Dragger>
    )
    }