HTTP headers | Content-Type - GeeksforGeeks

29 Jul, 2021
The Content-Type header is used to indicate the media type of the resource. The media type is a string sent along with the file indicating the format of the file. For example, for image file its media type will be like image/png or image/jpg, etc.
In response, it tells about the type of returned content, to the client. The browser gets to know about the type of content it has to load on the machine. Every time its byte stream of the file that browsers receive, by the Content-type header, the browser will do something known as MIME sniffing i.e. it will inspect the stream it is receiving and then loads the data accordingly.
Syntax:
Content-Type: text/html; charset=UTF-8
Content-Type: multipart/form-data; boundary=something

Directives: There are three directives in the HTTP headers Content-type.
media type: It holds the MIME (Multipurpose Internet Mail Extensions) type of the data.
charset: It holds the character encoding standard. Charset is the encoding standard in which the data will be received by the browsers.
boundary: The boundary directive is required when there is multipart entities. Boundary is for multipart entities consisting of 70 characters from a set of characters known to be very robust through email gateways, and with no white space.
Example: This example display how the images are read by browser with and without setting the Content-type header.
<?php  header('Content-type: image/jpeg');//with header Content type echo file_get_contents("https://media.geeksforgeeks.org/wp-content/uploads/geeksforgeeks-6.png");  ?>
Output :
Now without using Content-type header we will get the content of the image in bytes, So it is not of any use to us.
<?php  // Without headerecho file_get_contents("https://media.geeksforgeeks.org/wp-content/uploads/geeksforgeeks-6.png");?>
Output:
?PNG  IHDRX??'?iCCPsRGB IEC61966-2.1(?u??+DQ??3????????????63??P????H?U????l??RDJV???9oF?
$sn????{N???pZ??^?d?Z(p?E?]??h??QEW?f??T??{, f???????????z?aE??????y???6%]>vkrA?;S?????d??M?
¡?6???`%?????&???Q-Z?j????BSZo?a???}N ?._u {??#??N?g?{-bKGD??????? pHYs.#.#x??vtIME?4_?X 
IDATx??w?U??????MB$??$@@? 2t?"EDa???"? C?*C????Hq?ja??w ????????L{??}?}??w?;??{???{.4, ???j???
q10??_??h2]`P??:^?5??@?W?=????????XY??? w.??9??`z?1?!V??B????XM~^?|?1?qm???(?h??C?OV?js{e?+ 
L?b?{%?@`?+:sQ?@?
Here, it is clearly visible that by applying the Content-type header information tells the browser, the type of response it is getting from the server.
All possible values of HTTP Content-type header:
Supported Browsers: The browsers compatible with HTTP headers Content-type are listed below:
Google Chrome
Internet Explorer
Firefox
Safari
Opera
HTML is the foundation of webpages, is used for webpage development by structuring websites and web apps.You can learn HTML from the ground up by following this HTML Tutorial and HTML Examples.
Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.
HTTP-headers
Picked
HTML
Web Technologies
HTML
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
How to Insert Form Data into Database using PHP ?
REST API (Introduction)
How to position a div at the bottom of its container using CSS?
Design a web page using HTML and CSS
How to Upload Image into Database and Display it using PHP ?
Roadmap to Become a Web Developer in 2022
Installation of Node.js on Linux
How to fetch data from an API in ReactJS ?
Convert a string to an integer in JavaScript
Difference between var, let and const keywords in JavaScript