x-content-type-options
requires that all resources are
served with the X-Content-Type-Options: nosniff
HTTP response header.
Why is this important?
Sometimes the metadata browsers need to know how to interpret the
content of a resource is either incorrect, not reliable, or absent.
In those cases, browsers use contextual clues that inspect the bytes
of the response to detect the file format. This is known as MIME
sniffing and it is done regardless of the specified
Content-Type
HTTP header sent by servers.
For example, if a browser requests a script, but that script is served
with an incorrect media type (e.g. x/x
), the browser will still detect
the script and execute it.
While content sniffing can be beneficial, it can also expose the web
site/app to attacks based on MIME-type confusion leading to security
problems, especially in the case of servers hosting untrusted content.
Fortunately, browsers provide a way to opt-out of MIME sniffing by
using the X-Content-Type-Options: nosniff
HTTP response header.
Going back to the previous example, if the X-Content-Type-Options: nosniff
header is sent for the script and the browser detects that it’s a script
and it wasn’t served with one of the JavaScript media types, the script will be blocked.
While modern browsers respect the header mainly for scripts and
stylesheets, Chromium uses this response header on
other resources for
Cross-Origin Read Blocking.
What does the hint check?
The hint checks if all resources are served with the
X-Content-Type-Options
HTTP headers with the value of nosniff
.
Examples that trigger the hint
Resource is not served with the
X-Content-Type-Options
HTTP header.
HTTP/... 200 OK
...
Content-Type: image/png
Script is served with the X-Content-Type-Options
HTTP header
with the invalid value of no-sniff
.
HTTP/... 200 OK
...
Content-Type: text/javascript; charset=utf-8
X-Content-Type-Options: no-sniff
Examples that pass the hint
Script is served with the X-Content-Type-Options
HTTP header
with the valid value of nosniff
.
HTTP/... 200 OK
...
Content-Type: text/javascript; charset=utf-8
X-Content-Type-Options: nosniff
How to configure the server to pass this hint
How to configure Apache
Apache can be configured to add headers using the Header
directive.
<IfModule mod_headers.c>
Header always set X-Content-Type-Options nosniff
</IfModule>
Note that:
-
The above snippet works with Apache v2.2.0+
, but you need to have
mod_headers
enabled
for it to take effect.
-
If you have access to the main Apache configuration file (usually called httpd.conf
), you should add
the logic in, for example, a <Directory>
section in that file. This is usually the recommended way as
using .htaccess
files slows down Apache!
If you don't have access to the main configuration file (quite
common with hosting services), add the snippets in a .htaccess
file in the root of the web site/app.
For the complete set of configurations, not just for this rule, see
the Apache server configuration related documentation.
How to configure IIS
You can add this header unconditionally to all responses.
<configuration>
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="X-Content-Type-Options" value="nosniff" />
</customHeaders>
</httpProtocol>
</system.webServer>
</configuration>
Note that:
- The above snippet works with IIS 7+.
- You should use the above snippet in the
web.config
of your
application.
For the complete set of configurations, not just for this rule,
see the IIS server configuration related documentation.
How to use this hint?
This package is installed automatically by webhint:
npm install hint --save-dev
To use it, activate it via the .hintrc
configuration file:
{
"connector": {...},
"formatters": [...],
"hints": {
"x-content-type-options": "error",
...
},
"parsers": [...],
...
}
Note: The recommended way of running webhint is as a devDependency
of
your project.
Further Reading