在Laravel收到的XMLHttpRequests发布请求中处理javascript FormData与json数据结合使用

Question

我有一些使用XMLHttpRequests作为json发送的表单数据。在我需要在帖子数据中添加一些上传的文件之前，此方法运行良好。我使用https://developer.mozilla.org/en-US/docs/Web/API/FormData完成了此操作。但是，现在在Laravel中处理此数据变得更加困难。我正在为此寻找更好的解决方案。示例：

仅发送json

我曾经发送过这样的内容：

const otherData = { field1: true, field2: null, field3: [1, 2, 3] };
axios.post('path/somewhere', otherData);

这使我可以在Laravel中读取请求数据，就像$request->field3一样简单。

同时发送json和文件

当还必须发送文件时，我使用类似以下内容：

const FormData = new FormData;
formData.append('myFile', someFile);
formData.append('otherData', JSON.stringify(otherData));
axios.post('path/somewhere', formData);

但是现在在Laravel中，我无法像$request->otherData->field3那样轻松访问我的otherData，因为$request->otherData只是一个字符串。我还失去了其他便利，例如TrimStrings中间件，以及诸如$request->validate(['field3' => 'required']);的轻松验证，因为请求中不再存在field3。

Answer 1

所以我刚刚解决了这个问题，因为我确实遇到了这个问题-我有一个可爱的vue组件，它通过axios将JSON传递回我的Laravel控制器，并使用FormRequest处理验证。好吧，您知道发生了什么事情，所以我使用了解决方案。

1）视图中的组件。

let data = new FormData()
for (var i=0; i<this.services.length; i++){
    data.append('services[]', JSON.stringify(this.services[i]))
}
axios.post('/api/services', data, {headers: {"Content-type": "multipart/form-data"}})
          .then((response) => {

2）验证

class ServiceRequest extends FormRequest

public function riles(){
   $rules = [
      'services.*.name' => 'required|min:1|max:128'  
   ];

   return $rules;
}

3）使它起作用的位；像这样重写FormRequest prepareForValidation中的函数

protected function prepareForValidation()
{
    $services = $this->input("services");
    $newServices = array();
    foreach ($services as $service) {
        $service = json_decode($service, true);
        $newServices[] = $service;
    }
    $this->merge([
        'services' => $newServices
    ]);
}

轰！验证的工作方式与您在向提交中添加文件或图像的好主意之前所做的一样。

这是有效的，因为您转换了现在是我的服务数组的字符串，请注意，在vue组件中我已经将我的serivces对象作为数组类型“ services []”传递了，这在使用FormData之前不需要，并告诉PHP转换services []放入一个数组（我相信这对PHP来说是唯一的）。通常，laravel不会将JSON字符串自动转换为JSON，但是当从多部分请求中获取时，它只是一个字符串-可能是因为mime类型，因此在验证之前需要将其转换回对象。一切都像以前一样。