Search code examples
htmlfileiframebootstrap-4changelog

How to display the contents of a file on an HTML page?

I created a CHANGELOG.md file at the root of my site and I display it in a Modal window using in Iframe :

<iframe src="/CHANGELOG.md" frameborder="0" height="100%" width="100%"></iframe>

How to prevent the downloading of the text file in an iframe ?

On FireFox the file is downloaded. On Chrome it is not downloaded, but I have this warning in the console :

Resource interpreted as Document but transferred with MIME type text/markdown: "https://www.example.fr/CHANGELOG.md".

enter image description here

The contents of the file are displayed well, but why is the file downloaded to some web browser ?

I've been on this little problem for days and have no solution.

Solution

  • HTTP responses come with a Content-Type header to tell the client what sort of data is in the response.

    A properly configured server will say that a Markdown URL is of type text/markdown while an HTML URL is of type text/html.

    When the browser gets the response, it determines how to handle it. Typically it will render resources inline if they are types it understands (so all browsers will support HTML documents) and download ones that it doesn't have built-in support for.

    Sometimes a browser will content-sniff the file, decide that the content-type is wrong, and treat it differently.

    Chrome is (incorrectly) doing that, while Firefox isn't.

    The solution is to present the data in a format that browsers do understand.

    For Markdown the two obvious options are:

    • Reconfigure the server to lie about what type of file it is and pretend it is text/plain. (You could also do this by renaming the file to .txt)
    • Convert the file to a format that is supported (e.g. HTML). You could write a server side program to do this automatically.