Question

我正在尝试将从后端提供的PDF和JPG文件显示到用户Web浏览器内的新标签页。下面的代码非常适合PDF文件（在新标签页中打开它们并具有可调整的大小），但是它会自动下载JPG文件。

我已经研究过将图像嵌入并使其全屏显示在新选项卡中，以及一些反应包，但我很好奇是否有更好的方法

openFile(file) {
  var url = url/path/to/backend/request;
  window.open(url, this.state.song.Title)
}

如何强制JPG文件像PDF文件一样显示在新标签中？

Answer 1

window.open应该可以正常工作，如果下载了文件，请检查网址的响应标题Content-Type是否正确设置，应该为image/jpeg或image/png，等等，这取决于您的图像格式。

您可以在终端中使用curl或使用chrome开发工具找到它。如果您使用curl，请尝试运行curl -I -X GET "your image url"来查找响应头。您应该得到如下输出：

HTTP/2 200
server: nginx/1.12.2
date: Sun, 14 Jul 2019 16:26:25 GMT
content-type: image/svg+xml
content-length: 5501

Answer 2

例如，window.open()是执行此操作的一种卑鄙方法：它绕过常规的浏览器导航系统，因此您真的想用a构建一个target="_blank"，在尊重用户的同时也会做同样的事情。

（将其样式设置为display:none，请记住将其添加到文档中，然后调用a.click（），然后再次将其删除）

也就是说，浏览器根据mime类型决定是显示还是下载，因此请确保您的服务器以您希望用户在浏览器中看到而不是下载的文件的适当mime类型响应（例如，用application/octet-stream）发送图片