Не удалось загрузить ресурс: сервер ответил со статусом 404 (не найдено) в контактной форме, используя Js, ajax, php - PullRequest
0 голосов
/ 08 декабря 2018

Я получаю сообщение об ошибке Не удалось загрузить ресурс: сервер ответил со статусом 404 (не найден) и не совсем уверен, почему это происходит.Я проверил маршруты и доступ к файлам, и все выглядит нормально.

Мой файл Js выглядит так:

var clContactForm = function() {

        /* local validation */
        $('#contactForm').validate({

            /* submit via ajax */
            submitHandler: function(form) {

                var sLoader = $('.submit-loader');

                $.ajax({

                    type: "POST",
                    url: "../inc/sendEmail.php",
                    data: $(form).serialize(),
                    beforeSend: function() { 

                        sLoader.slideDown("slow");

                    },
                    success: function(msg) {

                        // Message was sent
                        if (msg == 'OK') {
                            sLoader.slideUp("slow"); 
                            $('.message-warning').fadeOut();
                            $('#contactForm').fadeOut();
                            $('.message-success').fadeIn();
                        }
                        // There was an error
                        else {
                            sLoader.slideUp("slow"); 
                            $('.message-warning').html(msg);
                            $('.message-warning').slideDown("slow");
                        }

                    },
                    error: function() {

                        sLoader.slideUp("slow"); 
                        $('.message-warning').html("Algo ocurrió. Por favor, inténtalo de nuevo");
                        $('.message-warning').slideDown("slow");


                    }

                });
            }

        });
    };

Мой PHP-код выглядит так:

<?php

// Replace this with your own email address
$siteOwnersEmail = 'myemail@gmail.com';


if($_POST) {

    $name = trim(stripslashes($_POST['contactName']));
    $email = trim(stripslashes($_POST['contactEmail']));
    $subject = trim(stripslashes($_POST['contactSubject']));
    $contact_message = trim(stripslashes($_POST['contactMessage']));

    // Check Name
    if (strlen($name) < 2) {
        $error['name'] = "Por favor, coloca tu nombre.";
    }
    // Check Email
    if (!preg_match('/^[a-z0-9&\'\.\-_\+]+@[a-z0-9\-]+\.([a-z0-9\-]+\.)*+[a-z]{2}/is', $email)) {
        $error['email'] = "Por favor, pon un correo válido.";
    }
    // Check Message
    if (strlen($contact_message) < 15) {
        $error['message'] = "Por favor, coloca tu mensaje";
    }
    // Subject
    if ($subject == '') { $subject = "Contact Form Submission"; }


    // Set Message
    $message .= "Email from: " . $name . "<br />";
    $message .= "Email address: " . $email . "<br />";
    $message .= "Message: <br />";
    $message .= $contact_message;
    $message .= "<br /> ----- <br /> This email was sent from your site's contact form. <br />";

    // Set From: header
    $from =  $name . " <" . $email . ">";

    // Email Headers
    $headers = "From: " . $from . "\r\n";
    $headers .= "Reply-To: ". $email . "\r\n";
    $headers .= "MIME-Version: 1.0\r\n";
    $headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";


    if (!$error) {

        ini_set("sendmail_from", $siteOwnersEmail); // for windows server
        $mail = mail($siteOwnersEmail, $subject, $message, $headers);

        if ($mail) { echo "OK"; }
        else { echo "Oops! Algo ocurrió, por favor inténtalo de nuevo."; }



    } # end if - no validation error

    else {

        $response = (isset($error['name'])) ? $error['name'] . "<br /> \n" : null;
        $response .= (isset($error['email'])) ? $error['email'] . "<br /> \n" : null;
        $response .= (isset($error['message'])) ? $error['message'] . "<br />" : null;

        echo $response;

    } # end if - there was a validation error

}

?>

И, наконец, мой HTML-код выглядит следующим образом:

<div class="row section-header" data-aos="fade-up">
            <div class="col-full">
                <h1 class="display-2 display-2--light">Cuéntanos un poco más de tí para que empieces a vivir la experiencia Tech Consultant</h1>
            </div>
        </div>

        <div class="row contact-content" data-aos="fade-up">

            <div class="contact-primary">

                <h3 class="h6">Envíanos un mensaje</h3>

                <form name="contactForm" id="contactForm" method="post" action="/index.html" novalidate="novalidate">
                    <fieldset>

                    <div class="form-field">
                        <input name="contactName" type="text" id="contactName" placeholder="Nombre" value="" minlength="2" required="" aria-required="true" class="full-width">
                    </div>
                    <div class="form-field">
                        <input name="contactEmail" type="email" id="contactEmail" placeholder="Email" value="" required="" aria-required="true" class="full-width">
                    </div>
                    <div class="form-field">
                        <input name="contactSubject" type="text" id="contactSubject" placeholder="Asunto" value="" class="full-width">
                    </div>
                    <div class="form-field">
                        <textarea name="contactMessage" id="contactMessage" placeholder="¿Qué es lo que más te interesa de Tech Consultant?" rows="10" cols="50" required="" aria-required="true" class="full-width"></textarea>
                    </div>
                    <div class="form-field">
                        <button class="full-width btn--primary">Enviar</button>
                        <div class="submit-loader">
                            <div class="text-loader">Enviando...</div>
                            <div class="s-loader">
                                <div class="bounce1"></div>
                                <div class="bounce2"></div>
                                <div class="bounce3"></div>
                            </div>
                        </div>
                    </div>

                    </fieldset>
                </form>

                <!-- contact-warning -->
                <div class="message-warning">
                    ¡Algo ocurrió! Por favor, intenta de nuevo.
                </div> 

                <!-- contact-success -->
                <div class="message-success">
                    ¡Hemos recibido tu mensaje! Nuestros asesores se pondrán en contacto contigo<br>
                </div>

            </div> <!-- end contact-primary -->

Как я упоминал ранее, я получаю Не удалось загрузить ресурс: сервер ответил с ошибкой состояния 404 (Не найдено) иЯ не совсем уверен, почему.Если бы вы могли дать мне некоторое представление, это было бы удивительно!

Заранее благодарю за помощь!

Ответы [ 2 ]

0 голосов
/ 09 декабря 2018

Я внес некоторые изменения в ваш код, да, этот код не работал, я отсортировал то же самое на моем локальном хосте. Пожалуйста, сравните код:

Обновленный код: (HTML и JS код)

              $(document).ready(function () {
    /* local validation */
    $('#contactForm').validate({

        /* submit via ajax */
        submitHandler: function(form) {

            var sLoader = $('.submit-loader');

            $.ajax({

                type: "POST",
                url: "process.php",
                data: $(form).serialize(),
                beforeSend: function() { 

                    sLoader.slideDown("slow");

                },
                success: function(msg) {

                    // Message was sent
                    if (msg == 'OK') {
                        sLoader.slideUp("slow"); 
                        $('.message-warning').fadeOut();
                        $('#contactForm').fadeOut();
                        $('.message-success').fadeIn();
                    }
                    // There was an error
                    else {
                        sLoader.slideUp("slow"); 
                        $('.message-warning').html(msg);
                        $('.message-warning').slideDown("slow");
                    }

                },
                error: function() {

                    sLoader.slideUp("slow"); 
                    $('.message-warning').html("Algo ocurrió. Por favor, inténtalo de nuevo");
                    $('.message-warning').slideDown("slow");


                }

            });
        }

    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/jquery.validate.min.js"></script>
<div class="row section-header" data-aos="fade-up">
            <div class="col-full">
                <h1 class="display-2 display-2--light">Cuéntanos un poco más de tí para que empieces a vivir la experiencia Tech Consultant</h1>
            </div>
        </div>

        <div class="row contact-content" data-aos="fade-up">

            <div class="contact-primary">

                <h3 class="h6">Envíanos un mensaje</h3>

                <form name="contactForm" id="contactForm" method="post" novalidate="novalidate">
                    <fieldset>

                    <div class="form-field">
                        <input name="contactName" type="text" id="contactName" placeholder="Nombre" value="" minlength="2" required="" aria-required="true" class="full-width">
                    </div>
                    <div class="form-field">
                        <input name="contactEmail" type="email" id="contactEmail" placeholder="Email" value="" required="" aria-required="true" class="full-width">
                    </div>
                    <div class="form-field">
                        <input name="contactSubject" type="text" id="contactSubject" placeholder="Asunto" value="" class="full-width">
                    </div>
                    <div class="form-field">
                        <textarea name="contactMessage" id="contactMessage" placeholder="¿Qué es lo que más te interesa de Tech Consultant?" rows="10" cols="50" required="" aria-required="true" class="full-width"></textarea>
                    </div>
                    <div class="form-field">
                        <button class="full-width btn--primary">Enviar</button>
                        <div class="submit-loader">
                            <div class="text-loader">Enviando...</div>
                            <div class="s-loader">
                                <div class="bounce1"></div>
                                <div class="bounce2"></div>
                                <div class="bounce3"></div>
                            </div>
                        </div>
                    </div>

                    </fieldset>
                </form>

                <!-- contact-warning -->
                <div class="message-warning">
                    ¡Algo ocurrió! Por favor, intenta de nuevo.
                </div> 

                <!-- contact-success -->
                <div class="message-success">
                    ¡Hemos recibido tu mensaje! Nuestros asesores se pondrán en contacto contigo<br>
                </div>

            </div> <!-- end contact-primary -->

           

**Php Updated code**


<?php

// Replace this with your own email address
$siteOwnersEmail = 'your email id';


if($_POST) {
    $message = "";
    $name = trim(stripslashes($_POST['contactName']));
    $email = trim(stripslashes($_POST['contactEmail']));
    $subject = trim(stripslashes($_POST['contactSubject']));
    $contact_message = trim(stripslashes($_POST['contactMessage']));
    $error = array();

    // Check Name
    if (strlen($name) < 2) {
        $error['name'] = "Por favor, coloca tu nombre.";
    }
    // Check Email
    if (!preg_match('/^[a-z0-9&\'\.\-_\+]+@[a-z0-9\-]+\.([a-z0-9\-]+\.)*+[a-z]{2}/is', $email)) {
        $error['email'] = "Por favor, pon un correo válido.";
    }
    // Check Message
    if (strlen($contact_message) < 15) {
        $error['message'] = "Por favor, coloca tu mensaje";
    }
    // Subject
    if ($subject == '') { $subject = "Contact Form Submission"; }


    // Set Message
    $message .= "Email from: " . $name . "<br />";
    $message .= "Email address: " . $email . "<br />";
    $message .= "Message: <br />";
    $message .= $contact_message;
    $message .= "<br /> ----- <br /> This email was sent from your site's contact form. <br />";

    // Set From: header
    $from =  $name . " <" . $email . ">";

    // Email Headers
    $headers = "From: " . $from . "\r\n";
    $headers .= "Reply-To: ". $email . "\r\n";
    $headers .= "MIME-Version: 1.0\r\n";
    $headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";


    if (!$error) {
        //ini_set("sendmail_from", $siteOwnersEmail); // for windows server
        $mail = mail($siteOwnersEmail, $subject, $message, $headers);

        if ($mail) { echo "OK"; }
        else { echo "Oops! Algo ocurrió, por favor inténtalo de nuevo."; }

    } # end if - no validation error

    else {

        $response = (isset($error['name'])) ? $error['name'] . "<br /> \n" : null;
        $response .= (isset($error['email'])) ? $error['email'] . "<br /> \n" : null;
        $response .= (isset($error['message'])) ? $error['message'] . "<br />" : null;

        echo $response;

    } # end if - there was a validation error

}

?>

Дайте мне знать, если вам нужен zip для запуска кода, вы получите то же самое:

введите описание изображения здесь

0 голосов
/ 08 декабря 2018

Возможно, вы захотите попробовать почтальон , чтобы опубликовать данные формы вместо использования браузера.Если вы сделаете это, вы сможете узнать, работает ли ваш PHP-код нормально или нет, а затем сосредоточиться на коде JavaScript.

...