在react SPA生产应用程序中设置window.location.href会产生意外结果

Question

我在Windows Server 2016上的IIS 2016后端上有一个react 16.8.5 SPA。在应用程序中，用户可以下载CSV报告。为此，window.location.href设置为生成报告的Web API的URL。例如：

window.location.href = 'api/generatereport'

API返回带有text/csv内容类型的响应。这在我们的开发和测试环境中完美运行（文件已下载），但在生产环境中失败。在生产环境中，不是从API返回CSV内容，而是返回看起来像index.html一样可疑的HTML。请注意，我检查了IIS日志，因此我知道请求永远不会那么远。这似乎是一个客户问题。另请注意，生产环境使用https - 其他人使用http。

是否有任何关于生产环境中可能会有什么变化的想法会导致此请求被错误地路由，并且仅在一个环境中？大多数时候我一直在寻找最好的猜测或预感。

Answer 1

这是一个服务工作者问题。见removal of service-worker from reactjs app -nightmare for beginner...

Answer 2

设置CSV文件的位置时，请尝试强制指定MIME类型作为URL的一部分，以便React不会假定它正在尝试在React框架内加载另一个页面。

即：

const target: string = window.location.origin + "/api/generatereport";
window.location.href = "data:text/csv;charset=utf-8," + target;

这将导致CSV文件作为单独的窗口打开，并强制浏览器提示将CSV流作为文件下载。

注意：这种方法有file size limitations。