Content-Type and Accept Headers

`Content-Type` describes the media type of the message body being sent, while `Accept` tells the server which response media types the client can handle. Understanding the distinction is essential when using `fetch` with JSON APIs and other HTTP endpoints.

`Content-Type` describes the representation contained in an HTTP message body. For example, `Content-Type: application/json` says that the request body is JSON. When sending JSON with `fetch`, the body is commonly produced with `JSON.stringify()` and the header is explicitly set to `application/json`.

`Accept` describes the response representations the client prefers or can process. For example, `Accept: application/json` asks the server for a JSON response. Unlike `Content-Type`, `Accept` does not describe the format of the request body.

The two headers can therefore appear together on a request. A frontend might send JSON in the request and ask for JSON back: `Content-Type: application/json` and `Accept: application/json`. The server uses the first to interpret the request body and the second when selecting an appropriate response representation.

These headers are related to HTTP media types, sometimes called MIME types. Common values include `application/json`, `text/html`, `text/plain`, and `application/xml`. A server may reject an unsupported request body with a status such as `415 Unsupported Media Type`, while inability to provide an acceptable response representation can result in `406 Not Acceptable`. Exact behavior depends on the server.

Key points

• `Content-Type` describes the format of the message body.
• `Accept` describes response formats the client can handle.
• A JSON request commonly uses `Content-Type: application/json`.
• `Accept: application/json` asks for a JSON representation in the response.
• They describe different directions: request/body format versus desired response format.

Interview questions

What is the difference between `Content-Type` and `Accept`?

`Content-Type` tells the receiver what media type is contained in the message body. `Accept` tells the server which response media types the client can process. For a JSON API request, I might send `Content-Type: application/json` and `Accept: application/json`. The response then has its own `Content-Type` describing the representation actually returned.

How would you send JSON with `fetch()`?

I would serialize the JavaScript value with `JSON.stringify()`. I would set `Content-Type` to `application/json` so the server knows how to parse the body. If I want JSON in the response, I would also send `Accept: application/json`. I would then inspect the response according to the API contract, such as calling `response.json()` for a JSON response.

What happens if the request's `Content-Type` is wrong?

The server may parse the body incorrectly or reject the request because it does not match the declared representation. For example, declaring `application/json` while sending malformed or non-JSON data creates a mismatch between metadata and content. Servers can respond with `415 Unsupported Media Type` when the request representation uses an unsupported media type. The precise behavior is API-specific.

Can a request have both `Content-Type` and `Accept`?

Yes, and this is common for APIs. `Content-Type` can identify the request body as JSON, while `Accept` can request JSON in the response. They are independent headers because the request body and response body can use different representations. For example, a client could send JSON and request a different supported response representation.