Uploading with Javascript

namante

So, I'm working on a SmugMug Windows sidebar gadget; so far I've got a JavaScript wrapper for most of the API (1.2.0 and most of 1.2.1), but I'm finding the upload functionality tricky. I've read the API on uploading and about the alternative binary upload methods, however I'm not sure of a good way to send the raw binary data using javascript or generate a valid MD5Sum, so I've stuck with the base64 encoding/smugmug.images.upload for now.

I can use ADODB.Stream and MSXML2.DOMDocument to get both the Base64 encoded image file and its ByteCount, like so:

        var stream = new ActiveXObject("ADODB.Stream");
        stream.Type = 1; //binary data
        stream.Open();
        stream.LoadFromFile(filePath);
        var dom = new ActiveXObject("MSXML2.DOMDocument");
        var node = dom.createElement("node");
        node.dataType = "bin.base64";
        node.nodeTypedValue = stream.Read(-1); //read all
 
        Data = encodeURIComponent(node.text); //image as a URI encoded base64 string
        ByteCount = stream.Size;
 
        stream.Close();

Then I can upload it with the following:

    xmlHttp.open("POST", "https://upload.smugmug.com/hack/json/1.2.0/", bAsync);
    xmlHttp.setRequestHeader("User-Agent", API.UserAgent);
    xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
     
    xmlHttp.send("method=smugmug.images.upload&APIKey=" + API.APIKey + "&SessionID=" + API.SessionID + "&AlbumID=" AlbumID + "&FileName=" + FileName + "&Data=" + Data + "&ByteCount=" + ByteCount);

It works, but I'm trying to determine if it's the best solution as far as JavaScript is concerned. Has anyone come across a good way to upload with JavaScript using one of the binary upload methods or generate a correct MD5Sum of the image?

devbobo

Personally, I'd used this upload method...

    xmlHttp.open("POST", "http://upload.smugmug.com/photos/xmlrawadd.mg", bAsync);
    xmlHttp.setRequestHeader("User-Agent", API.UserAgent);
    xmlHttp.setRequestHeader("Content-Length", ByteCount);
    xmlHttp.setRequestHeader("X-Smug-SessionID", API.SessionID);
    xmlHttp.setRequestHeader("X-Smug-AlbumID", AlbumID);
    xmlHttp.setRequestHeader("X-Smug-FileName", FileName);
    xmlHttp.setRequestHeader("X-Smug-Version", "1.2.0");
    xmlHttp.setRequestHeader("X-Smug-ResponseType", "JSON");
     
    xmlHttp.send(Data);

Note #1: when using this method, you don't need to base64 encode the stream.
Note #2: MD5Sum is not required, but recommended since it's used for error checking. I have some JS code (Mozilla/XPCOM) for generating a MD5, but I need to dig it up.

Cheers,

David

namante

Note #1: when using this method, you don't need to base64 encode the stream
Note #2: MD5Sum is not required, but recommended since it's used for error checking. I have some JS code (Mozilla/XPCOM) for generating a MD5, but I need to dig it up.

Can I directly send the stream object? I've been operating under the impression that the content of 'Data' had to be a string... If i can send the stream object directly that would simplify life a lot. Also, I've found JS to generate an MD5 of a string, do you have JS to generate the MD5 of a stream?