正在将表单数据从 Angular 2 上传到 Slim PHP API

Question

我在这个问题上大发雷霆。有没有什么方法可以解析 Slim PHP 中的表单数据，将数据放入数组中（就像 JSON 一样）。我可能遗漏了一些东西，但我尝试过的所有方法都将数据踢出一个数组，无法定位表单数据。任何帮助表示赞赏。

Angular 组件（在表单提交时执行）：

let memory: any = new FormData();

if (this.memory_images) {
  for(var i = 0; i < this.memory_images.length; i++) {
    memory.append('memory_images', this.memory_images[i], this.memory_images[i].name);
  }
}
memory.append('memory_song', this.memory_song);
memory.append('memory_text', this.memory_text);
memory.append('memory_author', this.memory_author);
memory.append('memory_collection', this.memory_collection);

this.memoriesService.saveMemory(memory).subscribe(data => {
  console.log(data);
  // returns empty array
});

Angular 记忆服务：

saveMemory(memory){
  let headers = new Headers();
  headers.append('Content-Type','multipart/form-data');
  return this.http.post('http://{{ my api route }}/api/v1/memories', memory, {headers: headers})
  .map(res => res);
}

修身 API 路线：

$app->group(APIV1 . '/memories', function() {
  $this->post('', function (Request $request, Response $response, $args) {
    var_dump($request->getParsedBody());
    return $response
  });
});

组件总是returns一个空数组。有趣的是，当通过 Postman 提交表单数据时，返回的数据是数组中的字符串（我'我们只发送了两个参数):

array(1) {
  ["------WebKitFormBoundaryXcRTrBhJge4N7IE2
  Content-Disposition:_form-data;_name"]=>
    string(181) ""memory_author"

    Jack
    ------WebKitFormBoundaryXcRTrBhJge4N7IE2
    Content-Disposition: form-data; name="memory_collection"

    12345678
    ------WebKitFormBoundaryXcRTrBhJge4N7IE2--
   "
}

表格一直有效，直到我需要添加上传图片的功能。之前，我将表单输入收集到一个对象中并作为 JSON 发送到 API。据我了解，因为我现在需要附加文件，所以我需要将提交作为表单数据发送。这个对吗？谢谢！

Answer 1

从 Slim 的角度来看，它只是 sets the parsed body to whatever is in $_POST，所以这意味着：

方法不是 POST
内容类型不是 application/x-www-form-urlencoded 或 multipart/form-data
PHP无法将发送的数据解析成数组

看看你的代码，我想我们可以排除前两个，这意味着数据正在以 PHP 无法理解的格式发送。

您似乎在尝试发送多个文件，所以我认为您可能需要更改：

memory.append('memory_images', this.memory_images[i], this.memory_images[i].name);

至：

memory.append('memory_images[]', this.memory_images[i], this.memory_images[i].name);

（即它是一个数组，需要 []。）

Answer 2

我在 Angular 和 Slim API 中遇到了同样的问题，现在它可以完美地完成这些事情

1- 不要在来自 angular 代码

的请求中发送任何 header

2- 对于上传的照片，您将在 Slim 应用程序中获取上传的图像在 $files 数组中这是将图像从 angular 上传到 Slim API

的示例

在你的component.ts

uploadimage(){
var formData = new FormData();
formData.append("image",this.image );
return this.http.post('http://Yourserver.com/UploadeFileAPI',formData)
.map(response =>response.json()).subscribe(
result=>{
console.log("image uploaded");
},
error=>{
console.log(error);
})}

在您的 Slim 应用程序中

$app->post('/uploadphoto',function ($req,$res){
$topic_name=$req->getParsedBodyParam('any parm name');
$files=$req->getUploadedFiles();
$newimage=$files['image'];}

正在将表单数据从 Angular 2 上传到 Slim PHP API

Uploading form data from Angular 2 to Slim PHP API

javascript

php

json

slim

angularjs