這是我第一次使用ajax上傳檔案，並且不通過form表單進行上傳，之前使用ajax上傳檔案時是藉助一個叫form.js的檔案，可以直接使用$.ajaxSumbmit直接提交表單，但這次不同，就是使用ajax上傳，並且將圖片資訊放在ajax要上傳的資料data陣列或物件中，怎麼辦，只好百度一下，百度顯示，需要建立一個formData物件，具體程式碼如下：

html部分程式碼：

<span>上傳圖片</span>
<input type="file" accept="" name="image" id="imgPicker" value="">

js部分程式碼：

var formData = new FormData();
var img = $('#imgPicker')[0].files[0];
formData.append('img',img);
formData.append('title',title);   //其它資料

$.ajax({
    url:URL,
    type:'POST',
    async:true,
    dataType:'json',
    processData:false,
    contentType:false,
    data:formData,
})

PHP部分程式碼：

$imgInfo = $_FILES;
$title = $_POST['title'];
 

如此就可以將圖片完全通過ajax傳到後端了，但是隻是成功了一半，還需要將獲取的圖片和其它一些資料進行處理，處理之後封裝資料，呼叫API，並通過CURL模擬HTTP請求，將封裝的資料傳送到API，封裝資料必須依照API定義的格式，否則返回錯誤資訊，然而最難的一步就是API檔案接收的圖片方式也是$_FILES，所以傳輸的img欄位的資料型別還是一個檔案物件，這時使用的是一個PHP函式curl_file_create的函式建立一個檔案物件，PHP端也是需要$_FILES來接收，符合要求，程式碼如下：

$data['files'] = curl_file_create($path);

$rConn = curl_init($url);
curl_setopt($rConn, CURLOPT_POST, 1); 
curl_setopt($rConn, CURLOPT_RETURNTRANSFER, 1); 
curl_setopt($rConn, CURLOPT_POSTFIELDS, $data);
$res = curl_exec($rConn);
curl_close($rConn);
return $res;
 

解釋一波：

curl_init 初始化curl會話，返回curl控制代碼

curl_setopt中的引數

CURLOPT_POST 為1 代表使用傳送POST請求

CURLOPT_RETURNTRANSFER 為1 代表將curl_exec()獲取的資訊以字串返回，而不是直接輸出

CURLOPT_POSTFIELDS  使用POST傳送$data資料或物件

如此，呼叫API成功，並且返回一個圖片儲存後的資訊。

這個圖片上傳的邏輯其實就是我在客戶端上傳一張圖片儲存到伺服器的某個目錄中(自定義)，呼叫API時，再將本地伺服器的剛儲存的圖片通過CURL呼叫API，將圖片再次上傳到API所定義要儲存到某個伺服器的目錄下，執行成功後，刪除第一臺所儲存的圖片。