基于REST的跨域文件上传在IE浏览器中遇到的问题

Question

我通过CXF发布了REST服务，实现了一个文件上传的功能，代码如下： 

@Service
public class UserRest extends BaseRest {
    @Autowired
    private UserService userService;

    @Autowired
    private MultipartResolver multipartResolver;

    @POST
    @Path("/user/picture")
    @Consumes("multipart/form-data")
    public Response uploadPicture(
        @Context HttpServletRequest request
    ) {
        MultipartHttpServletRequest multipartRequest = multipartResolver.resolveMultipart(request);
        MultipartFile multipartFile = multipartRequest.getFile("picture");

        int userId = WebUtil.getParamInt(multipartRequest, "userId");

        String uploadPath = ConfigTool.getProperty("upload.path");
        String picturePath = "user/" + userId + "/";
        String fileName = multipartFile.getOriginalFilename();

        FileUtil.deleteDir(uploadPath + picturePath);

        try {
            FileUtil.uploadFile(uploadPath + picturePath + fileName, multipartFile.getBytes());
        } catch (Exception e) {
            e.printStackTrace();
        }

        Map<String, Object> fieldMap = new HashMap<String, Object>();
        fieldMap.put("picture", picturePath + fileName);

        User user = userService.updateUser(userId, fieldMap);
//        return super.createJsonResponse(user);
        return super.createHtmlResponse(user.toJson());
    }
}

以下是一个HTML客户端，代码如下：

<div class="container">
    <form id="upload_picture_form" method="post" enctype="multipart/form-data" class="form-horizontal">
        <div class="modal-header">
            <h3>Upload picture</h3>
        </div>
        <div class="modal-body">
            <div class="control-group">
                <label for="upload_picture_form-picture" class="control-label">Picture:</label>
                <div class="controls">
                    <input type="file" id="upload_picture_form-picture" name="picture"/>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="submit" class="btn btn-primary">Upload</button>
            <button type="button" class="btn" data-dismiss="modal">Close</button>
        </div>
        <input type="hidden" id="upload_picture_form-user_id" name="userId" value="1"/>
    </form>
</div>

<script type="text/javascript">
    $(function() {
        // 上传头像
        $('#upload_picture_form').ajaxForm({
            url: REST_BASE + '/user/picture',
            beforeSubmit: function() {
                if ($.trim($('#upload_picture_form-picture').val()) == '') {
                    alert('Please choose a picture!');
                    return false;
                }
            },
            success: function(json) {
                alert(json); // 返回JSON字符串
                json = JSON.parse(json);
                alert(json); // 解析为JSON对象
                if (json) {
                    alert('Upload picture successfully!');
                }
            }
        });
    });
</script>

在Chrome、Firefox浏览器中运行正常（都返回JSON字符串），但在IE中运行失败，我在Ajax成功回调函数中alert(json)，竟然出现如下显现：

为何返回的json数据变成了HTML源码？如何才能解决在IE浏览器下的跨域文件上传？

Answer 1

IE都不支持，必须使用text/html。但这个跨域问题貌似不是Content-Type导致的。

Answer 2

记得IE6不支持返回Content-Type  是json的