解析期间的 Http 失败 - 有角度的 http post 到 php

Question

我可以使用邮递员的 php 端点。我尝试从 angular post 中执行相同操作，但出现此错误 - 解析期间 Http 失败。尽管对我来说一切看起来都很完美，但问题却令人惊讶。这是我的sn-p

php 文件

<?php
header('Access-Control-Allow-Origin: *');

// check for post
if ($_SERVER['REQUEST_METHOD']=='POST') { 
    $name = $_POST['name'];
    $email = $_POST['email'];
    $subject = $_POST['subject'];
    $message = $_POST['message'];

    // include db connect class
    require_once __DIR__ . '/db_connect.php'; 
    // connecting to db
    $conn = new db_CONNECT();

    $cone=$conn->con;   

    //escpae the strings to be inserted to DB
    $escapedname = mysqli_real_escape_string($cone, $name);
    $escapedemail = mysqli_real_escape_string($cone, $email);
    $escapedsubject= mysqli_real_escape_string($cone, $subject);
    $escapedmessage = mysqli_real_escape_string($cone, $message);

    // mysql inserting a new row
    $sql = "INSERT INTO contacts(name, email, subject, message) VALUES ('$escapedname', '$escapedemail', '$escapedsubject', '$escapedmessage')";
    // $result= $cone -> query($sql);
    // $affected = $cone -> affected_rows;

    if (mysqli_query($cone,$sql)) {
        echo "Information saved successfully.";
    } else {
        echo "Not successful";
    }
 } else {
    echo "Some field missing.";
}
?>

这里是角度 sn-p

saveContactDetails = function () { 

    this.proceed = true;
    this.success = false;
    const myheader = new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded');
    data.append('name', this.contactDeJson.name);
    data.append('email', this.contactDeJson.email);
    data.append('subject', this.contactDeJson.subject);
    data.append('message', this.contactDeJson.message);

    this.http
    .post('http://localhost:80/'+'api/create_contact.php', data.toString(), {headers: myheader})

请问为什么会出现这个错误

{"headers":{"normalizedNames":{},"lazyUpdate":null},"status":200,"statusText":"OK","url":"http://localhost/api/create_contact.php","ok":false,"name":"HttpErrorResponse","message":"Http failure during parsing for http://localhost/api/create_contact.php",

Answer 1

我认为问题在于您的 Angular 脚本需要一个 json 响应（默认的 responseType），但没有收到正确的标头或数据。我将创建一个可以处理发送响应的函数，而不是仅仅在 php 中回显您的结果。像这样的：

function sendJsonResponse(data, status = 200) {
    header('Content-Type: application/json', true, status);
    echo json_encode($data);
    exit();
}

不要这样做：

echo "Not successful";

您现在可以这样做了：

sendJsonResponse("Not successful", 500);

这应该会在前端为您提供更多有价值的信息。现在应该正确格式化响应，并且不再产生您现在得到的角度解析错误。

Answer 2

我相信您正在尝试使用data 变量发送一些查询参数。您实际上可以发送一个 JS 对象作为参数。试试下面的

private saveContactDetails() { 
  this.proceed = true;
  this.success = false;
  const myheader = new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded');
  const data = {
    'name': this.contactDeJson.name,
    'email': this.contactDeJson.email,
    'subject': this.contactDeJson.subject,
    'message': this.contactDeJson.message
  }

  this.http.post('http://localhost:80/'+'api/create_contact.php', { params: data }, { headers: myheader })
}