使用 FETCH 單擊按鈕提交表單並使用 PHPMailer 發送 email

Question

我想在單擊按鈕時發送一個表單，並將 API 提取到 index.php 以驗證表單。 如果表單中沒有錯誤，我想將帶有 PHPMailer 的 email 發送到客戶端。 由於某種原因，客戶端沒有收到電子郵件。 我已經搜索了幾個小時的答案，但我無法解決問題。

這是 javascript 代碼：

 const form = document.querySelector("#myForm");
      form.addEventListener("submit", (e) => {
        e.preventDefault();
        const formData = new FormData(form);
        fetch("index.php", {
          method: 'post',
          body: formData
        }).then((resp) => resp.json())
        .then(function (text) {
          console.log(text); //Do something with the response, which is an array
          if(text !== undefined && text.length > 0) { //The array isn't empty
            //Show errors
            const formdiverror = document.querySelector(".col-100-form-error");
            const colform = document.querySelector(".col-100-form"); //showing error
            colform.style.display = "block";
            formdiverror.innerHTML = "";
            text.forEach(t => formdiverror.innerHTML += t + "</br>");
          } else {
            //array is empty, no errors
             const colform = document.querySelector(".col-100-form");
             if(colform !== null || colform !== undefined) colform.style.display = "none";
             alert("You succesfully bought the product!");
            //window.location.replace("index.html"); //if there was no error redirect to index.html
          }
        });
      })

php：

<?php
use PHPMailer\PHPMailer\PHPMailer;
use PHPMailer\PHPMailer\SMTP;
require 'Exception.php';
require 'PHPMailer.php';
require 'SMTP.php';
require 'PHPMailerAutoload.php';
require "class.phpmailer.php";
require "class.smtp.php";


$errors = [];

if(isset($_POST["name"])) {
   
     /*I took out the validation to simplify the code*/
    if (!empty($errors)) {
        echo json_encode($errors);
    } else {
        echo json_encode([]);
        $mail = new PHPMailer();
        $mail->isSMTP();
        $mail->Host = 'smtp.gmail.com';
        $mail->SMTPAuth = true;
        $mail->Username = "mymail@gmail.com"; //paste one generated by Mailtrap
        $mail->Password = 'mypasswd'; 
        $mail->SMTPSecure = 'tls'; // secure transfer enabled REQUIRED for GMail
        $mail->Port = 587;
        $mail->addAddress("customer@gmail.com", 'First Last');
        $mail->addReplyTo('mymail@gmail.com', 'First Last');
        $mail->setFrom('mymail@gmail.com', 'John Doe');
        $mail->Subject = 'PHPMailer GMail SMTP test';
        $mail->isHTML(true);
        $mailContent = "<h1>Send HTML Email using SMTP in PHP</h1>
        <p>This is a test email I’m sending using SMTP mail server with PHPMailer.</p>";
         $mail->Body = $mailContent;
         $mail->send();
        //If I try this way it gives an errror: Unexpected token in JSON at position 
        /* if($mail->send()){
            echo ('Message has been sent');
        }else{
            echo ('Message could not be sent.');
            echo ('Mailer Error: ' . $mail->ErrorInfo);
        }*/
    }
} 
?>

我沒有收到任何錯誤，所以我不知道問題出在哪里。 我已禁用雙向驗證，並允許訪問不太安全的應用程序。

Answer 1

首先，您要導入 PHPMailer 的 5和6 版本； 這對 go 不好。 go 6； 刪除這些行和它們指向的文件：你不需要它們：

require 'PHPMailerAutoload.php';
require "class.phpmailer.php";
require "class.smtp.php";

如果您對如何導入庫感到困惑，那么現在是學習composer的好時機。

奇怪的是，當您注釋掉向您顯示錯誤所在的代碼時，它不再向您顯示出現錯誤時... console.log(text); 行也應該向您顯示您的瀏覽器看到的內容。

解決此問題的最佳方法是一次調試一件事。

首先確保您的表單實際上以應有的格式將數據傳遞給您的腳本 - 考慮到 JSON 錯誤（不是來自 PHPMailer），看起來很可能不是這種情況，這可能是源你所有的問題。 所以在你的腳本頂部附近添加這個：

var_dump($_REQUEST);

這將破壞您的 ajax 請求（因為 output 不是 JSON），但您將能夠在瀏覽器的 web 檢查器中看到原始響應。

一旦您確認它的格式正確並包含所有預期的表單數據，請刪除該var_dump行並繼續檢查您是否正確訪問了 JSON 中的屬性。 同樣，您可能會發現最好在瀏覽器的檢查器中顯示此內容。 一旦確定以正確的方式提取所需的所有數據位，就可以繼續發送 email。

Given the very common problems with using gmail via SMTP, it's a good idea to test your email code with fixed values, separately from your ajax stuff – it's hard enough to debug by itself without other stuff getting in the way.

現在你已經到了所有單獨的部分都可以工作的地步，將它們重新組合在一起，並在你這樣做的時候檢查每一步。