將多部分表單發佈到外部URL php

在我的頁面中，我有一個表單可以在提供api，upload.im的外部服務上傳照片，而且我需要獲取圖像上傳的URL。我真的無法得到這個工作...將多部分表單發佈到外部URL php

此api的文檔頁面是here。

我添加了一個形式到我的PHP頁面：

<form enctype="multipart/form-data" name="UploadForm" id="UploadForm" action="http://uploads.im/api" method="POST"> 
    <input type="hidden" name="MAX_FILE_SIZE" value="30000" /> 
    <input type="file" name="upload" id="upload" /> 
    <input type="hidden" name="resize_width" id="resize_width" value="" /> 
    <input type="hidden" name="thumb_width" id="thumb_width" value="250" /> 
    <input type="hidden" name="format" id="format" value="xml" /> 
    <input type="submit" id="Submit" name="Submit" /> 
</form>

我還試圖用這個jQuery代碼與所選擇的圖像提交表單：

$(document).ready(function() { 
    $('#UploadForm').on('submit', function(e) { 
     e.preventDefault(); 
     var data = new FormData(jQuery('UploadForm')[0]); 
     jQuery.ajax({ 
      url: 'http://uploads.im/api', 
      data: data, 
      cache: false, 
      contentType: false, 
      processData: false, 
      type: 'POST', 
      success: function(data){ 
       console.log(data); 
      } 
     }); 
    }); 
});

有了這個代碼，我得到控制檯中的錯誤： screen.png http://i68.tinypic.com/zmnyq8.png 這是來自API的錯誤代碼;這意味着代碼有效，但表單提交的方式是錯誤的。哪裏有問題？

謝謝！

來源

2016-01-20 PWhite

形式是好的，問題是在js代碼，我試圖修復它。 – esJuanMa

不應該'e.preventDefault（）;'最後？ – rybo111

此外，爲什麼你使用jQuery（'UploadForm'）[0]'而不是'$（this）[0]'，和'jQuery.ajax'而不是'$ .ajax'？ – rybo111

在這裏，我只是做了在JS代碼的一些變化：

$(document).ready(function() { 
    $('#UploadForm').on('submit', function(e) { 
     e.preventDefault(); 
     var data = new FormData($(this)); 
     data.append('upload', $('#upload')[0].files[0]); 

     jQuery.ajax({ 
      url: 'http://uploads.im/api', 
      data: data, 
      cache: false, 
      contentType: false, 
      processData: false, 
      type: 'POST', 
      success: function(data){ 
       console.log(data); 
       console.log(data.data.thumb_url); 
       console.log(data.data.img_url); 
      } 
     }); 
    }); 
});

來源

2016-01-20 15:59:06 esJuanMa

表單的名稱是UploadForm。是否正確編寫var data = new FormData（$（'＃upload'））;'。我認爲它應該是'UploadForm'而不是'upload' ... – PWhite

它可以在Chrome中正常工作，但不能在Firefox中使用。 – esJuanMa

您是對的。它是UploadForm。 – esJuanMa

的問題可能與此線做：

var data = new FormData(jQuery('UploadForm')[0]);

應該#UploadForm。

來源

2016-01-20 15:48:48 rybo111

你的代碼似乎工作。我在JS控制檯中獲得了一個'XMLDocument'。我怎麼讀這個？ – PWhite

@PWhite嘗試雙擊XMLDocument。 – rybo111

請嘗試如下。

var data = new FormData($('#UploadForm'));

通過該節點到FORMDATA構造：的FORMDATA（）構造函數創建一個新FORMDATA對象

參數：一個HTML <form>元素 - 指定的情況下，FORMDATA對象將與形式的當前鍵填充/值。它也將編碼文件輸入內容。

參見：https://developer.mozilla.org/en-US/docs/Web/API/FormData/FormData

來源

2016-01-20 15:53:49

在JS控制檯中出現以下代碼錯誤：TypeError：FormData.constructor的參數1未實現接口HTMLFormElement。 – PWhite

將多部分表單發佈到外部URL php

回答

相關問題