从 PHP 到 AngularJS 的数据不匹配

Posted 2023-03-06

技术标签:

【中文标题】从 PHP 到 AngularJS 的数据不匹配【英文标题】：Data from PHP to AngularJS not matching 【发布时间】：2016-04-20 19:22:08 【问题描述】：

我有一个用于发送电子邮件的 php 文件，而我的 Angular 控制器发送要在电子邮件中发送的数据。我正在尝试在发送和未发送电子邮件的事件中对我的 Angular 回调进行错误处理：

角度控制器：

$scope.processForm = function() 
  $scope.httpCallText = "Sending...";
  $scope.httpCall = 
    'background-color' : '#663300'
  ;

  $http(
    method  : 'POST',
    url     : '/php/contact.php',
    data    : $.param($scope.contactData),  // pass in data as strings
    headers :  'Content-Type': 'application/x-www-form-urlencoded'   // set the headers so angular passing info as form data (not request payload)
  ).then(function successCallback(data) 
    console.log(data);
    if(!data['success']) 
      $scope.httpCallText = "Error. Please Try Again.";
      $scope.httpCall = 
        'background-color' : 'red'
      ;
    
    else 
      $scope.httpCallText = "Sent! Thank You for Your Message"
      $scope.httpCall = 
        'background-color' : 'green'
      
    

  , function errorCallback(response) 
    $scope.httpCallText = "Error. Please Try Again.";
    $scope.httpCall = 
      'background-color' : 'red'
    ;
  );
;

我的 PHP：

<?php
require_once "../vendors/PHPMailer-master/PHPMailerAutoload.php";

print_r($_POST);
$data = array();

$sender_name = isset($_POST['sender_name']) ? $_POST['sender_name'] : '';
$sender_email = isset($_POST['sender_email']) ? $_POST['sender_email'] : '';
$sender_tel = isset($_POST['sender_tel']) ? $_POST['sender_tel'] : '';
$sender_message = isset($_POST['sender_message']) ? $_POST['sender_message'] : '';

$mail = new PHPMailer;

//Enable SMTP debugging. 
$mail->SMTPDebug = 3;                               
//Set PHPMailer to use SMTP.
$mail->isSMTP();            
//Set SMTP host name                          
$mail->Host = "smtp.gmail.com";
//Set this to true if SMTP host requires authentication to send email
$mail->SMTPAuth = true;                          
//Provide username and password     
$mail->Username = "*****@gmail.com";                 
$mail->Password = "******";                           
//If SMTP requires TLS encryption then set it
$mail->SMTPSecure = "tls";                           
//Set TCP port to connect to 
$mail->Port = 587;                                   

$mail->From = $sender_email;
$mail->FromName = $sender_name;


$mail->addAddress("blah@blah.com", "Blah");

$mail->ishtml(true);

$mail->Subject = "Message Sent from jcrageralternatives.com by: ".$sender_name;
$mail->Body = "<p>Name: ".$sender_name."</p><p>Email Provided: ".$sender_email."</p><p>Phone Number Provided: ".$sender_tel."</p><p>Message: '".$sender_message."'</p>";
$mail->AltBody = $sender_message;

if(!$mail->send()) 

    print_r("Mailer Error: " . $mail->ErrorInfo);
    $data['success'] = false;
 
else 

    print_r("Message has been sent successfully");
    $data['success'] = true;


echo json_encode($data);
?>

在我的控制器中的 successCallback 中，如果我执行 if(!data.success)，无论是否发送了电子邮件，我总是会得到一个红色按钮（data.success 评估为 false）。但是，如果我使用if(data.success==false)，我总是会得到一个绿色按钮，无论电子邮件是否已发送。我怎样才能让陈述评估他们应该评估的内容？谢谢！

编辑：当我 console.log response.data 我看到 "success" :false，但是当我 console.log response.data['success'] 我得到未定义。这是我在控制台中为response.data 得到的：

2016-01-16 02:34:28 Connection: opening to smtp.gmail.com:587, timeout=300, options=array (
                                  )
2016-01-16 02:34:28 Connection: opened
2016-01-16 02:34:29 SERVER -> CLIENT: 220 smtp.gmail.com ESMTP ry1sm18220246pab.30 - gsmtp
2016-01-16 02:34:29 CLIENT -> SERVER: EHLO localhost
2016-01-16 02:34:29 SERVER -> CLIENT: 250-smtp.gmail.com at your service, [73.15.255.61]
                                  250-SIZE 35882577
                                  250-8BITMIME
                                  250-STARTTLS
                                  250-ENHANCEDSTATUSCODES
                                  250-PIPELINING
                                  250-CHUNKING
                                  250 SMTPUTF8
2016-01-16 02:34:29 CLIENT -> SERVER: STARTTLS
2016-01-16 02:34:29 SERVER -> CLIENT: 220 2.0.0 Ready to start TLS
2016-01-16 02:34:29 CLIENT -> SERVER: EHLO localhost
2016-01-16 02:34:29 SERVER -> CLIENT: 250-smtp.gmail.com at your service, [73.15.255.61]
                                  250-SIZE 35882577
                                  250-8BITMIME
                                  250-AUTH LOGIN PLAIN XOAUTH2 PLAIN-CLIENTTOKEN OAUTHBEARER XOAUTH
                                  250-ENHANCEDSTATUSCODES
                                  250-PIPELINING
                                  250-CHUNKING
                                  250 SMTPUTF8
2016-01-16 02:34:29 CLIENT -> SERVER: AUTH LOGIN
2016-01-16 02:34:29 SERVER -> CLIENT: 334 VXNlcm5hbWU6
2016-01-16 02:34:29 CLIENT -> SERVER: dmliaHUxMjAxQGdtYWlsLmNvbQ==
2016-01-16 02:34:29 SERVER -> CLIENT: 334 UGFzc3dvcmQ6
2016-01-16 02:34:29 CLIENT -> SERVER: Q0BycGVEMWVt
2016-01-16 02:34:29 SERVER -> CLIENT: 235 2.7.0 Accepted
2016-01-16 02:34:29 CLIENT -> SERVER: MAIL FROM:<v@v>
2016-01-16 02:34:29 SERVER -> CLIENT: 250 2.1.0 OK ry1sm18220246pab.30 - gsmtp
2016-01-16 02:34:29 CLIENT -> SERVER: RCPT TO:<****@gmail.com>
2016-01-16 02:34:29 SERVER -> CLIENT: 250 2.1.5 OK ry1sm18220246pab.30 - gsmtp
2016-01-16 02:34:29 CLIENT -> SERVER: DATA
2016-01-16 02:34:29 SERVER -> CLIENT: 354  Go ahead ry1sm18220246pab.30 - gsmtp
2016-01-16 02:34:29 CLIENT -> SERVER: Date: Sat, 16 Jan 2016 02:34:28 +0000
2016-01-16 02:34:29 CLIENT -> SERVER: To: **** **** <****@gmail.com>
2016-01-16 02:34:29 CLIENT -> SERVER: From: v <v@v>
2016-01-16 02:34:29 CLIENT -> SERVER: Subject: Message Sent from jcrageralternatives.com by: v
2016-01-16 02:34:29 CLIENT -> SERVER: Message-ID: <421aa50e45d9e33b9b7c41918d99af59@localhost>
2016-01-16 02:34:29 CLIENT -> SERVER: X-Mailer: PHPMailer 5.2.14 (https://github.com/PHPMailer/PHPMailer)
2016-01-16 02:34:29 CLIENT -> SERVER: MIME-Version: 1.0
2016-01-16 02:34:29 CLIENT -> SERVER: Content-Type: multipart/alternative;
2016-01-16 02:34:29 CLIENT -> SERVER:   boundary="b1_421aa50e45d9e33b9b7c41918d99af59"
2016-01-16 02:34:29 CLIENT -> SERVER: Content-Transfer-Encoding: 8bit
2016-01-16 02:34:29 CLIENT -> SERVER:
2016-01-16 02:34:29 CLIENT -> SERVER: This is a multi-part message in MIME format.
2016-01-16 02:34:29 CLIENT -> SERVER:
2016-01-16 02:34:29 CLIENT -> SERVER: --b1_421aa50e45d9e33b9b7c41918d99af59
2016-01-16 02:34:29 CLIENT -> SERVER: Content-Type: text/plain; charset=us-ascii
2016-01-16 02:34:29 CLIENT -> SERVER:
2016-01-16 02:34:29 CLIENT -> SERVER: as;lkdfjas;ldkf
2016-01-16 02:34:29 CLIENT -> SERVER:
2016-01-16 02:34:29 CLIENT -> SERVER:
2016-01-16 02:34:29 CLIENT -> SERVER: --b1_421aa50e45d9e33b9b7c41918d99af59
2016-01-16 02:34:29 CLIENT -> SERVER: Content-Type: text/html; charset=us-ascii
2016-01-16 02:34:29 CLIENT -> SERVER:
2016-01-16 02:34:29 CLIENT -> SERVER: <p>Name: v</p><p>Email Provided: v@v</p><p>Phone Number Provided: 1234567891</p><p>Message: 'as;lkdfjas;ldkf'</p>
2016-01-16 02:34:29 CLIENT -> SERVER:
2016-01-16 02:34:29 CLIENT -> SERVER:
2016-01-16 02:34:29 CLIENT -> SERVER:
2016-01-16 02:34:29 CLIENT -> SERVER: --b1_421aa50e45d9e33b9b7c41918d99af59--
2016-01-16 02:34:29 CLIENT -> SERVER:
2016-01-16 02:34:29 CLIENT -> SERVER: .
2016-01-16 02:34:30 SERVER -> CLIENT: 250 2.0.0 OK 1452911670 ry1sm18220246pab.30 - gsmtp
2016-01-16 02:34:30 CLIENT -> SERVER: QUIT
2016-01-16 02:34:30 SERVER -> CLIENT: 221 2.0.0 closing connection ry1sm18220246pab.30 - gsmtp
2016-01-16 02:34:30 Connection: closed
"success":true

【问题讨论】：

【参考方案1】：

试试这个，

$http(
              method  : 'POST',
              url     : '/php/contact.php',
              data    : $.param($scope.contactData),
      ).then(function successCallback(response) 
          console.log(response);  
      , function errorCallback(response) 
          console.log(response);
      );

【讨论】：

success 和 error 方法已被弃用，请改用 then【参考方案2】：

从您的 PHP 代码来看，HTTP 状态没有变化，所以我假设您的响应始终是状态 200。如果是这种情况，则永远不会调用 $http 的 errorCallback，因为 it considers non-2xx status as error。

下一期是successCallback的签名。使用 response 对象为 $http 调用 successCallback。因此，您应该使用response.data 访问您感兴趣的实际 JSON。所以它应该是这样的：

$http(myHttpConfig).then(function(response)  // `response` here!
  console.log(response.data); //  success: true , data from PHP
);

!data.success和data.success == false的区别看下面：

$http(myHttpConfig).then(function(data)  // `data` here is `response`!
  console.log(data.success); // undefined

  // `response` does not have `success` property so it is undefined, so...
  // !data.success => !undefined => true
  // data.success == false => undefined == false => false
);

【讨论】：

如果 response.data 没有成功属性，即使我通过我的 php 发送成功属性，我将如何在控制器的成功/错误函数中访问它？当我console.log(response.data) 时，我看到"success":false，但是当我console.log(response.data['success']) 时，我看到undefined。这是为什么呢？ @user3810313 听起来response. data 是一个字符串而不是对象。尝试在您的 PHP 中将 Content-type 设置为 application/json。正确 Angular 应该能够检测 json 并自动解析它。同时，您可以尝试使用angular. fromJson 解析自己。我稍后会更新这个答案我尝试在 echo json_encode($data) 之前设置标题，但我收到警告说我无法修改标题信息，因为标题已经由 PHPMailer 发送（我正在使用的邮件客户端发送电子邮件）。【参考方案3】：

.then的格式是

.then(function(success),function(error))

所以如果它在第一个块上触发，则意味着它已成功完成。

如果它在第二个块上触发；那意味着它有错误。

因此您无需检查响应是否成功。

【讨论】：

【参考方案4】：

在php端尝试手动设置响应状态

http_response_code(200); // request was successful
http_response_code(500); // error

棱角分明

$http.post(url, data).success(function(data) ).error(function(data) );

【讨论】：

success 和 error 方法已被弃用，请改用 then

以上是关于从 PHP 到 AngularJS 的数据不匹配的主要内容，如果未能解决你的问题，请参考以下文章

angularjs - 将一组对象（JSON 数据）发布到 PHP 页面

从列A数据框A到数据框B中的C的匹配值，并使用熊猫从数据框A创建不匹配的列表

AngularJS之Filter

jQuery 序列化数据和 PHP $_POST 不匹配

AngularJS

从 Wikipedia 检索数据并使用 angularjs 显示它