从 ReactJS 发送模板 API 到 JSReport

Question

jsreport 的 Node.js 客户端在 node.js 或 vanilla 上运行良好，但是，当使用 React 实现它时，我会遇到各种库错误，这些错误在代码直接在节点中运行时不会出现。我如何将它与 React 一起使用？

const client = require("jsreport-client")("http://localhost:5488/");

const data = {
  template: {
    shortid: "2_Kw0BRuOm",
    recipe: "html-to-xlsx",
    data: {
      people: [{ name: "Omar rafat", age: "20", job: "Software Engineer" }],
    },
  },
};

async function render() {
  const res = await client.render(data);
  const responseBuffer = await res.body();

  const fileURL = URL.createObjectURL(responseBuffer);
  window.open(fileURL);
}


class App extends React.Component {
  myfun = () => {
    render().catch(console.error);
  };

  render() {
    return (
      <div className="App">
        <button
          onClick={() => {
            this.myfun();
          }}
        >
          Click me
        </button>
      </div>
    );
  }
}

export default App;

缓冲响应之后的部分应该是

await fs.writeFile("out.xlsx", responseBuffer);

然而，在 React 的情况下，将文件输出到服务器的文件系统并不是我想要的，但是由于下面的错误，我仍然不知道如何处理从浏览器下载 jsreport 响应.

我在实例化请求后得到的错误是

和行

const res = await client.render(data);

似乎是触发它的原因。

Answer 1

jsreport 为基于浏览器的应用程序提供不同的客户端。 https://jsreport.net/learn/browser-client

npm install jsreport-browser-client-dist

jsreport.renderAsync(request).then(function(res) {
  //open in new window
  window.open(res.toDataURI())

  //get the content as string
  res.toString()

  //open download dialog
  res.download('test.pdf') 
});

从 ReactJS 发送模板 API 到 JSReport

Sending template API to JSReport from ReactJS

javascript

report

node.js

reactjs

jsreport