Question

收到客户的请求后，我使用jsreport核心生成pdf，然后将文件发送到客户端：

  res.setHeader('Content-Type', 'application/pdf');
  res.setHeader('Content-Disposition', 'attachment; filename=test.pdf');
  jsreport.render(form).then(response => response.stream.pipe(res));

现在我想在客户端下载文件，方法是从请求中获取结果字符串并将其转换为blob，然后将blob转换为URL，我得到的结果文件是否为空，我相信这是因为从pdf字符串生成的结果url太长了...是否有任何建议使用javascript在浏览器中下载生成的文件？

Answer 1

从客户端/前端代码中，您需要通过执行基于表单的发布请求来调用jsreport服务器，这是浏览器启动下载对话框所需的。

您可以将此实用程序代码（taken from the jsreport browser sdk source code）放在您自己的代码中。

function download (serverUrl, filename, request) {
  var requestValues = Object.assign({}, request)

  requestValues.options = requestValues.options || {}
  requestValues.options['Content-Disposition'] = 'attachment;filename=' + filename

  return render(serverUrl, requestValues)
}

function render (serverUrl, request) {
  var frameName = placeholder || '_blank'
  var mapForm = document.createElement('form')
  mapForm.target = frameName
  mapForm.id = new Date().getTime()
  mapForm.method = 'POST'
  mapForm.action = serverUrl

  function addInput (form, name, value) {
    var input = document.createElement('input')
    input.type = 'hidden'
    input.name = name
    input.value = value
    form.appendChild(input)
  }

  function addBody (path, body) {
    if (body === undefined) {
      return
    }

    for (var key in body) {
      if (isObject(body[key])) {
        // somehow it skips empty array for template.scripts, this condition fixes that
        if (body[key] instanceof Array && body[key].length === 0) {
          addInput(mapForm, path + '[' + key + ']', [])
        }
        addBody(path + '[' + key + ']', body[key])
      } else {
        if (body[key] !== undefined && !(body[key] instanceof Array)) {
          addInput(mapForm, path + '[' + key + ']', body[key])
        }
      }
    }
  }

  addBody('template', request.template)

  if (request.options != null) {
    addBody('options', request.options)
  }

  if (request.data) {
    addBody('data', request.data)
  }

  var headers = {}
  headers['host-cookie'] = document.cookie
  addBody('headers', headers)

  document.body.appendChild(mapForm)

  function submit (i) {
    if (i > 10) {
      return console.log('Unable to submit render form.')
    }
    try {
      mapForm.submit()
      mapForm.outerHTML = ''
    } catch (e) {
      setTimeout(function () {
        submit(i + 1)
      }, 50)
    }
  }

  submit(0)
}

然后像这样使用它（当然你需要将http://localhost:5488/your-report-route更新到服务器工作的真实网址。

download('http://localhost:5488/your-report-route', 'newfile.pdf', {
  template: {
    // your options here
  },
  data: {
    // your data here
  }
})

如何下载jsreports-core生成的大文件

1 个答案: