I think this is basically the same issue as eligrey/FileSaver.js#127 - adding a bower.json file would make this easier to use.

XHR2 FormData with BlobBuilder for CSS upload of a file in memory

I have this working in Firefox and Chrome but am unable to get this to work in Safari even using you pollyfill.

Can you provide any help / advice.

Reference Issue
Can't find variable: real_create_object_url
} else if (real_create_object_url) {

You are redefining window.URL.createObjectURL which causes it to fail when given a Blob object in browsers that support it

The Blob.js file has problem with ;
I do #70 to fix that

Grunt will not inject Blob.js. bower info eligrey/Blob.js returns the following:

bower not-cached    git://github.com/eligrey/Blob.js.git#*
bower resolve       git://github.com/eligrey/Blob.js.git#*
bower checkout      Blob.js#master
bower invalid-meta  Blob.js is missing "main" entry in bower.json
bower invalid-meta  Blob.js is missing "ignore" entry in bower.json
bower resolved      git://github.com/eligrey/Blob.js.git#b0141af46b

So I'm trying to use blob.js from an IE 8 browser and I'm getting an error message that says Uint8Array is undefined.

After researching I saw this stack overflow post about someone having a similar issue with pdf.js saying typed arrays weren't supported. I've tried to include that snippit (above link) into my blob.js file but it still doesn't work complaining that it was expecting a function here

if (Uint8Array && (data instanceof ArrayBuffer || data instanceof Uint8Array))

Any help getting this to work on IE 8 would be greatly appreciated.

Hi,
I have some question about fakeblob.
I want to open xls file on IE9 and I use Blob.js but when I createObjectURL from fakeblob and then use window.open(objectURL) it's not work!
It's open new window but display white screen and not open xls file :'(

Here is my objectURL value after created :

data:application/vnd.ms-excel,%C3%AF%C2%BF%C2%BF%11%C3%A0%C2%A1%C2%B1%1A%C3%AF%C2%BF%C2%BF%00%00%00%00%00%00%00%00%00%00%00%00%00%00%3E%00%03%00%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%09%00%06%00%00%00%00%00%00%00%00%00%00%00%01%00%00%00%01%00%00%00%00%00%00%00%00%10%00%00N%00%00%00%01%00%00%00%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%00%00%00%00%00%00%00%00%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3%AF%C2%BF%C2%BF%C3

Here is my code :
$http.get($scope.filePath, { responseType: "arraybuffer" })
.success(function(data) {
var blob = new Blob([data], {type: fileType});
var objectUrl = URL.createObjectURL(blob);
window.open(objectUrl);
}).error(function(data, status) {
$scope.info = "Request failed with status: " + status;
});

How to solve this problem? Help me please :(
Thanks in advance.

Similarly to Android, self is undefined in this context. window is.

But the main issue is that no condition is met in URL.createObjectURL() and it returns undefined in https://github.com/eligrey/Blob.js/blob/master/Blob.js#L85

I don't know if this is worth pursuing as the browser itself is effectively dead code.

Your call.

The convention for bower packages seems to be all lower case letters or dashes. I suggest renaming the bower folder from "Blob.js" to "blobjs."

/node_modules/script-loader/index.js!./src/vendor/Blob.js

rookie and don't know why........maybe need some help.

I'm using formdata-polyfill and blob-polyfill with jQuery v1.12.4 on IE9 in a webpack build.

The request that is sent with a $.ajax call has headers like:

Content-Type	multipart/form-data; boundary=----formdata-polyfill-0.9083965467102468, multipart/form-data; boundary=----formdata-polyfill-0.9083965467102468

From : jimmywarting/FormData#86

As suggested here jimmywarting/FormData#86 (comment) maybe the check can be added here too.

TypeError: Cannot assign to read only property 'Symbol(Symbol.toStringTag)' of object '#'

jsdom implements Blob and URL but not URL.createObjectURL: jsdom/jsdom#1721

Thus the following code prevent createObjectURL to be polyfilled.

	if (view.Blob && view.URL) {
		try {
			new Blob;
			return;
		} catch (e) {}
	}

Could the same thing happens to older browser?

Can I submit a PR?

This cause jspdf not able to run in jsdom

Can I please get some docs showing how to create a Blob?

I created this a long time ago and it's finally becoming real! (at least 3 things of them)
https://github.com/jimmywarting/Screw-FileReader

var blob = Blob.prototype
var fullStreamSupport = false
var basicStreamSupport = false
var fetchTransform = false

function promisify(obj) {
  return new Promise(function(resolve, reject) {
    obj.onload =
    obj.onerror = function(evt) {
      obj.onload =
      obj.onerror = null

      evt.type === 'load'
        ? resolve(obj.result || obj)
        : reject(new Error('Failed to read the blob/file'))
    }
  })
}

try {
  new ReadableStream({})
  basicStreamSupport = true
} catch (e) {}

try {
  new ReadableStream({type: 'bytes'})
  fullStreamSupport = true
} catch (e) {}

try {
  (new Response(new Blob)).getReader()
  fetchTransform = true
} catch (e) {}

if (!blob.arrayBuffer) {
  blob.arrayBuffer = function arrayBuffer() {
    var fr = new FileReader
    fr.readAsArrayBuffer(this)
    return promisify(fr)
  }
}

if (!blob.text) {
  blob.text = function text() {
    var fr = new FileReader
    fr.readAsText(this)
    return promisify(fr)
  }
}

if (!blob.stream) {
  blob.stream =

  fullStreamSupport ? function stream() {
    var position = 0
    var blob = this

    return new ReadableStream({
      type: 'bytes',
      autoAllocateChunkSize: 524288,

      pull: function (controller) {
        var v = controller.byobRequest.view
        var chunk = blob.slice(position, position + v.byteLength)
        return chunk.arrayBuffer()
        .then(function (buffer) {
          var uint8array = new Uint8Array(buffer)
          var bytesRead = uint8array.byteLength

          position += bytesRead
          v.set(uint8array)
            controller.byobRequest.respond(bytesRead)

          if(position >= blob.size)
            controller.close()
        })
      }
    })
  }:

  // basic stream support
  basicStreamSupport ? function stream(blob){
    var position = 0
    var blob = this

    return new ReadableStream({
      pull: function (controller) {
        var chunk = blob.slice(position, position + 524288)

        return chunk.arrayBuffer().then(function (buffer) {
          position += buffer.byteLength
          var uint8array = new Uint8Array(buffer)
          controller.enqueue(uint8array)

          if (position == blob.size)
            controller.close()
        })
      }
    })
  }:

  // fetchTransform
  fetchTransform ? function stream() {
    return (new Response(this)).body
  }:

  function stream() {
    throw new Error('Include https://github.com/creatorrr/web-streams-polyfill')
  }
}

Unclear what self is supposed to be? It seems code is taken from some larger context? Why assigning to self.URL? Why code like real_URL = view.URL || view.webkitURL || view?

When attempting to use Blob.js in Safari for iOS using the Blob constructor results in a "Maximum call stack size exceeded" exception.

Seen on iOS 6.1.3 and 5.1.1

I'm using your project in combination with FileSaver (https://github.com/eligrey/FileSaver.js). However, when I call saveAs() from Chrome 28.0.1500.95 m, I get the error "real_create_object_url is not defined". The codeline throwing the exception turned out to be:

var object_url = get_URL().createObjectURL(blob);

Which invokes the createObjectURL you load in BlobBuilder.js. In order to debug the method you loaded, I loaded the non-minified version, and found that the error doesn't occur in that case. I don't really feel like debugging the minified version, so I'm just notifying you instead, sorry... Perhaps you can think of a good reason what the minification might change. Good luck and thanks in advance :)

I am using FileSaver.js file to do export a grid and having issues with IE9 browser. I was asked to use blob.js and not sure how to use the API. Can someone help me?

Thanks.

I just stumbled over the MSBlobBuilder:

http://msdn.microsoft.com/en-us/library/ie/hh779016%28v=vs.85%29.aspx

How about adding it to the well known BlobBuilder?

Are there any examples of how to use this Blob implementation? I am just trying to create a blob from a base64 image data and then save it using saveAs. Are there any examples or doing something like that?

Hello,

at this point:

IE9 complains that File is not defined.
I agree with IE because FakeBlobBuilder(), that defines File constructor, has not been called yet.

Do I miss something ?

I'm using IE9 to implement a script that creates images from user signatures. The script uses blobs and since I'm using IE9, I'm using Blob.js to get around the IE9 errors. However, I'm getting a script error on the following line:
var type = blob.type, data_URI_header; (Line 86, Character 13)

The error I'm getting is:
SCRIPT5007: Unable to get value of the property 'type': object is null or undefined.

Any help with this would be greatly appreciated.

http://www.w3.org/TR/FileAPI/#close-method

Blob.js is against the conventions in the JS community (should be blob.js). The default "grunt wiredep" task that comes with the angular generator for Yeoman injects the line to load the file with lowercase: "<script src="bower_components/blob/blob.js"></script>". Of course it's a bug in the injection script but it's better to maintain popular conventions.

Blob.arrayBuffer() returns a Uint8Array instead of an ArrayBuffer. This line should have additional '.buffer' after saying 'this._buffer' to return an ArrayBuffer

Hi,
This project does not have any release here in github, which is generally not a good thing.
One cannot reference a specific state of the source code easily (needs git commmit id).
So please create a release for this. However, it should be greater than 0.0.1, I think (see below).

I need to manage the 3rd party modules in our project (which ones get in and out) and it would help much if this Blob.js component would be also npm installable (with a concrete version, that's why I asked for a release).
Most js components create releases and are easily npm installable.
This is an excerpt of 'npm ls' in our project showing the complicated identification of Blob.js version to use:
├─┬ [email protected]
│ ├── [email protected] (git+https://github.com/alferov/Blob.js.git#3e15eecda4c3ca13d65dfd480876947551aecf0c)
│ └── [email protected]
This is why I mentioned above that its first version should be greater than 0.0.1, for clarity.
So please, make this component npm installable (put it in the npm registry, or whatever is needed). For the npm package name, it cannot contain capital letters, so it should be 'blob.js' or 'blobjs', I think.
Thanks in advance!

Seems like Uint8Array constructor is not supported in older browsers such as safari 10 and older. Would be great if the script checked if this constructor exists, and if doesn't exist used just an Array instead of Uint8Array.

Ref: https://caniuse.com/#search=Uint8Array

Hello,
I am having issues with IE9.
I am using "Blob.js" together with "FileSaver.min.js" and it all works great on FF and Chrome, but in IE9 I get the error:
"The data area passed to a system call is too small"

I think that error is related to URL length limitations in IE9. If anyone has a clue on how to solve this I'd appreciate it.
I read up on "Blob.js" and Googled too, and as far as I understand IE9 together with "Blob.js" should work, am I correct?
Thanx

i m trying to do a excel download
these two lines are failing
var u8_2 = new Uint8Array(atob(ByteArray).split("").map(function(c) {
return c.charCodeAt(0);
}));
var blob = new Blob( [ u8_2 ]);

u8_2 was undefined then i used compatibility.js code to fix it ..but then to fix undefined blob issue i m using ur code but i m getting error here

if (Uint8Array && (data instanceof ArrayBuffer || data instanceof Uint8Array)) {
error: Invalid operand to 'instanceof': Function expected

both arraybuffer and uint8array comes as undefined...what changes do i need to do?

https://github.com/apache/cordova-plugin-file/blob/5274cab39e3f96a8682a74ba28663f32611501c8/www/File.js#L37

File.lastModifiedDate is deprecated and also removed in FF & Safari

You should stop supporting it also and remove it (or at least throw a error message saying it's deprecated in a getter method)

There seems to be something wrong with FF's Blob implementation it errors out with "...an attempt was made to use an object that is no longer usable...". To get around this I added a check for FF 14.0.1 and allowed your script to implement Blob.

Android 4.0.3 webview (and maybe also 4.1/2/3, i will verify this)
Have native Blob constructor (what makes the polyfill check to fail)
but its broken.

If you try to do any variation of the constructor
new Blob(), new Blob([]), new Blob([], {..}) etc...

You will get:
TypeError: Illegal constructor exception

If you manually activating the polyfill, its looks like its working

This line appears to be checking if Uint8Array exists:

However my reading of it is that if Uint8Array doesn't exist, the JS runtime would throw an undefined variable error. Did you mean to use typeof?

I'm having trouble using Blob.js...

when I run the following code, everything works fine:

        //downloads the puzzle as a JSON file
        let blob = new Blob([JSON.stringify(puzzle)], {type: "application/json;charset=utf-8"});
        FileSaver.saveAs(blob, `puzzle-${this.state.puzzleName}.json`);

but if I do

        //downloads the puzzle as a JSON file
        let blob = new BlobJS([JSON.stringify(puzzle)], {type: "application/json;charset=utf-8"});
        FileSaver.saveAs(blob, `puzzle-${this.state.puzzleName}.json`);

my webapp crashes and I get the following error, despite the fact that I've imported Blob.js

TypeError: __WEBPACK_IMPORTED_MODULE_2_blob_js___default.a is not a constructor

How am I supposed to use Blob.js? I see that there's lots of links to the Blob documentation in this repo, but obviously I'm missing something because using it like the native Blob doesn't do the same thing...

I am using the latest FileSaver.js with Blob.js to save a canvas to PNG (< 100KB). It work on most browsers except on Mobile Safari on iOS. When the image is larger than a certain size, the following error is thrown:

RangeError: Maximum call stack size exeeded.    (Blob.js:106)
    append    (Blob.js:106)
    Blob    (Blob.js:173)
    toBlob    (canvas-toBlob.js:101)
    ...

The following two snippets are located in the same function:

if (view.Blob && view.URL) {
        try {
            new Blob;
            return;
        } catch (e) {}
    }

view.Blob = function Blob(blobParts, options) {
        var type = options ? (options.type || "") : "";
        var builder = new BlobBuilder();
        if (blobParts) {
            for (var i = 0, len = blobParts.length; i < len; i++) {
                builder.append(blobParts[i]);
            }
        }
        return builder.getBlob(type);
    };

When run through a minification tool (I am using the latest YUI), the first function (which checks for the presence of Blob in the browser) is compressed as:

if(a.Blob&&a.URL){try{new d;return}catch(c){}}

This is correct minification, as further down the file, a named function "Blob" is defined in the local scope (and is minified to the name "d")

Because "new Blob" is minified as "new d", an error will occur regardless of the browser's Blob support, thereby overwriting it with the shim instead of using the native implementation.

You can run an online version of the YUI compressor here:
http://refresh-sf.com/yui/

To fix this issue, change:

view.Blob = function Blob(blobParts, options) {

to:

view.Blob = function (blobParts, options) {

I don't know if this will break anything else though. As far as I can tell it still works when you change this.

The problem is the line:
blobSupported = new Blob (['ä']). size === 2; // Check if Blob constructor supports ArrayBufferViews
Check This and This
If the character encoding is Windows-1250, then blobSupported is FALSE!

When Blob.js is loaded dynamically via JS in Webkit engine (Chrome 33.0), FakeBlob is used instead of internal Blob. To fix the issue just put the following line at the beginning of Blob.js file:

var Blob = Blob || window.Blob;

I got this error while trying to use it on IE 9 for a download file functionality.

ReferenceError: 'Uint8Array' is undefined

A way to read the blob data would be grate, whatever its underlying data is (raw, fakeblob, real blob, arraybuffer, whatever) especially for IE9.

var fakeBlob new Blob([arraybuffer, fakeBlob, "raw text", arraybufferView]);

I think its mandatory that you can read a blob if you can construct one.

var fr = new FileReader();
fr.readAsArrayBuffer(fakeBlob); // require typed array polyfill (not by you, but from the author)
fr.readAsText(fakeBlob);
fr.readAsDataURI(fakeBlob);

Hi,
If the response is byte[] type of zip file by ajax, how to instance Blob please?
The code 'new Blob([fileContents], {type: mimeType})' cannot work. The Blob has no content. The 'fileContents' is the response above.

Any chance of at least basic documentation on this library?
The Blob link on the Readme is also broken.