2

I am trying to save a generated zip-file to disk from within a chrome extension with the follwing code:

function sendFile (nm, file) {
  var a = document.createElement('a');
  a.href = window.URL.createObjectURL(file);
  a.download = nm; // file name
  a.style.display = 'none';
  document.body.appendChild(a);
  a.click();
  document.body.removeChild(a);
}
function downloadZip (nm) {
  window.URL = window.webkitURL || window.URL;
  var content;
  content = zip.generate();
  var file = new Blob ([content], {type:'application/base64'});
  sendFile ("x.b64", file);
  content = zip.generate({base64:false});
  var file = new Blob ([content], {type:'application/binary'});
  sendFile ("x.zip", file);
}

Currently this saves the contents of my zip in two versions, the first one is base64 encoded, and when I decode it with base64 -d the resulting zip is ok.
The second version should just save the raw data (the zip file), but this raw data arrives utf-8 encoded on my disk. (each value >= 0x80 is preprended with 0xc2). So how to get rid of this utf-8 encoding? Tried various type-strings like application/zip, or ommitting the type info completely, it just arrives always with utf-8 encoding. I am also curious how to make the browser store/convert base64-data (the first case) by itself, so that they arrive as decoded binary data on my disk... I'm using Chrome Version 23.0.1271.95 m

PS: The second content I analysed with a hexdump-utility inside the browser: it does not contain utf-8 encodings (or my hexdump calls something which does implicit conversion). For completeness (sorry, its just transposed from c, so it might not be that cool js-code), I append it here:

function hex (bytes, val) {
  var ret="";
  var tmp="";
  for (var i=0;i<bytes;i++) {
    tmp=val.toString (16);
    if (tmp.length<2)
      tmp="0"+tmp;
    ret=tmp+ret;
    val>>=8;
  }
  return ret;
}
function hexdump (buf, len) {
  var p=0;
  while (p<len) {
    line=hex (2,p);
    var i;
    for (i=0;i<16;i++) {
      if (i==8)
        line +=" ";
      if (p+i<len)
        line+=" "+hex(1,buf.charCodeAt(p+i));
      else
        line+="   ";
    }
    line+=" |";
    for (i=0;i<16;i++) {
      if (p+i<len) {
        var cc=buf.charCodeAt (p+i);
        line+= ((cc>=32)&&(cc<=127)&&(cc!='|')?String.fromCharCode(cc):'.');
      }
    }
    p+=16;
    console.log (line);
  }
}
5
  • Couldn't you just add data:application/octet-stream;base64, in front of the base64 data (instead of using createObjectURL).
    – Gerben
    Dec 9, 2012 at 20:38
  • @Gerben That works! changed to a.href="data:application/octet-stream;base64,"+content;, where content is the base64-encoded stuff. Now the question is: For what is that whole Blob-stuff good? Or is it meant to be used for other purposes?
    – pbhd
    Dec 9, 2012 at 20:59
  • Without Blobs you can't read files. But my guess your problem is in zip.generate. Maybe using normal arrays instead of typed-arrays or something, but that is not my specialty. I just saw a way of producing the required result, but not fix the root problem. Glad it helped though.
    – Gerben
    Dec 9, 2012 at 21:11
  • Looking at the spec, I now see that content is already base64 encoded. Looking at the spec I don't believe new Blob ([content], {type:'application/base64'}); would convert content from base64 to binary. The type parameter only tells what kind of data is in the blob. I your case you should technically use application/zip. This type is probably used by createObjectURL, to generate an appropriate data-url. So what you were essentially doing is double-base64 encoding the data.
    – Gerben
    Dec 9, 2012 at 21:19
  • 1
    @Gerben Nevertheless, thanks alot.
    – pbhd
    Dec 9, 2012 at 21:31

1 Answer 1

2

From working draft:

If element is a DOMString, run the following substeps:

  • Let s be the result of converting element to a sequence of Unicode characters [Unicode] using the algorithm for doing so in WebIDL [WebIDL].

  • Encode s as UTF-8 and append the resulting bytes to bytes.

So strings are always converted to UTF-8, and there is no parameter to affect this. This doesn't affect base64 strings because they only contain characters that match single byte per codepoint, with the codepoint and byte having the same value. Luckily Blob exposes lower level interface (direct bytes), so that limitation doesn't really matter.

You could do this:

var binaryString = zip.generate({base64: false}), //By glancing over the source I trust the string is in "binary" form
    len = binaryString.length,    //I.E. having only code points 0 - 255 that represent bytes
    bytes = new Uint8Array(len);

for( var i = 0; i < len; ++i ) {
    bytes[i] = binaryString.charCodeAt(i);
}

var file = new Blob([bytes], {type:'application/zip'});
sendFile( "myzip.zip", file );
2
  • Tried it out, works perfect. Although I had a very good solution, see above, this meets the Blob-issue. But to me this behavior of converting strings with chars >=0x80 to utf-8 and on the other hand leaving Unint8Array alone is somehow like a glitch. Who is the culprit? Maybe JSZip should introduce a method generateBlob, or Blob should have an extra parameter to be able to tell it to not convert the string to utf-8? Nevertheless, thanks for the solution
    – pbhd
    Dec 10, 2012 at 20:30
  • @pbhd Well it's not a glitch, the difference between bytes and strings, is that strings are characters and thus must always have an encoding (because computers don't understand characters, just bytes :P). Bytes are just bytes. The library should definitely have a method for returning as byte array though, you can't convert string to bytes without an encoding.
    – Esailija
    Dec 10, 2012 at 20:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.