Question

我尝试了无数不同的函数调用，但似乎无法弄清楚如何在EmberJs中触发CSV的下载。

这是我最新的代码：

let endpoint = '/api/foo/';
let options = {
    url: endpoint,
    type: 'POST',
    data: {},
    dataType: 'text'
};
return new Ember.RSVP.Promise((resolve, reject) => {
  options.success = function(result) {
      var uri = 'data:application/csv;charset=UTF-8,' + encodeURIComponent(result);
      window.open(uri, 'foo.csv');
  };
  options.error = (xhr, errorThrown) => {
    console.log('error');
    // return Ember.run(null, reject, this.didError(xhr, xhr.status, xhr.responseJSON, 1));
  };
  Ember.$.ajax(options);
});

此代码不会引发任何服务器端或客户端错误。它获得了200回复。没有javascript错误，也没有控制台记录任何东西，所以我知道它没有碰到错误块。但是......它不会在客户端上触发文件下载。有谁知道缺少什么？

Answer 1

我无法对此进行测试，但我相信您的问题是返回new承诺，而您真正想要的是返回承诺本身。

所以将代码更改为：

let endpoint = '/api/foo/';
let options = {
    url: endpoint,
    type: 'POST',
    data: {},
    dataType: 'text'
};
return Ember.RSVP.Promise((resolve, reject) => {  // note the deletion of new
  options.success = function(result) {
      var uri = 'data:application/csv;charset=UTF-8,' + encodeURIComponent(result);
      window.open(uri, 'foo.csv');
  };
  options.error = (xhr, errorThrown) => {
    console.log('error');
    // return Ember.run(null, reject, this.didError(xhr, xhr.status, xhr.responseJSON, 1));
  };
  Ember.$.ajax(options);
});

Answer 2

在实现类似的功能时，我选择了不同的路线。我创建一个表单并将其提交给服务器，而不是创建一个AJAX请求。然后，我的API端点将在响应中返回CSV，并使用相应的Content-Disposition标头，浏览器将只下载该文件。

（根据您的身份验证方案，您可能必须在表单数据中包含身份验证令牌）。

以下示例代码。您将看到我添加了身份验证令牌。表单的操作URL在页面的标记中设置，但如果您愿意，可以在此处动态设置。

csvDownload () {
    let form = Ember.$('#csvdownloadform')
    let input = Ember.$('#csvdownloadtoken')
    input.val(this.get('session').get('session.content.authenticated.token'))
    form.submit()
    input.val('')
    form_func.val('')
},

在EmberJs中下载CSV文件

2 个答案: