我的提交功能以Bad Gateway 502响应

Question

我正在尝试从我的React应用程序中为图像上传设置“Cloudinary”。

我的提交函数继续响应：“Bad Gateway 502”和“SyntaxError：意外的输入结束”。

我假设我的标题有问题，但我找不到问题...

 handleFileSelect = (e) => { this.formValid() this.setState({ picture: e.target.files[0] }) } submit(){ const CLOUDINARY_URL= "https://api.cloudinary.com/v1_1/dvz27u2gu/image/upload" const CLOUDINARY_UPLOAD_PRESET= "jshvp3nh" const obj = Object.assign({}, this.state); const formData = new FormData(); formData.append("file", obj.picture); formData.append("upload_preset", CLOUDINARY_UPLOAD_PRESET); fetch(CLOUDINARY_URL,{ mode: 'no-cors', method:'post', headers: { "Content-Type": "application/x-www-form-urlencoded"}, body:formData, }) .then((res)=>{return res.json()}) .then(data=>console.log(data)) .catch(err=>console.log(err)); } 

Answer 1

您可以尝试以下内容：

<div><input type="file" onChange={this.submit}/></div>


submit = (e) => {

    var file = e.target.files[0];
    var data = new FormData();
    data.append('upload_preset', 'jshvp3nh');
    data.append('file', file);
    data.append('cloud_name', 'dvz27u2gu');

    const config = {
        method: "POST",
        body: data 
      };

     var imgurl = "https://api.cloudinary.com/v1_1/dvz27u2gu/raw/upload";
     fetch(imgurl, config)
        .then(responseData => {
           console.log('here');
           console.log(JSON.stringify(responseData, null, 4));
           console.log(responseData);
         })}

Answer 2

这就是它对我有用的方式。

  const CLOUDINARY_URL= "https://api.cloudinary.com/v1_1/dvz27u2gu/image/upload" const CLOUDINARY_UPLOAD_PRESET= "jshvp3nh" const obj = Object.assign({}, this.state); const formData = new FormData(); formData.append("file", obj.picture); formData.append("api_key", "xx") formData.append("api_secret", "xx") formData.append("upload_preset", CLOUDINARY_UPLOAD_PRESET); formData.append("timestamp", (Date.now() / 1000) | 0); fetch(CLOUDINARY_URL,{ method:'POST', body: formData, }) .then((res)=>{return res.json()}) .then((data)=>{ obj.img_url_cloudinary=data.secure_url; this.sendForm(obj); }).catch(err=>console.log(err));;