Content-Type

Content-Type is an HTTP header that identifies the media type of the data contained in the request or response body.

Content-Type: application/json

This tells the receiving application that the body contains JSON.

The server needs to know how to interpret the data it receives. Content-Type provides this information.

For example:

Content-Type: application/json

The server knows that the request body should be interpreted as JSON data.

Content-Type is commonly used together with a request body.

POST /api/students

Content-Type: application/json

{
    "name": "Rahul",
    "course": "React Native"
}

The header describes the format of the body below it.

application/json is the media type commonly used when sending JSON data.

Content-Type: application/json

This is one of the most important Content-Type values when building REST APIs for React Native applications.

POST /api/students
Content-Type: application/json

{
    "name": "Rahul",
    "email": "rahul@example.com",
    "course": "React Native"
}

The server can identify the request body as JSON because of the Content-Type header.

When using Fetch to send JSON, the Content-Type header can be specified inside the headers object.

const response = await fetch(
    "https://example.com/api/students",
    {
        method: "POST",

        headers: {
            "Content-Type": "application/json"
        },

        body: JSON.stringify({
            name: "Rahul",
            course: "React Native"
        })
    }
);

Axios can send JSON data in a POST request.

const response = await axios.post(
    "https://example.com/api/students",
    {
        name: "Rahul",
        course: "React Native"
    }
);

Axios commonly handles the appropriate JSON content type when sending a JavaScript object, although headers can also be configured explicitly.

The Content-Type header can also be explicitly specified in Axios.

const response = await axios.post(
    "https://example.com/api/students",

    {
        name: "Rahul",
        course: "React Native"
    },

    {
        headers: {
            "Content-Type": "application/json"
        }
    }
);

When using Postman to send raw JSON, the request can be configured as JSON.

1. Select POST.
2. Enter the API URL.
3. Open the Body tab.
4. Select raw.
5. Select JSON.
6. Enter the JSON body.
7. Send the request.

Postman can then send the request with the appropriate JSON media type.

A PHP REST API receives the HTTP request and can inspect its headers when processing incoming data.

For JSON requests, the body can be read using:

$input = file_get_contents(
    "php://input"
);

$data = json_decode(
    $input,
    true
);

The JSON body can then be validated and processed.

The text/plain media type indicates plain text data.

Content-Type: text/plain

For example, the body might contain:

Hello from the API

The text/html media type indicates HTML content.

Content-Type: text/html

This tells the receiving application that the body contains HTML markup.

The application/xml media type can be used when the body contains XML data.

Content-Type: application/xml

REST APIs can support different data formats, although JSON is very common in modern mobile applications.

The application/x-www-form-urlencoded media type represents form-style key-value data encoded in the request body.

Content-Type:
application/x-www-form-urlencoded

The body can look similar to:

name=Rahul&course=React%20Native

The multipart/form-data media type is commonly used for form submissions that may include files.

Content-Type: multipart/form-data

It is particularly useful for file uploads such as images or documents.

Content-Type and Accept have different purposes.

For example:

Content-Type: application/json
Accept: application/json

Content-Type can also describe the body of an HTTP response.

HTTP/1.1 200 OK
Content-Type: application/json

{
    "success": true,
    "message": "Data found"
}

Here, the response body is JSON.

A PHP REST API can explicitly set the Content-Type of a JSON response.

header(
    "Content-Type: application/json"
);

echo json_encode([
    "success" => true,
    "message" => "Success"
]);

This tells the client that the response body contains JSON.

A well-formed JSON API response commonly includes the JSON media type.

Content-Type: application/json

The response body may contain:

{
    "success": true,
    "data": []
}

A media type can include additional parameters when appropriate. For example, a text media type can specify a character encoding.

Content-Type: text/plain; charset=UTF-8

For JSON, modern JSON handling uses UTF-8 as the standard encoding for interoperable JSON data.

PHP applications can inspect incoming HTTP headers when they need to check how the request body is formatted.

$contentType =
    $_SERVER['CONTENT_TYPE'] ?? '';

echo $contentType;

The exact server environment can affect how request headers are exposed to PHP.

An API can check whether a request is intended to contain JSON before processing it.

$contentType =
    $_SERVER['CONTENT_TYPE'] ?? '';

if (
    stripos(
        $contentType,
        'application/json'
    ) !== 0
) {

    http_response_code(415);

    echo json_encode([
        "success" => false,
        "message" =>
            "JSON content type required"
    ]);

    exit;
}

HTTP status code 415 Unsupported Media Type can be used when the server does not support the media type sent by the client.

When a mobile application uploads a file, the request may use multipart form data rather than a JSON request body.

Content-Type:
multipart/form-data

This format can contain text fields and uploaded files in the same request.

React Native applications commonly send JSON data to PHP REST APIs.

const student = {
    name: "Rahul",
    course: "React Native"
};

fetch(
    "https://example.com/api/students",
    {
        method: "POST",

        headers: {
            "Content-Type":
                "application/json"
        },

        body: JSON.stringify(student)
    }
);

• Using the wrong media type.
• Forgetting Content-Type when the server expects a specific format.
• Sending JSON while identifying the body as a different format.
• Confusing Content-Type with Accept.
• Sending form data as JSON without the required structure.
• Assuming every API accepts every content type.
• Not handling unsupported media types on the server.
• Forgetting that file uploads commonly use multipart/form-data.

Postman can be used to inspect and test request headers.

For a JSON request, the request can contain:

Content-Type: application/json

Then the Body section can contain:

{
    "name": "Rahul",
    "course": "React Native"
}

React Native
      ↓
JavaScript Object
      ↓
JSON.stringify()
      ↓
Content-Type: application/json
      ↓
Request Body
      ↓
PHP REST API
      ↓
Read JSON
      ↓
Validate
      ↓
Process Data
      ↓
Content-Type: application/json
      ↓
JSON Response
      ↓
React Native

React Native request:

const response = await fetch(
    "https://example.com/api/students",
    {
        method: "POST",

        headers: {
            "Content-Type":
                "application/json"
        },

        body: JSON.stringify({
            name: "Rahul",
            email: "rahul@example.com",
            course: "React Native"
        })
    }
);

PHP response:

header(
    "Content-Type: application/json"
);

echo json_encode([
    "success" => true,
    "message" =>
        "Student created successfully"
]);

Content-Type is an essential HTTP header for REST API communication. It tells the receiving system what type of data is contained in the message body.

Request:

POST /api/students

Content-Type: application/json

{
    "name": "Rahul",
    "course": "React Native"
}

For a React Native application communicating with a PHP REST API, application/json will be one of the most frequently used Content-Type values. Other formats such as multipart/form-data are useful when uploading files.