Question

我正在为文件上传制作这个jquery请求：

<script>
    $('#form').submit(function(event) {
        event.preventDefault();
        console.log("Form[0]: \n");
        console.log($('#form')[0]);
        var formData = new FormData($('#form')[0]);
        $.ajax({
            type: 'POST',
            url: 'http://localhost:8080/PROJECT_URL',
            data: formData,
            cache: false,
            contentType: false,
            processData: false,
            beforeSend: function() {
                $('#status').text('Enviando...').attr('style','display: inline;');
            },
            complete: function(response, status) {
                console.log(status);            
                $('#status').text('Arquivo enviado com sucesso!').attr('style','display: inline;');
            }

        });
    });
</script>

我能够将文件发送到服务器，并且在服务器端处理文件时页面会保持加载状态。我的REST服务器以下列格式返回JSON： {"status" : "OK", "msg" : "RESPONSE_MESSAGE"}。但是，我不知道如何对待这种反应并始终得到这个错误：

XMLHttpRequest无法加载http://localhost:8080/PROJECT_URL。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许原点'null'访问。

我已经用Google搜索了这个错误，我知道这是因为跨域限制。我需要做些什么来克服这个限制并获得JSON响应（我需要得到这个响应才能知道上传的文件是否具有正确的内容）？这可能吗？

谢谢！

编辑：

接收文件的服务器端方法：

@Path("/import")
@Consumes(MediaType.APPLICATION_JSON + ";charset=utf-8")
@Produces(MediaType.APPLICATION_JSON + ";charset=utf-8")
public class ImportResource {

    @POST
    @Path("/mapa")
    @Consumes({MediaType.MULTIPART_FORM_DATA})
    public String uploadMapa(
        @FormDataParam("file") InputStream fileInputStream,
        @FormDataParam("file") FormDataContentDisposition fileDetail,
        @FormDataParam("colaborador") FormDataBodyPart jsonPart) {
    // here the file is processed...

    ....

    // The return is something like this
      return Response.Ok("File is ok");;
    } 
}

Answer 1

是的，这是可能的。您需要在REST服务中设置标头Access-Control-Allow-Origin: *，其中返回响应数据。

将您的回复修改为{"status" : "OK", "msg" : "RESPONSE_MESSAGE"}，因为您当前的回复格式不正确。

我认为你的后端建立在Jersey

上

Response response = Response.status(200).entity(yourEntity).header("Access-Control-Allow-Origin", "*").build();

您可以限制域，使其仅限于一个服务器/客户端/域，为此，请将*替换为您要限制此API的域。例如"www.yourdomain.com"。

jQuery跨域POST（文件上传）

1 个答案: