Home > Software engineering >  How to send a response in PHP to a request made through the javascript fetch API?
How to send a response in PHP to a request made through the javascript fetch API?

Time:07-23

I have an application in PHP, which receives data from the client that is in another domain. Data arrives from the fetch API via the POST method, but PHP doesn't send a response to the fetch API.

foo.com/endpoint.php:

<?php
include_once('database/connection.php');
header('Content-Type: application/json');

$ip = $_POST["ip"];
$city = $_POST["city"];
$state = $_POST["state"];
$country = $_POST["country"];
$category = $_POST["category"];
// Checking if the req ip already have registered other req
$ip_query = "SELECT * FROM registers WHERE `ip` = '$ip'";
$ip_result = mysqli_query($conn, $ip_query);
$ip_check = mysqli_fetch_assoc($ip_result);
if (!$ip_check) {
    // registering data after validation
    $new_query = "INSERT INTO `registers` (`ip`, `city`, `state`, `country`, `category`, `created`) VALUES ('$ip', '$city', '$state', '$country', '$category', '2022-07-21 00:00:01')";
    $new_create = mysqli_query($conn, $new_query);
    $result = array(
        'ok' => true,
        'status' => 200
    );
    // sending response
    http_response_code(200);
    echo json_encode($result);
} else {
    // sending response if already registered
    http_response_code(503);
}

Client side fetch code:

fetch(this.url, {
                method: 'POST',
                mode: 'no-cors',
                body: this.getFormValues(),
                headers: {
                    "Accept": "application/json",
                    'Content-Type': 'application/json'
                  }
            })
            .then(resp => resp.json())
            .then(data => {
                console.log(data)
                if (data.ok) {
                    this.Metrics.setSent()
                } else {
                    throw Error(r.statusText)
                }
            })
            .then(() => {
                this.Metrics.setSent()
                this.Metrics.dismiss()
            })
            .catch(erro => {
                console.log("Erro: ",erro)
                this.Metrics.dismiss()
            });

It's all right about storing data, my problem is just sending the response :(

CodePudding user response:

PHP does not parse the POST body into JSON automatically. To fix this, you have to add json_decode() to your code like this:

$ip = json_decode($_POST, true)["ip"];

CodePudding user response:

I hadn't noticed that when making a request using the "no-cors" mode i'd get an opaque response.

I just added the code below to the beginning of my PHP file, changed the fetch mode to "cors" and everything worked as it was supposed to work:

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, Authorization');
header("Access-Control-Allow-Credentials: true");
$method = $_SERVER['REQUEST_METHOD'];
if ($method == "OPTIONS") {
     header('Access-Control-Allow-Origin: *');
     header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method,Access-Control-Request-Headers, Authorization") ;
     header("HTTP/1.1 200 OK");
     die();
}

I made the adaptations suggested by @brrrrrrr and updated the queries to prevent SQL injections.

Thx everyone.

  • Related