This article explores the problem that Yii2 applications are empty when receiving application/json type POST requests and provides a detailed solution. By configuring yii\web\Request::$parsers, Yii2 can correctly parse the JSON request body to ensure that the backend can successfully obtain the JSON data sent by the frontend. The article covers examples of front-end JavaScript sending JSON and back-end PHP processing logic.

Understand the default behavior of JSON POST requests and Yii2

In web development, the front-end usually sends data to the back-end via POST requests. Common Content-Types are application/x-www-form-urlencoded and multipart/form-data. Web servers (such as Apache, Nginx) will parse these two types of request bodies by default and fill data into PHP's $_POST global variable. Therefore, the Yii2 framework also reads the POST parameter from $_POST by default.

However, when the current side uses fetch or XMLHttpRequest to send a request of Content-Type: application/json type, the JSON data in the request body is not automatically parsed by the web server and populated into the $_POST variable. This means that even if the request is successfully sent to the backend, Yii2 will get a null value because $_POST is empty when trying to get the parameter via Yii::$app->request->post('paramName').

Solution: Configure the Yii2 request resolver

In order for Yii2 to correctly parse request bodies of application/json type, you need to add the JSON parser to the yii\web\Request::$parsers property. This is usually done in your application configuration file (such as config/web.php or config/main.php).

Find the configuration of the request component in the components array and add the parsers property:

 // config/web.php or config/main.php

'components' => [
    'request' => [
        // !!! insert a secret key in the following (if it is empty) - this is required by cookie validation
        'cookieValidationKey' => 'your-secret-key', // Please replace with your key 'parsers' => [
            'application/json' => 'yii\web\JsonParser',
        ],
        // ... Other request component configuration],
    // ... Other component configuration]

Through the above configuration, when Yii2 receives a request with Content-Type application/json, it will automatically use yii\web\JsonParser to parse the request body, and fill the parsed data into the internal data structure accessible by the Yii::$app->request->post() method.

Example of front-end JavaScript sending JSON request

The example code for the front-end to use the fetch API to send JSON data is as follows. Note the settings of Content-Type: application/json in headers, and the use of JSON.stringify() in body to convert JavaScript objects into JSON strings.

 let csrfToken = document.querySelector("meta[name='csrf-token']").content;
let csrfParam = document.querySelector("meta[name='csrf-param']").content;

// Assume e.id and this.state.ChangeName are the data to be sent const dataToSend = {
    'id': e.id,
    'name': this.state.ChangeName
};

fetch("http://site.se/react/save-babysitter", {
    method: "POST",
    headers: {
        "Content-Type": "application/json", // Key: Specify the content type as JSON
        "Accept": "application/json",
        // Yii2 CSRF token, ensure the security of the request [csrfParam]: csrfToken, // Use bracket syntax, because csrfParam is the variable "X-CSRF-Token": csrfToken // Compatibility considerations, usually Yii2 will check one of them},
    body: JSON.stringify(dataToSend) // Convert JavaScript objects to JSON string})
.then(response => {
    // Check the response status code, if not 2xx, an error is thrown if (!response.ok) {
        throw new Error(`HTTP error! status: ${response.status}`);
    }
    return response.json(); // parse JSON response})
.then((data) => {
    console.log("Success:", data);
})
.catch((error) => {
    console.error("Error:", error);
});

Notes:

• CSRF token: When sending a POST request, to prevent cross-site request forgery (CSRF) attacks, Yii2 checks the CSRF token by default. The front-end needs to get the CSRF token from the page and send it as a request header or request body parameter. In the above code example, the token is sent through the csrf-param and X-CSRF-Token headers.
• Error handling: Adding response.ok checks and catch blocks to the then chain of fetch can better handle network errors and server response errors.

Backend PHP controller processing logic

After configuring JsonParser, the Yii2 request component can correctly parse the JSON request body. You can now obtain parameters in JSON data like getting normal form data through the Yii::$app->request->post() method.

 <?php namespace app\controllers;

use Yii;
use yii\web\Controller;
use yii\web\Response; // Introduce Response class class ReactController extends Controller
{
    // Disable CSRF verification (for demonstration only, please be cautious in production environments)
    // public $enableCsrfValidation = false; 

    public function actionSaveBabysitter()
    {
        $request = Yii::$app->request;

        // Set the response format to JSON
        Yii::$app->response->format = Response::FORMAT_JSON;

        // Get parsed JSON data // If the front-end sends {"id": 123, "name": "Test"}
        $id = $request->post('id');
        $name = $request->post('name');

        // You can also get all POST parameters as an array // $postData = $request->post(); 

        // In production environment, it is usually necessary to verify and process the received data if (empty($id) || empty($name)) {
            Return [
                'status' => 'error',
                'message' => 'ID or Name cannot be empty. ',
            ];
        }

        // Suppose that data storage or other business logic is performed here // For example: $model = new Babysitter(['id' => $id, 'name' => $name]); $model->save();

        // Return successful response return [
            'status' => 'success',
            'message' => 'Data received successfully! ',
            'received_id' => $id,
            'received_name' => $name,
            // More processing results can be returned here];
    }
}

Important tips:

• CSRF Verification: If your controller or single action has CSRF Verification enabled (Yii2 is enabled by default), make sure the front-end sends the CSRF token correctly. If the front-end cannot send the token or you are sure that CSRF protection is not required (for example, for interfaces that are only for internal API calls), you can set $enableCsrfValidation = false in the controller or disable in action via behavior configuration. But be sure to understand the security risks that disabling CSRF verification can pose.
• getRawBody(): If you need to get the original JSON string instead of parsed data, you can use the Yii::$app->request->getRawBody() method. This is useful in some scenarios where the original request body needs to be manually parsed or recorded.
• Response format: In Yii2, in order to return a response in JSON format, it is recommended to set Yii::$app->response->format = \yii\web\Response::FORMAT_JSON;, and then directly return a PHP array or object. Yii2 will automatically encode it into a JSON string.

Summarize

By configuring yii\web\JsonParser in the request component of the Yii2 application, we can easily solve the problem that the backend cannot receive application/json type POST request data. This configuration allows Yii2 to seamlessly process JSON data sent by the front-end, greatly simplifying the complexity of front-end data interaction. In actual development, in addition to correctly configuring the parser, attention should be paid to CSRF protection, data verification, and specification error handling to build robust and secure web applications.

The above is the detailed content of Handling JSON POST requests in Yii2: Configuration and Practice. For more information, please follow other related articles on the PHP Chinese website!