javascript - new - Blob PDF: la ventana emergente no muestra contenido

window.download javascript

Question

He estado trabajando en este problema durante los últimos días. Sin suerte al tratar de mostrar la transmisión en la etiqueta <embed src> , intenté mostrarla en una nueva ventana.

La nueva ventana solo muestra controles de PDF )

¿Alguna idea de por qué no se muestra el contenido del pdf?

CÓDIGO:

$http.post(''/fetchBlobURL'',{myParams}).success(function (data) {
    var file = new Blob([data], {type: ''application/pdf''});
    var fileURL = URL.createObjectURL(file);
    window.open(fileURL);
});

Answer 1

Si configura { responseType: ''blob'' } , no necesita crear Blob por su cuenta. Simplemente puede crear url basado en contenido de respuesta:

$http({
    url: "...",
    method: "POST",
    responseType: "blob"
}).then(function(response) {
    var fileURL = URL.createObjectURL(response.data);
    window.open(fileURL);
});

Answer 2

Yo uso AngularJS v1.3.4

HTML:

<button ng-click="downloadPdf()" class="btn btn-primary">download PDF</button>

Controlador JS:

''use strict'';
angular.module(''xxxxxxxxApp'')
    .controller(''MathController'', function ($scope, MathServicePDF) {
        $scope.downloadPdf = function () {
            var fileName = "test.pdf";
            var a = document.createElement("a");
            document.body.appendChild(a);
            MathServicePDF.downloadPdf().then(function (result) {
                var file = new Blob([result.data], {type: ''application/pdf''});
                var fileURL = window.URL.createObjectURL(file);
                a.href = fileURL;
                a.download = fileName;
                a.click();
            });
        };
});

Servicios de JS:

angular.module(''xxxxxxxxApp'')
    .factory(''MathServicePDF'', function ($http) {
        return {
            downloadPdf: function () {
            return $http.get(''api/downloadPDF'', { responseType: ''arraybuffer'' }).then(function (response) {
                return response;
            });
        }
    };
});

Servicios web de Java REST - Spring MVC:

@RequestMapping(value = "/downloadPDF", method = RequestMethod.GET, produces = "application/pdf")
    public ResponseEntity<byte[]> getPDF() {
        FileInputStream fileStream;
        try {
            fileStream = new FileInputStream(new File("C://xxxxx//xxxxxx//test.pdf"));
            byte[] contents = IOUtils.toByteArray(fileStream);
            HttpHeaders headers = new HttpHeaders();
            headers.setContentType(MediaType.parseMediaType("application/pdf"));
            String filename = "test.pdf";
            headers.setContentDispositionFormData(filename, filename);
            ResponseEntity<byte[]> response = new ResponseEntity<byte[]>(contents, headers, HttpStatus.OK);
            return response;
        } catch (FileNotFoundException e) {
           System.err.println(e);
        } catch (IOException e) {
            System.err.println(e);
        }
        return null;
    }

Answer 3

arraybuffer configurar responseType a arraybuffer si desea crear un blob partir de sus datos de respuesta:

$http.post(''/fetchBlobURL'',{myParams}, {responseType: ''arraybuffer''})
   .success(function (data) {
       var file = new Blob([data], {type: ''application/pdf''});
       var fileURL = URL.createObjectURL(file);
       window.open(fileURL);
});

más información: Sending_and_Receiving_Binary_Data