正确的内容类型,用于发送此AJAX帖子数据

时间:2018-03-16 16:35:12

标签: javascript java ajax spark-java spark-framework

我在使用ajax post发送base64图像数据时遇到问题 我认为我对Content-Type有错误的值但是已经尝试 application / json text / json image / jpeg 而没有任何成功< / p>

的Javascript

  function sendFormData(fD)
    {
        var urls = fD.get('urls');
        console.log('urls', urls);

        var xhr = new XMLHttpRequest();
        xhr.open('POST', '/editsongs.update_artwork');
        alert(urls);
        xhr.setRequestHeader("Content-type", "image/jpeg");
        xhr.send(urls);
    }

浏览器控制台显示

["data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBxMTEhUTExMWFhUXGRgbGBgXGR0aGRgXHRgYFx4YGxkYHiogGh4lGxgdIjEhJSkrLi4uGh8zODMtNygtLisBCgoKDg0OGhAQGy0lHSUtLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLf/AABEIANEA8QMBIgACEQEDEQH/xAAcAAACAgMBAQAAAAAAAAAAAAAEBQMGAAECBwj/xABGEAACAQIEBAQDBAUJCAIDAAABAhEDIQAEEjEFIkFREzJhcQaBkRRCobEjUsHh8AcVM2JygsLR8RZDRFNzg5KyJDSzw8T/xAAZAQADAQEBAAAAAAAAAAAAAAABAgMABAX/xAAqEQACAgEDBQACAQQDAAAAAAAAAQIRAxIhMQQTFEFRImGRYnGh8AUjMv/aAAwDAQACEQMRAD8AsoosJt9cSpSdeYKYEXxKlQs4E2kEx6dMWJFBEDr0OPey5nCrR58MalwJUpB1nENbJWthpTyQDG5H5Y0gGqNQOJLLXA7h9K9VypGITSPbD+tSGIFy4mSJx0xz7EXjE7UscacNamW30jAlbLsNxiscqZNwoCK4wDEzJjkLiuoQjGNEYnCY5ZcawkMY5bEkY5GGsUijG1XtjcYPyFAQWMbbdsac9Ks0Y2wQphlwTKLUZg2wAwFmq8m5HYY5HFTRph0VnBI1QDZZgsZGwEnHPmn/ANb+lMcVqLFWRafKMTU+L6bRb88V/LcY+0otQKVmbdcbq1wsSYkgDfc7C3fHIoRlDVIs5tSpFzyXEtcdCdvlhopwp4RSpwvcAf64bj0x5mbSpUjrhdbmicSU1xi08djEWylGRjRGOsC5uodl379sBK2F8HbMAJxUON5lqrQFMA4f1CVU62ke2FaZlWqXgAbepx29MtD1VZzZXaol4RwYKsuAWP4…

Java服务器代码

public String updateArtwork(Request request, Response response)
    {
        System.out.println("Received artwork");

        for(String s:request.queryParams())
        {
            System.out.println("---"+s);
        }
        System.out.println("ReadParms");
        return "";
    }

只是输出

Received artwork
ReadParms

已更新为“以表格形式发送”

// Once we got everything, time to retrieve our objects
function sendData()
{
    var fD = new FormData();

    // send Files data directly
    var files = imgList.filter(
        function isFile(obj)
        {
            return obj.type === 'file';
        }
    );

    files.forEach(
        function appendToFD(obj)
        {
            fD.append('files[]', obj.file);
        }
    );

    // for elems, we will need to grab the data from the server
    var elems = imgList.filter(
        function isElem(obj)
        {
            return obj.type === "element";
        }
    );

    var urls = elems.map(
        function grabURL(obj)
        {
            return obj.element.src;
        }
    );

    if (urls.length)
        fD.append('urls', JSON.stringify(urls));

    sendFormData(fD);
};

    function sendFormData(fD)
    {
        // but here we will just log the formData's content
        var files = fD.getAll('files[]');
        console.log('files: ', files);
        var urls = fD.get('urls');
        console.log('urls', urls);

        var xhr = new XMLHttpRequest();
        xhr.open('POST', '/editsongs.update_artwork');
        xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhr.send(fD);
    }

然后在服务器上我有

 public String updateArtwork(Request request, Response response)
    {
        System.out.println("Received artwork");

        for(String s:request.queryParams())
        {
            System.out.println("***"+s);
            System.out.println(request.queryParams(s));
        }
        System.out.println("ReadParms");
        return "";
    }

及其输出

    Received artwork
    ***-----------------------------330219842643
    Content-Disposition: form-data; name
    "urls"

    ["data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBxMSEhUSExIWFhUXFxgXGBcYFRgXFxkdGBcWGBgYFx0YHSggHR0lHRkYITEhJSkrLi4uFyA1ODMtNygtLisBCgoKDg0OFQ8PFSsZFRkrLSstLSstKysrLS03KystLSstKy03LSstLSstNzc3KysrLS0tKysrKysrKysrKysrK//AABEIAKoBKQMBIgACEQEDEQH...."]
    -----------------------------330219842643--

ReadParms

所以我现在正在获取数据,但我不明白如何理解如何解析Java中的Content-Disposition部分。

这段代码最初并非由我编写,因为您可以看到构建 FormData 它并非来自实际的表单。我的第一次尝试是尝试从 FormData 中提取并以不同的方式发送,另一种方法是首先不存储在 FormData 中但不知道如何执行此操作

更新2 尝试只发送第一个网址而不是formdata或网址的arrya,因为实际上只有一个url.But它只是不起作用,没有收到服务器?

function sendFormData(urls)
{
    console.log('urls', urls[0]);
    var xhr = new XMLHttpRequest();
    xhr.open('POST', '/editsongs.update_artwork');
    xhr.setRequestHeader("Content-type", "text/json");
    alert(JSON.stringify(urls[0]));
    xhr.send(JSON.stringify(urls[0]));
}

1 个答案:

答案 0 :(得分:2)

您正在尝试使用queryParams()查看正文中的数据,这将为您提供位于网址中的查询参数。

使用body()从请求正文加载数据。