Correct headers, but Chrome says "Resource interpreted as Document"

javascript node.js google-chrome express node-archiver
dodov picture dodov · Jun 16, 2017 · Viewed 12.3k times · Source

I read a lot of questions like this one, but I really can't figure it out...

I use the archiver and express Node.js modules. I want to simply send a zip file to the client. My code looks roughly like this:

res.set("Content-Type", "application/zip");
archive = archiver("zip", {store: true});
archive.pipe(res);

When requested, the zip file is transferred correctly, but Chrome complains:

Resource interpreted as Document but transferred with MIME type application/zip

If I do something stupid like setting the content type to text/json, I get:

Resource interpreted as Document but transferred with MIME type text/json

So apparently what I'm setting in Node.js is doing its job and something else is the problem. It says the resource was transferred with MIME type applicatioin/zip, but interpreted as Document.

How do I make it not interpret as Document?

Also, I tried these ways of setting the content type:

res.type("application/zip");
res.contentType("application/zip");

But I got the same result.

Mozilla, on the other hand, doesn't complain about anything. Some answers to similar questions said this warning can be ignored. Should I ignore it too? Could the problem be that the archive is piping directly to the response object? Although (I repeat), the zip is sent successfully.

Edit:

Setting Content-Disposition doesn't work too:

res.set({
    "Content-Type": "application/zip",
    "Content-Disposition": "attachment; filename='images.zip'"
});

I also use an <iframe> to initiate the request:

document.getElementById("iframe-downloader").src = requestUrl;

The reason is because I don't want page redirects. The only way I could manage to do it was this way.

Edit:

Changing my Chrome settings how this answer points out doesn't work as well.

Edit:

This answer says it's because of the <iframe>. If I make the request through a simple <form> with action="/archive", it still doesn't work.

Answer

Halcyon picture Halcyon · Jun 16, 2017

I think that means Chrome is trying to display the file as a webpage, which is not what you wanted.

Add the header: Content-Disposition: attachment; filename="filename.ext"

Related questions

Origin <origin> is not allowed by Access-Control-Allow-Origin

XMLHttpRequest cannot load http://localhost:8080/api/test. Origin http://localhost:3000 is not allowed by Access-Control-Allow-Origin. I read about cross domain ajax requests, and understand the underlying security issue. In my case, 2 servers are running locally, and like to enable cross …

Read More
require is not defined? Node.js

Just started working with Node.js. In my app/js file, I am doing something like this: app.js var http = require('http'); http.createServer(function (request, response) { response.writeHead(200, {'Content-Type': 'text/plain'}); response.end('Am I really running a …

Read More
Copying an array of objects into another array in javascript (Deep Copy)

Copying an array of objects into another array in javascript using slice(0) and concat() doesnt work. I have tried the following to test if i get the expected behaviour of deep copy using this. But the original array is also …

Read More