使用 FETCH 单击按钮提交表单并使用 PHPMailer 发送电子邮件

我想通过 fetch API 将单击按钮时的表单发送到我验证表单的 index.php。如果表单中没有错误,我想用 PHPMailer 向客户端发送一封电子邮件。由于某种原因,客户没有收到电子邮件。我已经搜索了几个小时来寻找答案,但无法解决问题。


这是 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

          }

        });

      })


慕姐8265434
浏览 112回答 1
1回答

繁花如伊

首先,您将导入PHPMailer 的版本5 和 6!事情不会那么顺利;继续 6. 删除这些行及其指向的文件;你不需要它们:require 'PHPMailerAutoload.php'; require "class.phpmailer.php"; require "class.smtp.php";如果您对如何导入库感到困惑,那么现在是学习Composer 的好时机。奇怪的是,当您注释掉显示错误所在的代码时,当出现错误时它不再显示...该console.log(text);行也应该显示浏览器所看到的内容。解决这个问题的最佳方法是一次调试一件事。首先确保您的表单实际上以应有的格式将数据传递到您的脚本 - 考虑到 JSON 错误(不是来自 PHPMailer),情况似乎很可能并非如此,而这可能就是来源你所有的问题。因此,将其添加到脚本顶部附近:var_dump($_REQUEST);这将破坏您的 ajax 请求(因为输出不是 JSON),但您将能够在浏览器的 Web 检查器中看到原始响应。确认其格式正确并包含所有预期的表单数据后,删除该var_dump行并继续检查您是否正确访问 JSON 中的属性。同样,您可能会发现最好在浏览器的检查器中显示它。一旦您确定以正确的方式提取了所需的所有数据,就可以继续发送电子邮件。考虑到通过 SMTP 使用 gmail 的常见问题,最好使用固定值测试您的电子邮件代码,与您的 ajax 内容分开 - 如果没有其他内容妨碍,它本身就很难调试。现在您已经到了所有各个部分都可以工作的地步,将它们重新组合在一起并检查每个步骤。
打开App,查看更多内容
随时随地看视频慕课网APP