'has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header has a value

full erorr

Access to XMLHttpRequest at 'https:/domain/errors/403/' (redirected from 'http://domain/includes/action.php') from origin 'domain' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header has a value 'http://domain' that is not equal to the supplied origin.

the code should to search without refresh so in localhost all work right but when i go to server i got this erorr in console

here is my php where i got a response to my main page

<?php
    include 'db.php';
    if (isset($_POST['search'])) {
    $Name = $_POST['search'];
    $Query = "SELECT * FROM items WHERE name LIKE '%$Name%' OR namea LIKE '%$Name%' LIMIT 6";
    $q2 = "SELECT * FROM items WHERE namea LIKE '%$Name%' LIMIT 6";
    $ExecQuery = mysqli_query($con, $Query);
    $ExecQuery2 = mysqli_query($con, $q2);
    if ($ExecQuery) {
        $go = $ExecQuery;
    } else {
        $go = $ExecQuery2;
    }
    echo '<ul class="cards">';
    while ($row = mysqli_fetch_array($go)) {
        $name = $row['name'];
        $p = $row['price'];
        $d = $row['descrip'];
        $m = $row['img'];
        echo '
        <li class="cards__item">
        <div class="card">
            <img src="pimg/' . $m . '" class="card__image">
            <div class="card__content">
                <div class="card__title">name: ' . $name . '</div>
                <div class="card__title">price: ' . $p . ' $</div>
                <p class="card__text">' . $d . '</p>
                
            </div>
        </div>
        </li>';
    }
}

here is my js code to send the data to search.php and got the response

function fill(Value) {
    $('#search').val(Value);
    $('#display').hide();
    }
    $(document).ready(function () {
    $("#search").keyup(function () {
        var name = $('#search').val();
        if (name != "") {
            $.ajax({
                type: "POST",
                url: "includes/search.php",
                data: {
                    search: name
                },
                success: function (html) {
                    $("#display").html(html).show();
                }
            });
        }
    });
});
javascriptphpajaxbackend


Solution 1:[1]

First make sure that the code is fully error free, then please try something like following. I don't know exactly it solve your issue. Just try.

<?php
ob_start();
include 'db.php';

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST, DELETE, PUT, PATCH, OPTIONS');
header("Access-Control-Allow-Headers: X-Requested-With");

if (isset($_POST['search'])) {
   // do the things you needfull
}

ob_end_flush();

You will get more information about Cross-Origin Request Headers(CORS) with PHP headers from here. Please check the answers in the link above mentioned.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Vishnu S Vyshakh

Related Questions