react + PHP+axios數據傳輸——文件上傳處理

react + PHP+axios數據傳輸——文件上傳處理

很久沒寫博客了，斷更很久繼續記錄自己的開發經歷。

這次是自己開發的一個小項目記錄，技術棧用的是react+PHP+MySql，請求方式用的axios，之前從來沒用過react+PHP的組合，主要是最爲一個前端程序員Java有點忘記了，PHP還記得點，這裏就用了PHP，好了廢話不多說。

這次主要的問題是在使用react和PHP的時候，發現使用axios提交的時候上傳的文件接收不到，之前用PHP都是和HTML+JS，之前的傳遞都是通過表單直接跳轉到PHP文件來處理。用react只能是將PHP處理成接口來處理。PHP在接收表單的時候直接通過POST和GET就能拿到數據。

在處理react傳輸的數據時就不能通過這種方式。我也不知道爲什麼

首先前端，react這裏要模擬一個表單數據，直接創建FormData對象就可以了，上傳過程將axios的頭設置成表單的模式

const formData = new FormData();
formData.append('video', this.state.video); // 上傳文件
formData.append('title', '上傳文件');

axios.post('http://localhost/uploadVideo.php',formData,{
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
    }
})

你們是不是以爲PHP直接用POST就能拿到數據，那是不行的。

看一下後端代碼，前端傳遞了一個title和文件，通過POST我們只能拿到title數據，並不能拿到上傳文件。後端還是要利用$_FILES函數才能拿到數據。

$_Data = json_encode($_POST);
$_Data = json_decode($_Data,true);
$upFile = $_FILES['video'];

，這種方式是我試了好幾次才能通的方法。作爲一個前端我覺得我的後端技術真是太差了，對於那些PHP大佬來說這應該是個很小的問題吧。我覺得我的PHP技術入門都不夠，如果有哪位大佬知道原因，請給我留言告知，萬分感謝！