我如何通过JSON发送图像数据从一个图像标签有blob URL在src

How can I send Image data through JSON from an Image Tag that has blob URL in src?

本文关键字:图像 标签 一个 blob src URL JSON 何通过 数据      更新时间:2023-09-26

我正在做一个项目,前端使用Angularjs,后端使用Java Webservices。我试图通过JSON上传和发送图像。

图片上传时,在src中生成一个blob url (blob:http://localhost/a34ac19f-3320-4cdf-b30f-e1b0a0e7a745)。我如何读取它并将其转换为Base64或可以通过JSON发送的其他类型?

首先在控制器的正下方添加这个自定义目录:

app.directive('fileModel', ['$parse', function ($parse) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var model = $parse(attrs.fileModel);
            var modelSetter = model.assign;
            element.bind('change', function () {
                scope.$apply(function () {
                    modelSetter(scope, element[0].files[0]);
                });
            });
        }
    };
}]);

然后在你的视图中这样使用:

 <input type = "file" name="files" file-model = "myFile"/>

在你的控制器函数中,当你的表单提交时:

这样做:

$scope.formSubmit = function(){
         var file = $scope.myFile;
         var fd = new FormData();
         fd.append('profilepic', file);
         fd.append('action', 'add');
         $http.post('yourjavafile', fd, {
                    transformRequest: angular.identity,
                    headers: {'Content-Type': undefined}
                }).success(function (response) {
                        if (response) {
                        } else {
                        }
                    });;
}