Php 试图在服务器上发送数据，但在浏览器DevTools控制台中出现此错误：createError和XMLHttpRequest.handleError处出现网络错误

我使用react js作为web前端，php作为后端，在网页上点击按钮，我试图将数据发送到服务器，但得到了这个错误：网络错误 在createError（createError.js:16） 位于XMLHttpRequest.handleError（xhr.js:84）

我尝试了两种不同的方法将数据发送到服务器，但每次都出现相同的错误。有人能帮我吗

反应代码：

axios({
      method: "post",
      url: "https://asuiot12.000webhostapp.com/addCourse.php",
      headers: {
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Methods": "GET,PUT,POST,DELETE,PATCH,OPTIONS",
      },
      data: {
        Course_Code: inputTagCourseCode,
        Course_Name: inputTagCourseName,
        Credit_Hours: inputTagCreditHours,
      },
    })
      .then(function (response) {
        console.log(response);
        alert(response);
      })
      .catch(function (error) {
        console.log(error);
      });

    //attempt 2
    // axios
    //   .post("https://asuiot12.000webhostapp.com/addCourse.php", {
    //     Course_Code: inputTagCourseCode,
    //     Course_Name: inputTagCourseName,
    //     Credit_Hours: inputTagCreditHours,
    //   })
    //   .then(function (response) {
    //     console.log(response);
    //     alert(response);
    //   })
    //   .catch(function (error) {
    //     console.log(error);
    //   });
  };

使用的按钮：

<button
 style={{ float: "right" }}
 type="button"
 class="btn btn-success button_style mb-4"
 onClick={() => newCourse()}
>
Save Course
</button>

newCourse（）}
>
省道

Php代码：

<?php
    include_once 'connection.php';
    class course{
        public $success;
        public $message;
    }
   // header("Access-Control-Allow-Origin: *");
   header("Access-Control-Allow-Origin: *");
   header('Access-Control-Allow-Methods: POST, GET, OPTIONS');
   header('Access-Control-Allow-Headers: *'); 
   header('Access-Control-Max-Age: 1728000');
   header("Content-Length: 0");
   header("Content-Type: text/plain");
    $Course_Code = $_POST['Course_Code'];
    $Course_Name = $_POST['Course_Name'];
    $Credit_Hours = $_POST['Credit_Hours'];
    $query = "INSERT INTO Courses(Course_Code, Course_Name, Credit_Hours)
     VALUES ('$Course_Code','$Course_Name','$Credit_Hours')";
    if(mysqli_query($con,$query)){
        echo "Records added successfully.";    } else{
        echo "ERROR: Could not able to execute $query. " . mysqli_error($con);
    }
    mysqli_close($con);
?>

如果您使用hostinger（000webhost）并使用react和PHP创建网站，则可以使用axios从服务器检索数据，而不能使用axios发出post请求。如果您愿意，您将看到一个http协议错误。因此，axios使用fetch（对于000webhost服务器，我重复）。我对费奇也这样做过

const addCourse = () => {
    fetch("https://asuiot12.000webhostapp.com/addCourse.php", {
      method: "POST",
      body: JSON.stringify({
        Course_Code: inputTagCourseCode,
        Course_Name: inputTagCourseName,
        Credit_Hours: inputTagCreditHours,
      }),
    })
      .then(function (response) {
        return response.json();
      })
      .then(function (data) {
        console.log(data);
        alert(data);
      })
      .catch((error) => {
        // Do something for an error here
        if (error.response) {
          console.log("Error with response", error.response.status);
        } else if (error.request) {
          console.log("Problem with request");
        }
      });
  };

<?php
   // write down you db connection code her/import connection file
   header("Access-Control-Allow-Origin: *");
   header("Access-Control-Allow-Methods: GET, POST, OPTIONS");
   header('Access-Control-Allow-Credentials: true');
   header('Access-Control-Max-Age: 86400');    // cache for 1 day

   $data = json_decode(file_get_contents("php://input"), true);

   if($data['Course_Code'] != null && $data['Course_Name'] != null && 
   $data['Credit_Hours'] != null ){
        //echo json_encode($data);
        $Course_Code = $data['Course_Code'];
        $Course_Name = $data['Course_Name'];
        $Credit_Hours = $data['Credit_Hours'];
    

        $query = "INSERT INTO Courses(Course_Code, Course_Name, Credit_Hours)
        VALUES ('$Course_Code','$Course_Name','$Credit_Hours')";
        //$data = array();

        if(mysqli_query($conn,$query)){
        //$temp = array();
        //$temp['message'] = "Successfully Registered";
        $response = "Successfully Registered";
        echo json_encode($response);
        //array_push($data, $temp);
        } else{
        //  $temp = array();
        // $temp['message'] = "Error Occured ". mysqli_error($conn);
        $response  = "Error Occured ". mysqli_error($conn);
        echo json_encode($response);
        // array_push($data, $temp);
        }
        //echo json_encode($data);
   }else{
        $response = "Something went wrong...";
        echo json_encode($response);
   }
   mysqli_close($conn);
?>

在PHP文件中读取如下数据

const addCourse = () => {
    fetch("https://asuiot12.000webhostapp.com/addCourse.php", {
      method: "POST",
      body: JSON.stringify({
        Course_Code: inputTagCourseCode,
        Course_Name: inputTagCourseName,
        Credit_Hours: inputTagCreditHours,
      }),
    })
      .then(function (response) {
        return response.json();
      })
      .then(function (data) {
        console.log(data);
        alert(data);
      })
      .catch((error) => {
        // Do something for an error here
        if (error.response) {
          console.log("Error with response", error.response.status);
        } else if (error.request) {
          console.log("Problem with request");
        }
      });
  };

<?php
   // write down you db connection code her/import connection file
   header("Access-Control-Allow-Origin: *");
   header("Access-Control-Allow-Methods: GET, POST, OPTIONS");
   header('Access-Control-Allow-Credentials: true');
   header('Access-Control-Max-Age: 86400');    // cache for 1 day

   $data = json_decode(file_get_contents("php://input"), true);

   if($data['Course_Code'] != null && $data['Course_Name'] != null && 
   $data['Credit_Hours'] != null ){
        //echo json_encode($data);
        $Course_Code = $data['Course_Code'];
        $Course_Name = $data['Course_Name'];
        $Credit_Hours = $data['Credit_Hours'];
    

        $query = "INSERT INTO Courses(Course_Code, Course_Name, Credit_Hours)
        VALUES ('$Course_Code','$Course_Name','$Credit_Hours')";
        //$data = array();

        if(mysqli_query($conn,$query)){
        //$temp = array();
        //$temp['message'] = "Successfully Registered";
        $response = "Successfully Registered";
        echo json_encode($response);
        //array_push($data, $temp);
        } else{
        //  $temp = array();
        // $temp['message'] = "Error Occured ". mysqli_error($conn);
        $response  = "Error Occured ". mysqli_error($conn);
        echo json_encode($response);
        // array_push($data, $temp);
        }
        //echo json_encode($data);
   }else{
        $response = "Something went wrong...";
        echo json_encode($response);
   }
   mysqli_close($conn);
?>

你能看看你的浏览器DevTools控制台吗？可能有一些有用的错误消息。我发现了这个，POST net:：ERR_HTTP2_PROTOCOL_error，但我不知道这是什么意思，你能告诉我关于这个错误吗？在firefox浏览器中，我发现这个，跨源请求被阻止：同一源策略不允许读取远程资源。（原因：CORS请求未成功）。警告：您完全可以使用参数化的预处理语句，而不是手动生成查询。它们由或提供。永远不要相信任何形式的输入！即使您的查询仅由受信任的用户执行。