Content-Type header
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
The HTTPContent-Typerepresentation header is used to indicate the originalmedia type of a resource before any content encoding is applied.
In responses, theContent-Type header informs the client about the media type of the returned data.In requests such asPOST orPUT, the client uses theContent-Type header to specify the type of content being sent to the server.If a server implementation or configuration is strict about content type handling, a415 client error response may be returned.
TheContent-Type header differs fromContent-Encoding in thatContent-Encoding helps the recipient understand how to decode data to its original form.
Note:This value may be ignored if browsers performMIME sniffing (or content sniffing) on responses.To prevent browsers from using MIME sniffing, set theX-Content-Type-Options header value tonosniff.SeeMIME type verification for more details.
| Header type | Representation header |
|---|---|
| Forbidden request header | No |
| CORS-safelisted response header | Yes |
| CORS-safelisted request header | Yes* |
* Values can't contain aCORS-unsafe request header byte:"():<>?@[\]{},, Delete0x7F, and control characters0x00 to0x19 except for Tab0x09.It also needs to have a media type of its parsed value (ignoring parameters) of eitherapplication/x-www-form-urlencoded,multipart/form-data, ortext/plain.
In this article
Syntax
Content-Type: <media-type>
For example:
Content-Type: text/html; charset=utf-8Content-Type: multipart/form-data; boundary=ExampleBoundaryStringDirectives
<media-type>Themedia type of the resource or data.May contain the following parameters:
charset: Indicates thecharacter encoding standard used.The value is case insensitive but lowercase is preferred.boundary: For multipart entities, theboundaryparameter is required.It is used to demarcate the boundaries of the multiple parts of the message.The value consists of 1 to 70 characters (not ending with white space) known to be robust in the context of different systems (e.g., email gateways).Often, the header boundary is prepended by two dashes in the request body, and the final boundary has two dashes appended at the end.
Examples
>Serving assets with correct content type
In the following two example responses, JavaScript and CSS assets are served usingtext/javascript for JavaScript andtext/css for CSS.The correct content type for these resources helps the browser handle them more securely and with better performance.SeeProperly configuring server MIME types for more information.
HTTP/1.1 200content-encoding: brcontent-type: text/javascript; charset=utf-8vary: Accept-Encodingdate: Fri, 21 Jun 2024 14:02:25 GMTcontent-length: 2978const videoPlayer=document.getElementById...HTTP/3 200server: nginxdate: Wed, 24 Jul 2024 16:53:02 GMTcontent-type: text/cssvary: Accept-Encodingcontent-encoding: br.super-container{clear:both;max-width:100%}...Content-Type in multipart forms
In aPOST request resulting from an HTML form submission, theContent-Type of the request is specified by theenctype attribute on the<form> element.
<form action="/foo" method="post" enctype="multipart/form-data"> <input type="text" name="description" value="Description input value" /> <input type="file" name="myFile" /> <button type="submit">Submit</button></form>The request looks something like the following example with some headers omitted for brevity.In the request, a boundary ofExampleBoundaryString is used for illustration, but in practice, a browser would create a string more like this---------------------------1003363413119651595289485765.
POST /foo HTTP/1.1Content-Length: 68137Content-Type: multipart/form-data; boundary=ExampleBoundaryString--ExampleBoundaryStringContent-Disposition: form-data; name="description"Description input value--ExampleBoundaryStringContent-Disposition: form-data; name="myFile"; filename="foo.txt"Content-Type: text/plain[content of the file foo.txt chosen by the user]--ExampleBoundaryString--Content-Type in URL-encoded form submission
When forms don't involve file uploads and are using simpler fields, URL-encoded forms may be more convenient where the form data is included in the request body:
<form action="/submit" method="post"> <label for="comment">Comment:</label> <input type="text" name="comment" value="Hello!" /> <button type="submit">Submit</button></form>POST /submit HTTP/1.1Host: example.comContent-Type: application/x-www-form-urlencodedContent-Length: 15comment=Hello!Content-Type in a REST API using JSON
ManyREST APIs useapplication/json as a content type which is convenient for machine-to-machine communication or programmatic interaction.The following example shows a201 Created response showing the result of a successful request:
HTTP/1.1 201 CreatedContent-Type: application/json{ "message": "New user created", "user": { "id": 123, "firstName": "Paul", "lastName": "Klee", "email": "p.klee@example.com" }}Specifications
| Specification |
|---|
| HTTP Semantics> # status.206> |
| HTTP Semantics> # field.content-type> |