在put方法中Angularjs文件上传不起作用

Question

我有一个简单的待办事项应用程序，我试图上传一张照片和一个待办事项。 现在我已经创建了这个工厂函数来处理todo的创建

  todosFactory.insertTodo = function(todo){
    return $http.post(baseUrl, todo, {
      headers: {
        'Content-Type' : undefined
      },
      transformRequest: function(data, headersGetter){
        var formData = new FormData();
        angular.forEach(data, function (value, key) {
            formData.append(key, value);
        });
        return formData;
      }
    });
  };

工厂更新方法如下所示

  todosFactory.updateTodo = function(id, todo){
    return $http.put(baseUrl + '/' + id, todo, {
      headers: {
        'Content-Type' : undefined
      },
      transformRequest: function(data, headersGetter){
        var formData = new FormData();
        angular.forEach(data, function (value, key) {
            formData.append(key, value);
        });
        return formData;
      }
    });
  };

insertTodo按预期工作，但updateTodo未将数据发布到服务器。 我正在使用laravel作为API，更新API端点具有此代码

dd(Input::all(), Input::file('cover_photo'));

这表明注释已在请求中发布。 如果我在updateTodo工厂方法中将put更改为post，它将开始工作。 我错过了一些额外的标题或什么？

更新

如果我从updateTodo方法中删除transformRequest和headers ，则在服务器上成功接收文本数据，但文件数据没有。
如果我只是删除headers没有发布

更新

我正在使用laravel附带的PHP服务器使用此命令

php artisan serve

更新

感谢@ Ricardo的回答，我能够使用此代码获取提交的数据

router->put('/todos/{id}', function($id){
    $stream = file_get_contents("php://input");
    echo $stream;
    die();
});

我正在以这种格式获取流

-----------------------------3643739756006088191021064137
Content-Disposition: form-data; name="id"

5
-----------------------------3643739756006088191021064137
Content-Disposition: form-data; name="name"

Image Todo
-----------------------------3643739756006088191021064137
Content-Disposition: form-data; name="complete"

0
-----------------------------3643739756006088191021064137
Content-Disposition: form-data; name="created_at"

2015-10-02 06:28:10
-----------------------------3643739756006088191021064137
Content-Disposition: form-data; name="updated_at"

2015-10-02 06:28:10
-----------------------------3643739756006088191021064137
Content-Disposition: form-data; name="cover_photo"; filename="Dragon-Falls-Venezuela-5.jpg"
Content-Type: image/jpeg

�����JFIF��H�H������Exif��MM�*�����i������������������z���,����UNICODE��C�R�E�A�T�O�R�:� 
�g�d�-�j�p�e�g� �v�1�.�0� �(�u�s�i�n�g� �I�J�G� �J�P�E�G� �v�6�2�)�,� �q�u�a�l�i�t�y� �=� �9�0�

现在我需要解析这种原始格式。 我找到了其他人建议的两种php方法http://php.net/manual/en/function.mb-parse-str.php和http://php.net/manual/en/function.parse-str .php但是它们都没有正常工作，也没有给出像$ _GET或$ _POST这样的数组。

Answer 1

PHP文档中的这篇文章讨论了PUT方法和文件上传（multipart / form-data）。

我不能引用它的任何部分因为我认为一切都很重要。 您应该详细阅读它，但总结一下，如果不更改Apache配置和创建辅助脚本，这是不可能的。

使用Laravel，您应该使用Form Method Spoofing （基本上是一个名为_method的变量）并继续使用POST。 _method将允许您正确调用Laravel的PUT操作。

---

编辑

默认情况下，AngularJS以JSON格式发送数据，这解释了为什么您无法使用$_POST全局访问数据。 我在另一个问题中回答了这个问题 ，这个问题解释了你要做什么。

Answer 2

我认为您必须在服务器端序列化文件，如果您发送文件然后附加自定义标头并在服务器端适当处理该标头请求。

Answer 3

事先创建formData - >你不需要变换器。
将transformRequest : angular.identity添加到HTTP标头中。 您的代码应类似于以下代码段：

$http.post('/api/endpoint', formData, {
  transformRequest : angular.identity,
  headers: {'Content-Type': undefined}
})
.success(function (data) {
  // do stuff with data
})
.error(function (error) {
  // recover from an error
});

角度身份只不过是吐出你的表单数据： https ： //docs.angularjs.org/api/ng/function/angular.identity