jquery / php和文件上传到远程站点

Question

This is my First post so please be gentle.

I am trying to streamline some B2B, but our supplier isn't helping, so I'm trying to create an interface using their standard web controls and a click by a user on my side via the browser.

The remote server has some nice security protocols so curl is out of the question. The only way I could get the remote server to accept my file was by making the interface via a web browser using their cookies. Which isn't a bad thing because I would like the staff to view the document before its posted.

When I use Fiddler and I do an upload via their site the Content Length the file size is 55344, The file size is 54920 so that's about right... But when i do it through Java / PHP / jquery they are all about 99870 in size.

If i upload a Text file this works fine.

If i upload a PDF or a Word Document the file size blows out and corrupts.

I have tried to create the post data via PHP and the jquery has a tanty and wont send, I have encoded and decoded base 64 between PHP and Java.. File size blows out

I have been googling for a few days now and not having much luck. Why would this be ?

Here is my Code for the JavaScript:

    var boundary = "' . $boundary . '";

    var jqxhr = $.ajax({
        type: "GET",
        url: "' . $filename . '",
        context: document.pdf,
        global: false,
        async:false,
        success: function(data) {
            return data;
        }
    }).responseText;


var javabody = "--" + boundary + "
"
        + "Content-Disposition: form-data; name=\"' .$name. '\"; filename=\"' .$filename. '\"
"
        + "Content-Type: application/pdf

"
        + jqxhr + "
"
        + "--" + boundary + "
"
        + "Content-Disposition: form-data; name=\"attachDocument\"" + "

"
        + "Attach Docs
"
        + "--" + boundary + "--";

    $.ajax({
            type: "post",
            url: "' . $url . '",
            datatype: "html",
            contentType: "multipart/form-data; boundary=' . $boundary . '",
            cache: "false",
            context: document.body,
            global: "false",
            data: javabody,
            crossDomain: true,
            xhrFields: {
                    withCredentials: true
                    },
            processData: false,
            async: false,
            });

Everything works, 'a' file goes up and the placeholders and the boundary's are correct, Just the file size blows out and becomes corrupt.

Any help would be appreciated

Mike

Answer 1

After brainstorming and searching this site until my fingers bled I come up with a solution:

function submitQuoteSupportingDoc() {
    //add the binary file contents to the object, can only submit file contents via post if binary blob is present
    var xhr = new XMLHttpRequest();
    xhr.open("GET", "' . $filename . '", true);
    xhr.responseType = "blob";
    xhr.onload = function(e) {
            if (this.status == 200) {
                    var myBlob = this.response;
                    var fd = new FormData();
                    fd.append("attachFile", myBlob, "' . $FileForUpload . '" );
                    fd.append("attachDocument", "Attach Docs");
                    $.ajax({
                        type: "POST",
                        url: "' . $DocumentUrl . '",
                        data: fd,
                        async: false,
                        crossDomain: true,
                            xhrFields: {
                                    withCredentials: true
                                    },
                        processData: false,
                        contentType: false
                    }).done(function(data) {
                           console.log(data);
                    });
                    close();
                    }
    };
    xhr.send();
I}

Obviously this is running in a PHP script.. But it works.

Thanks Guys

Mike