Upload binary image file using XMLHttpRequest from CSP page to IRIS for Health
Hi-
I am trying to create a simple example of allowing binary (tiff) files to be selected and uploaded asynchronously to an IRIS for Health back-end. I have managed to write the HTML and Javascript which works great with regular text / ascii files, but fails with binary files.
When I upload a binary file (tiff) image I get garbage like this on the database server
^TKEN(5,"data")="MM"_$c(0)_"*"_$c(0,128)_"g ÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿÿ
The csp page I am using for the upload is as follows:
<html> <head> <script language="cache" method="OnPreHTTP" returntype="%Boolean"> set ^TKEN=$I(^TKEN) quit $$$OK </script> <script language="javascript"> function FileLoad(){ var formData = new FormData(); var file = document.getElementById("myFile").files[0]; formData.append("fileName", file.name); formData.append("fileSize", file.size); formData.append("file", file, file.name); var xhr = new XMLHttpRequest(); // Upload data to server xhr.open("POST", "cacheFile.csp", true); xhr.send(formData); xhr.onload = function(e) { if (this.status == 200) { alert(this.status + ' everything okie dokie'); // everything is OK } else { alert(this.status + ' ' + this.statusText); } }; } </script> <!-- Put your page Title here --> <title> Medical Record Upload </title> </head> <body> Select file to upload: <input type="file" name="fileToUpload" id="myFile" onchange="javascript:FileLoad();"> </body> </html>
I think there has to be something I’m missing in the javascript function “FileLoad”, but have no clue what that could be.
Any HTML/Javascript expertise that might be able to point me in the right direction