简体   繁体   中英

Sanitizing/Validating a PHP contact form which submits using jQuery

So I have a basic mail() contact form which POSTS data via a jQuery script and I want to validate and sanitize the data. Obviously the main reason is for security but also to prevent any errors. At the moment the only form of validation is in the HTML (IE type="tel") which obviously isn't enough, nor secure.

My question is how should I secure this script? In the jQuery or PHP. Sorry but I'm fairly new to this kind of stuff. (EDIT- I'm wondering how to specifically secure this. An example code, a tutorial etc. -EDIT)

index.html

<div class="order_info">
    <form id="order-form" class="order_form" action="php/order.php" method="post">
        <input id="or_name" class="or_field" required type="text" name="or_name" placeholder="Name*"> 
        <input id="or_company" class="or_field" type="text" name="or_company" placeholder="Company Name">
        <input id="or_email" class="or_field" required type="email" name="or_email" placeholder="Email*">
        <input id="or_tel" class="or_field" type="tel" name="or_tel" placeholder="Phone">
        <select id="or_package" class="or_field" required name="or_package">
            <option value="" selected disabled>Select Package*</option>
            <option value="Starter">Starter</option>
            <option value="Business">Business</option>
            <option value="Premier">Premier</option>
        </select>
        <textarea id="or_tarea" class="or_field" required name="or_details" placeholder="Project Details*"></textarea>
        <input id="or_submit" class="or_button" type="submit" value="SUBMIT!">
    </form>
</div>

custom.js

$(window).load(function(){
    "use strict";
    $('.order_info .order-form').each( function(){
        var form = $(this);
        //form.validate();
        form.submit(function(e) {
            if (!e.isDefaultPrevented()) {
                jQuery.post(this.action,{
                    'or_name':$('input[name="or_name"]').val(),
                    'or_company':$('input[name="or_company"]').val(),
                    'or_email':$('input[name="or_email"]').val(),
                    'or_tel':$('input[name="or_tel"]').val(),
                    'or_package':$('select[name="or_package"]').val(),
                    'or_details':$('textarea[name="or_details"]').val(),
                },function(data){
                    form.fadeOut('fast', function() {
                        $(this).siblings('p.newsletter_success_box').show();
                    });
                });
                e.preventDefault();
            }
        });
    }); 
});

order.php

<?php
$field_name = $_POST['or_name'];
$field_company = $_POST['or_company'];
$field_email = $_POST['or_email'];
$field_tel = $_POST['or_tel'];
$field_package = $_POST['or_package'];
$field_details = $_POST['or_details'];

$mail_to = 'email@email.com'; //Change to your email
$subject = 'Enquiry from '.$field_name.' ('.$field_company.')'; //Change to your subject

$body_message = 'From: '.$field_name."\n";
$body_message .= 'Company: '.$field_company."\n";
$body_message .= 'E-mail: '.$field_email."\n";
$body_message .= 'Phone: '.$field_tel."\n";
$body_message .= 'Package: '.$field_package."\n";
$body_message .= 'Details: '.$field_details;

$headers = 'From: '.$field_email."\r\n";
$headers .= 'Reply-To: '.$field_email."\r\n";

mail($mail_to, $subject, $body_message, $headers);
?>

IMO, you should validate and the data on the client side (JQuery) and then validate and/or sanitize it on the server side (PHP). The reason is that validation on the client side is user friendly because of the speed, and you can target specific areas of the page. Really, both are needed for different reasons. Here is a page with more information:

https://luxsci.com/blog/secure-web-pages-and-web-forms-what-you-need-to-know.html

I would not recommend doing everything on the client side because forms can be submitted directly to the server, thus bypassing JQuery validation.

http://php.net/manual/en/security.database.sql-injection.php

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM