使用Superagent通过包含图像值的ajax提交表单

时间:2016-01-03 00:15:20

标签: javascript ajax pyramid superagent

我尝试了一些不同的方法,似乎没有任何东西正好提交我的图标文件

request
  .post('/my/newapp')
  .type('multipart/form-data')
  .field('name', input.newAppName)
  .field('description', input.newAppDescription)
  .field('csrf', csrf.newApp)
  .attach('icon', this.refs.icon.value) // Doesn't save for some reason
  .end((err, res) => {...

对于上面的提交,我的请求有效负载如下:

------WebKitFormBoundarywygaaRkqk2Kr6zzJ
Content-Disposition: form-data; name="name"

afasfasfasf
------WebKitFormBoundarywygaaRkqk2Kr6zzJ
Content-Disposition: form-data; name="description"


------WebKitFormBoundarywygaaRkqk2Kr6zzJ
Content-Disposition: form-data; name="csrf"

16we7ncdfoyz5twnc1ilhg5pjgr6ze5s36153ffbf:aYCZkOQV6nxQq6mXWmCLOQ==
------WebKitFormBoundarywygaaRkqk2Kr6zzJ
Content-Disposition: form-data; name="icon"


------WebKitFormBoundarywygaaRkqk2Kr6zzJ--

但我在我的金字塔应用程序中获得了502:ValueError: Invalid boundary in multipart form: ''

我也尝试使用FormData无效。

let formData = new FormData();
formData.append('name', input.newAppName);
formData.append('description', input.newAppDescription);
formData.append('csrf', csrf.newApp);
formData.append('icon', this.refs.icon.value);
request
  .post('/my/newapp')
  .type('form')
  .set('Content-Type', 'application/x-www-form-urlencoded')
  .send(formData)
  .end((err, res) => {...

非常感谢任何见解。如果我做一个正常的非ajax形式的帖子它工作正常。

1 个答案:

答案 0 :(得分:1)

想出来。将图标添加到formData时,我使用了错误的属性。

  handleSubmit(e) {
    e.preventDefault();
    let {input, csrf, setErrorModal} = this.props;
    let formData = new FormData();
    formData.append('name', input.newAppName);
    formData.append('description', input.newAppDescription);
    formData.append('csrf', csrf.newApp);
    formData.append('icon', this.refs.icon.files[0]);
    request
      .post('/my/newapp')
      .send(formData) // works now =-]
      .end((err, res) => {...