javascript - 通过 AJAX 接收 PHP 的响应

Question

我正在尝试使用 Ajax 将信息从我网站上的表单发送到 PHP 脚本。但是，每次我尝试提交表单时，我都没有从服务器上的脚本得到任何响应。我不知道我错过了什么，我将不胜感激任何帮助。

这是我的HTML:

<form method='post' action='<?= get_template_directory_uri() ?>/mailchimp.php'>
    <input type='text' name='email'/>
    <input type='submit' name='submit' value='Subscribe'/>
</form>

这是我的PHP:

session_start();
if(isset($_POST['submit'])){
    $email = $_POST['email'];
    if(!empty($email) && !filter_var($email, FILTER_VALIDATE_EMAIL) === false){
        // MailChimp API credentials
        $apiKey = 'xxx-xxx';
        $listID = 'xxxxxxx';

        // MailChimp API URL
        $memberID = md5(strtolower($email));
        $dataCenter = substr($apiKey,strpos($apiKey,'-')+1);
        $url = 'https://' . $dataCenter . '.api.mailchimp.com/3.0/lists/' . $listID . '/members/' . $memberID;

        // member information
        $json = json_encode([
            'email_address' => $email,
            'status'        => 'subscribed'
        ]);

        // send a HTTP POST request with curl
        $ch = curl_init($url);
        curl_setopt($ch, CURLOPT_USERPWD, 'user:' . $apiKey);
        curl_setopt($ch, CURLOPT_HTTPHEADER, ['Content-Type: application/json']);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        curl_setopt($ch, CURLOPT_TIMEOUT, 10);
        curl_setopt($ch, CURLOPT_CUSTOMREQUEST, 'PUT');
        curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $json);
        $result = curl_exec($ch);
        $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE);
        curl_close($ch);

        echo "<h1>Success</h1>";
    }
}

这是我的JQuery:

jQuery('form').submit(function (event) {

   console.log('submitting...')

    //1. Get the form Data
    var formData = {
        'email': jQuery('input[name=email]').val()
    }

    console.log("DATA FROM FORM:")
    console.log(formData);

    //2. Process the form
    jQuery.ajax({
        type: 'POST', //Type of HTTP request
        url: 'mailchimp.php', //URL to POST
        data: formData //Data from form
    }).done(function (data) {
        console.log("RESPONSE: " + data);
    });

    //3. Stop the form from submitting in usual manner
    event.preventDefault();
});

我检查了控制台，发现 JS 没有错误。我看到这个:

submitting...
DATA FROM FORM:
Object {email: "xyz@domain.com"}
RESPONSE: 

我还检查了我的网络请求，我可以看到我已经请求了 PHP 脚本，并且它发回了 200 响应，因此我正在点击该脚本 - 但我没有看到任何响应响应数据。

*另请注意 - 我知道在上面的 PHP 代码中我没有检查 $httpCode 变量。我将实现这一点。我只想让脚本先互相交谈。

Answer 1

发生这种情况是因为您的情况:

if(isset($_POST['submit'])){

永远不会到达，因为您没有发送 submit POST 中的参数请求您仅发送 email .

因此请删除该条件或将其替换为 isset($_POST['email']) ，或者您也可以添加 submit参数到您的 formData .

To make sure that the request sent to the right route try to comment all the code and add an echo (e.g echo "<h1>Test</h1>";) and check if it will be logged.

希望这有帮助。