javascript - Descargar Excel en Backbone.js

Question

  //Download SKU logic
  downloadSku: function (e) {
    e.preventDefault();
    var checkedValues = this.$el.find(''.chk:checked'').map(function () {
      return this.value;
    }).get();
    var options = {
      success: function (model, response) {
        console.log(response);
        var blob = new Blob([response], { type: ''application/vnd.ms-excel'' });

        var downloadUrl = URL.createObjectURL(blob);
        var a = document.createElement("a");
        a.href = downloadUrl;
        a.download = "downloadFile.xlsx";
        document.body.appendChild(a);
        a.click();
      }
    };
    var obj = {};
    obj["sku_ids"] = checkedValues;
    this.downloadSkuModel.set(obj, { validate: true });
    this.downloadSkuModel.save({}, options);

  }

services.js

    var services = {

    sync: function (method, model, options) {
        var self = this;
        var api_token = mainJs.get_api_token();
        var access_token;
        if (api_token == null) {
            access_token = api_token;

        } else {
            access_token = api_token.access_token;
        }

        options || (options = {});

        var beforeSend = options.beforeSend;
        options.beforeSend = function (xhr) {
            xhr.setRequestHeader(''Authorization'', ''Bearer '' + access_token)
            if (beforeSend) return beforeSend.apply(this, arguments);
        };

        switch (method) {
            case "read":
                options.url = options.readUrl;
                break;
            case "delete":
                options.url = options.deleteUrl;
                break;
            case "update":
                options.url = options.updateUrl;
                options.contentType = ''application/json'';
                break;
            case "create":
                options.url = options.createUrl;
                options.contentType = ''application/json'';
                break;
        }

        options.error = function (xhr, statusTxt, thrown) {
            switch (xhr.status) {
                case 401:
                    console.log("Unauthorized error");
                    break;
                default:
                    var messageText = JSON.parse(xhr.responseText);;
                    console.log("Status code: " + xhr.status + " Error: " + messageText.message);
            }

        }

        if (options.url)
            return Backbone.sync.call(model, method, model, options);

    }

}


module.exports = services;

Mis encabezados de respuesta:

  HTTP/1.1 200 OK
Server: Apache-Coyote/1.1
Access-Control-Allow-Origin: *
X-Content-Type-Options: nosniff
X-XSS-Protection: 1; mode=block
Cache-Control: no-cache, no-store, max-age=0, must-revalidate
Pragma: no-cache
Expires: 0
Strict-Transport-Security: max-age=31536000 ; includeSubDomains
X-Frame-Options: DENY
Content-Disposition: attachment;filename=sku_list.xlsx
Content-Type: application/octet-stream;charset=UTF-8
Transfer-Encoding: chunked
Date: Tue, 15 Sep 2015 14:56:58 GMT

Recibo una respuesta del servidor pero no aparece en la Vista.

Si uso Javascript en mi opinión, funciona:

 var obj = {};
    obj["sku_ids"] = checkedValues;
    var xhr = new XMLHttpRequest();
    xhr.open(''POST'', Urls.sku.download, true);
    xhr.responseType = ''blob'';

    xhr.setRequestHeader("Authorization", "Bearer " + "somethign");
    xhr.setRequestHeader(''Content-type'', ''application/json; charset=utf-8'');
    xhr.onload = function (e) {
      if (this.status == 200) {
        var blob = new Blob([this.response], { type: ''application/vnd.ms-excel'' });
        var downloadUrl = URL.createObjectURL(blob);
        var a = document.createElement("a");
        a.href = downloadUrl;
        a.download = "downloadSku.xlsx";
        a.setAttribute("data-bypass", "");
        document.body.appendChild(a);
        a.click();
      } else {
        alert(''Unable to download excel.'')
      }
    };
    xhr.send(JSON.stringify(obj));

El error que obtengo con la red troncal es el siguiente:

SyntaxError: Unexpected token P at Object.parse (native) at K.parseJSON 

Answer 1

Resolví mi problema:

Esto es lo que hice

Cambié mis options.dataType = ''text'' porque por defecto la backbone estaba asumiendo que era una respuesta json y estaba haciendo un Object.parse