时间戳

首页 > 解决方案 > Ajax 不发送电子邮件，但状态为 200

javascript - Ajax 不发送电子邮件，但状态为 200

问题描述

我的 Ajax 有问题，我有代码：

    const sendForm = function () {
        action = 'contact';

        if (window.XMLHttpRequest) {
            xmlhttp = new XMLHttpRequest();
        } else {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }

        xmlhttp.onreadystatechange = function () {
            if (this.readyState == 4 && this.status == 200) {
                const getMessageSend = document.querySelector("#messageSend");
                getMessageSend.classList.add("message-send");
                getMessageSend.innerText = "Thank you for sending an email. You will receive an answer shortly.";
            } else {
                const getMessageSendError = document.querySelector("#messageSendError");
                getMessageSendError.classList.add("message-send");
                getMessageSendError.classList.add("message-send-error");
                getMessageSendError.innerText = "An error occurred and the email was not sent.";
            }
        };

        xmlhttp.open("post", action, true);
        xmlhttp.send();

    };

    const sendMail = function() {

        options.form.addEventListener('submit', function (e) {
            e.preventDefault();
            let validate = true;
            const elementsRequired = document.querySelectorAll(":scope [formHr]");

            [].forEach.call(elementsRequired, function(element) {
                const type = element.type.toUpperCase();

                if (type === 'TEXT') {
                    if (!validateText(element)) {validate = false;}
                }

                if (type === 'EMAIL') {
                    if (!validateEmail(element)) {validate = false;}
                }

                if (type === 'NUMBER') {
                    if (!validateNumber(element)) {validate = false;}
                }

                if (type === 'FILE') {
                    if (!validateFile(element)) {validate = false;}
                }

                if (type === 'CHECKBOX') {
                    if (!validateCheckbox(element)) {validate = false;}
                }

            });
            if (validate) {
                sendForm();
            } else {
                return false;
            }

        });

    };

我的操作文件写入正确，因为当我删除 Ajax 并尝试仅使用 PHP 发送电子邮件时，电子邮件发送正确。

Ajax 返回状态 200：

POST http://mypage.com/contact [HTTP/1.1 200 OK 231ms]

但是电子邮件没有到达邮箱，我必须在this.submit()之后添加sendForm()，然后电子邮件才能正确发送。但是当我添加this.submit()页面时重新加载，但我不希望页面重新加载。

标签： javascriptajax

解决方案

问题是双重的：

  1. 您没有在请求中发送正文（ xmlhttp.send() 没有参数）。用法见这里，注意POST示例：https ://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/send
  2. 当您的服务器没有所需的所有参数时，它会返回 200。如果它没有足够的信息来处理请求，则让它验证是否提供了它需要的所有参数，并返回 422（不可处理实体）或其他一些相关代码可能会很有用。

当您调用 this.submit() 时，它实际上是在提交表单（其中将包含参数）。为了发送 ajax 请求，您基本上需要从表单中获取值，构造一个您的服务器将接受的主体，然后发送它。

推荐阅读