web-dev-qa-db-fra.com

Conversion de ArrayBuffer en blob

J'ai un projet où j'ai besoin d'afficher les schémas Djvu dans le navigateur.

J'ai trouvé ce vieux bibliothèque sur Github qui, autant que je sache, convertit les fichiers djvu en bmp puis les met dans un élément canvas.

Comme je l’ai dit, la bibliothèque est ancienne (le dernier engagement remonte à 5 ans), je dois donc apporter quelques corrections. Le problème principal est que lib utilise BlobBuilder obsolète.

Les étapes que j'ai faites pour résoudre ce problème:

  1. Décompressez cette bibliothèque via Chrome DevTools
  2. L'erreur initiale est à la ligne 3774 var c = "undefined" != typeof MozBlobBuilder ? MozBlobBuilder : "undefined" != typeof WebKitBlobBuilder ? WebKitBlobBuilder : console.log("warning: cannot build blobs")
  3. J'ai commenté cette ligne
  4. Ensuite, j'ai commenté la ligne c = new c; et quelques unes des lignes suivantes aussi.

Donc, maintenant, cela ressemble à ça (la variable I est un tampon de tableau, et ololo1 et ololo2 sont une sorte de décalage et de limite)

var c = new Blob(new Uint8Array(new Uint8Array(I,ololo1,ololo2)))
              , b = b.createObjectURL(c)
              , c = document.getElementById(kb)
              , f = c.getContext("2d")
              , h = new Image
              , g = a[Ea >> 2]
              , i = a[Fa >> 2]
              , j = c.width
              , k = Math.round(i * j / g);

            h.onload = function()
            {
                var a = g / j;
                4 < a && (a = 4);
                1 > a && (a = 1);
                f.globalAlpha = 1;

                for (N = 0; N < a; N++)
                    f.drawImage(h, N, N, g - a + N, i - a + N, 0, 0, j, k),
                    f.globalAlpha *= 1 - 1 / a;
                R(h.complete, "Image /bmp.bmp could not be decoded")
            }
            ;
            h.onerror = function(errorMsg, url, lineNumber, column, errorObj) {
                console.log(errorMsg, url, lineNumber, column, errorObj);
                console.log("Image /bmp.bmp could not be decoded!")
            }           
            ;

Et maintenant je suis bloqué à l'erreur "Image/bmp.bmp n'a pas pu être décodé!" (Jeté dans le gestionnaire h.onerror).

Donc, ma question est: qu'est-ce que je fais mal?

17
Rulisp

Je ne sais pas pourquoi l'auteur a enveloppé son Uint8Array dans une nouvelle ... notez que je ne connais pas non plus l'API BlobBuilder, mais une erreur de frappe que je peux voir dans votre code est la nécessité d'envelopper votre TypedArray dans un tableau normal:

new Blob([new Uint8Array(buffer, byteOffset, length)]);

Le constructeur Blob prend comme premier paramètre séquence de blobParts , puis recherche BufferSource , USVStrings et Blob éléments de cette séquence. Ainsi, lorsque vous passez un TypedArray , il va en fait parcourir toutes les entrées de ce TypedArray et traitez-les comme USVString (et convertissez ainsi leur valeur numérique en chaînes UTF-8 dans Blob ). C'est rarement ce que vous voulez, il est donc préférable de toujours passer un Array dans ce constructeur.

57
Kaiido
var buffer = new ArrayBuffer(32);

new Blob([buffer]);

donc le Uint8Array devrait être

new Blob([new Uint8Array([1, 2, 3, 4]).buffer]);
0
xsilen T