Question

如何将文件从本地网址上传到本地网址？

$scope.files = []; 
$scope.uploadFile = function() {
var fd = new FormData()
for (var i in $scope.files) {
    fd.append("fileToUpload", $scope.files[i]);
}

var urlDir = "http://localhost/mecenazgos/";
//Upload the files
var xhr = new XMLHttpRequest();
xhr.upload.addEventListener("progress", uploadProgress, false);
xhr.addEventListener("load", uploadComplete, false);
xhr.addEventListener("error", uploadFailed, false);
xhr.addEventListener("abort", uploadCanceled, false);
xhr.open("POST", urlDir);
scope.progressVisible = true;
xhr.send(fd);

我已经安装了wamp服务器以在url中使用它，但它给了我一个错误：

任何想法PLZ？

Answer 1

这是一个CORS问题 - 您从localhost服务脚本，但可能通过不同的端口。为了成功，POST请求网址必须与您提供的来源相匹配，包括端口。您必须配置服务器以返回相应的访问控制标头，例如Access-Control-Allow-Origin: http://localhost:3000如果您从此来源提供客户端脚本。

Answer 2

如何使用$ http服务

发布FormData

使用FormData API POST文件和数据时，务必将Content-Type header设置为undefined。

var fd = new FormData()
for (var i in $scope.files) {
    fd.append("fileToUpload", $scope.files[i]);
}
var config = {headers: {'Content-Type': undefined}};

var httpPromise = $http.post(url, fd, config);

默认情况下，AngularJS框架使用内容类型application/json。通过设置Content-Type: undefined，AngularJS框架省略了允许XHR API设置内容类型的内容类型标头。发送FormData object时，XHR API会使用适当的边界和base64编码将内容类型设置为multipart/form-data。

有关详细信息，请参阅MDN Web API Reference - XHR Send method

使用$http和XMLHttpRequest之间的区别是什么？哪一个更好，为什么？

$ http服务是XMLHttpRequest（XHR）API的AngularJS包装器。它将基于回调的异步API转换为基于$ q服务承诺的API。它与AngularJS框架及其摘要周期集成在一起。

如果应用程序使用AngularJS框架呈现模型，则应使用AngularJS框架与服务器进行通信。

Angular将您从以下痛苦中解放出来：

注册回调：注册回调会使您的代码混乱，从而很难看到树木的森林。删除常见的样板代码（如回调）是一件好事。它大大减少了您必须执行的JavaScript编码量，并且可以更轻松地查看应用程序的功能。
以编程方式操作HTML DOM
与UI进行封送数据
只是为了开始编写大量的初始化代码

有关详细信息，请参阅：

从AngularJS上传多个文件（使用FormData API）

2 个答案:

如何使用$ http服务