Javascript AngularJS上传一个文件并将其发送到数据库

我一直在努力工作，以便上传图像并将其发送到DB–在我的例子中，DB接受JSON对象，可以使用如下语法

POST

ed：

$http.post('myMongoName/myDb/myCollection/myTable', {'key': 'value'})

相当简单。但是，我对如何使用

ngFileUpload

将上传的图像发送到数据库感到困惑。我使用的是ngFileUpload文档页面上介绍的熟悉语法：

$scope.upload = function (files) {
        if (files && files.length) {
            for (var i = 0; i < files.length; i++) {
                var file = files[i];
                console.log(file);
             Upload.upload({
                url: myMongoLabURL,
                fields: {'sup': 'sup'},
                file: file
                })
             }).success(function (data, status, headers, config) {
                    console.log('file ' + config.file.name + 'uploaded. Response: ' + data);
                });
            }
        }
 }

其中没有一个包含可存储到数据库的实际图像二进制文件。我基本上不知道实际的图像本身实际上被上传到哪里

还有一点很重要，需要注意的是，我没有从服务器上得到这种语法的响应，但是，如果我可以得到图像的二进制文件，我可以使用熟悉的

$http.post

方法，自己将图像推送到数据库中

我如何找到上传的图像的二进制文件，并将其推入数据库？图片上传后存在于何处，甚至上传到何处？我是在

localhost

上完成这一切的，因此浏览器似乎已经读取了图像的所有属性，但我不确定如何将其转化为有意义的细节，以便将图像存储到外部数据库中

谢谢你的帮助

我最后使用了。最具体地说，将URI读取为

blob

。我在自定义指令中实现了如下内容。最后，我包含了大量的

attrs

读取，这将允许在同一页面上的独立作用域中多次使用该指令，但我将在这里省略。如果有帮助的话，我可以向您提供整个指令，但简单地说，它看起来是这样的：

function create_blob(file) {
    var deferred = $q.defer();
    var reader = new FileReader();
    reader.onload = function() {
            deferred.resolve(reader.result);
    };
    reader.readAsDataURL(file);
    return deferred.promise;
}
$scope.$watch('files', function() {
    $scope.upload($scope.files);
});
$scope.upload = function(files) {
    $scope.loading = true;
    if (files && files.length) {
        for (var i = 0; i < files.length; i++) {
            var file = files[i];
            var promise = create_blob(file);
            promise.then(function(result) {
                var thumb = resize(result);
                Upload.http({
                    url: '/path',
                    data: result
                })
                .progress(function (evt) {
                    console.log(evt);
                    var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
                    console.log('progress: ' + progressPercentage + '% ');
               })
                .success(function (data, status,headers,config) {

函数创建\u blob（文件）{
var deferred=$q.deferred（）；
var reader=new FileReader（）；
reader.onload=函数（）{
延迟。解析（reader.result）；
};
reader.readAsDataURL（文件）；
回报。承诺；
}
$scope.$watch（'files'，function（））{
$scope.upload（$scope.files）；
});
$scope.upload=函数（文件）{
$scope.loading=true；
if（files&&files.length）{
对于（var i=0；i

……等等

我想这对你来说就足够了。获取

blob

数据可能会让人困惑，因为当你上传图像时，你在范围内看不到它的任何数据，尽管图像的其余元数据会显示出来！这个

create\u blob

函数应该以blob格式为你获取它。尝试执行

console.log（reader.readAsDataURL（file）；

在该函数中直接查看数据

---

我花了很长时间才弄明白，我不确定这是否是最好的方法。如果有人知道得更好，请随时提出建议！：-）

在服务器端你得到了什么。你正在记录请求正文吗？我已经启用了this-github.com/danialfarid/ng-file-upload/wiki/Node-example-server-side，尽管我不确定当我想以最佳方式将POST请求发送到外部数据库（mongolab）时为什么需要启用服务器端。无论如何，我确实注销了该文件，并获得了一系列属性，但我仍然看不到该文件本身。谢谢您的帮助。@nikkwong问题的任何解决方案？？我也得到了文件：{}当我在Post请求中传递它时。请建议答案。当然，我会在下面回答：Hi@nikk wong，谢谢你提供这段代码，请你指导我，服务器端代码应该是什么样子，在我的情况下，我想使用java REST API。提前谢谢。如果你好奇，请给我发电子邮件

function create_blob(file) {
    var deferred = $q.defer();
    var reader = new FileReader();
    reader.onload = function() {
            deferred.resolve(reader.result);
    };
    reader.readAsDataURL(file);
    return deferred.promise;
}
$scope.$watch('files', function() {
    $scope.upload($scope.files);
});
$scope.upload = function(files) {
    $scope.loading = true;
    if (files && files.length) {
        for (var i = 0; i < files.length; i++) {
            var file = files[i];
            var promise = create_blob(file);
            promise.then(function(result) {
                var thumb = resize(result);
                Upload.http({
                    url: '/path',
                    data: result
                })
                .progress(function (evt) {
                    console.log(evt);
                    var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
                    console.log('progress: ' + progressPercentage + '% ');
               })
                .success(function (data, status,headers,config) {