Question

我有一个Angularjs 1.5.0 Web应用程序，它应该与我开发的基于REST的Web服务（使用dropwizard＆amp; jersey）进行通信，并测试它是否完美。

REST Web服务方法如下：

@POST
@Path("/saveImage")
public Response saveImage(
    @FormDataParam("imagefile") InputStream uploadedInputStream,
    @FormDataParam("imagefile") FormDataContentDisposition fileDetail) {

    // save image on server's file system and return OK
}

扫描仪的本地网络服务器通过以下链接向我提供扫描图像：http://localhost:9980/thumb/random-generated-guid.jpg

在我的angularjs代码中，我想将上面链接提供的图像发送到我的REST服务。

有人知道怎么做吗？

我首先尝试将图像保存为blob，然后将其发送到Web服务。我可以使用javascript的XMLHttpRequest保存图像，但发送总是失败。将图像保存为 Blob 的代码：

var xhr = new XMLHttpRequest();
xhr.open('GET', imageAddress, true);
xhr.responseType = 'blob';
var imageData = null;

xhr.onload = function(e) {
    if (this.readyState === 4 && this.status === 200) {
        // get binary data as a response
        imageData = this.response;
        var gatewayResponse = sendToGateway(imageData);
    }
};

发送blob数据的代码：

var sendToGateway = function(imageDataBlob) {
        var formdata = new FormData();
        formdata.append('imagefile', imageDataBlob)
        $.ajax({
            url: 'http://localhost/eval/saveImage',
            method: 'POST',
            contentType: 'multipart/form-data; charset=UTF-8',
            data: formdata,
            dataType: 'json',
        })
        .done(function(response) {
            $log.info("**************** response = " + response);
            alert("response:\n" + response);
        })
        .fail(function(jqXHR, textStatus, errorThrown) {
            $log.error("!!!! FAIL !!!!!!!!!");
            alert("FAIL !!!!!!!");
        })
        .always(function(){
            $rootScope.scannerInactive = false;
            doStartPreviewUpdate();
        });
    };

实际上，问题是当调用 sendToGateway（imageData）; 时，我收到错误：

TypeError：'append'调用未实现的对象   接口FormData。

value = jQuery.isFunction（value）？ value（）:( value == null？“”：   价值）;

Answer 1

哎呀，我发现了问题。我应该在$ .ajax（）调用中添加以下指令。

processData: false,
contentType: false,

如何使用AngularJS下载然后上传图像

1 个答案: