I'd like to open Blob object in a browser window.
This code works everywhere but iOS Chrome (and IE of course but I can solve IE). The window is not redirected to the url (which is correct or at least the same as in other browsers). Is there any known workaround for Chrome iOS?
var blob = new window.Blob(['Hello, world!'], {type: 'text/plain;charset=utf-8'}); window.URL = window.URL || window.webkitURL; var url = window.URL.createObjectURL(blob); window.location.href = url;
I've tried <a href="{blobUrl}>
instead of window.location.href
but it doesn't work either.
Right-click on the webpage and click “Inspect” in the menu. When the DevTools panel opens, click on the three vertical dots in the top-right corner and select “Undock into a separate window.” Press Ctrl + F on Windows or Cmd + F on Mac devices to find the blob URL. Enter “ blob:HTTP ” to find the link for the video.
If you cannot open your BLOB file correctly, try to right-click or long-press the file. Then click "Open with" and choose an application. You can also display a BLOB file directly in the browser: Just drag the file onto this browser window and drop it.
Also you can use some another page like /loading , with loading indicator. Then you need to wait newWindow loading, and you can push url of your blob file in this window: newWindow. onload = () => { newWindow.
No, Blob URLs/Object URLs can only be made internally in the browser. You can make Blobs and get File object via the File Reader API, although BLOB just means Binary Large OBject and is stored as byte-arrays. A client can request the data to be sent as either ArrayBuffer or as a Blob.
FileReader solved my problem.
var reader = new FileReader(); var out = new Blob([this.response], {type: 'application/pdf'}); reader.onload = function(e){ window.location.href = reader.result; } reader.readAsDataURL(out);
FileReader.readAsBinaryString method has been deprecated.
Bit late, but I had todo something similar using the FileReader.readAsDataURL - which produces a dataUrl. I'm using AngularJS $http service to call the API to create a pdf. Hope this helps, see below:
$http.post('/api/pdf', {id: '123'}, {responseType: 'arraybuffer'}) .success(function (response) { var blob = new Blob([response.data], {type: 'application/pdf'}); var reader = new FileReader(); reader.onloadend = function(e) { $window.open(reader.result); } reader.readAsDataURL(blob); });
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With