How do I save encoded password entries when using DataTables Editor?

How do I save encoded password entries when using DataTables Editor?

pansengtatpansengtat Posts: 66Questions: 26Answers: 1
edited July 2014 in Editor

I would like to know how do I save both the encrypted user's password and its password-salt into an existing MySQL table when using Editor for DataTables. I am currently using XAMPP (phpMyAdmin v4.1.12, PHP v5.5.11, Windows 8.1 x64). Here are the codes that I currently have:

JavaScript File

var editor; // use a global for the submit and return data rendering in the examples

(function($){
    $(document).ready(function() {
        editor = new $.fn.dataTable.Editor({
            ajax: "php/manageUsersEditor.php",
            table: "#manageusers",
            fields: [{
                    label: "Rank:",
                    name: "Login.RankID"
                },{
                    label: "Status:",
                    name: "Login.Status",
                    type: "select",
                    ipOpts: [
                        { label: "Active", value: "1"},
                        { label: "Inactive", value: "0"}
                    ]
                }
            ]
        } );
        
        adder = new $.fn.dataTable.Editor({
            ajax: "php/manageUsersAddEditor.php",
            table: "#manageusers",
            fields: [{
                    label: "Username:",
                    name: "Login.Username"
                },{
                    label: "Email:",
                    name: "Login.Email",
                },{
                    label: "Password:",
                    name: "Login.Password",
                    type: "password"
                },{
                    label: "Rank:",
                    name: "Login.RankID"
                },{
                    label: "Status:",
                    name: "Login.Status",
                    type: "select",
                    ipOpts: [
                        { label: "Active", value: "1"},
                        { label: "Inactive", value: "0"}
                    ]
                }
            ]
        } );
     
        $('#manageusers').dataTable( { // INCLUDE IDENTIFIER FOR THE FORM HERE.
            dom: "Tfrtip",
            ajax: "php/manageusersEditor.php", // PHP CODE FOR THE EDITOR
            columns: [  //  COLUMN DATA TO BE DISPLAYED
                { data: "Login.ID" },
                { data: "Login.Username" },
                { data: "Login.Email" },
                { data: "Login.RankID" },
                { data: "Login.Status" }
            ],
            tableTools: {
                sRowSelect: "os",
                aButtons: [
                    { sExtends: "editor_create", editor: adder},
                    { sExtends: "editor_edit",   editor: editor}
                ]
            }
        } );
    } );
}(jQuery));

PHP Code for adding a new user (this is where the Password field is concerned)

<?php
    // DataTables PHP library
    include( "lib/DataTables.php" );
    
    // Alias Editor classes so they are easy to use
    use
        DataTables\Editor,
        DataTables\Editor\Field,
        DataTables\Editor\Format,
        DataTables\Editor\Join,
        DataTables\Editor\Validate;
     
    $data = Editor::inst($db, 'RazerLogin', 'ID')
        ->field(
            Field::inst('Login.ID')->set(false),
            Field::inst('Login.Username')->validator( 'Validate::notEmpty'),
            Field::inst('Login.Email')->validator( 'Validate::email'),
            Field::inst('Login.Password')->validator( 'Validate::notEmpty'),
            Field::inst('Login.RankID')->validator('Validate::numeric'),
            Field::inst('Login.Status')->validator('Validate::notEmpty')
        )
        ->process($_POST)
        ->data();
    
    echo json_encode($data);

Answers

  • pansengtatpansengtat Posts: 66Questions: 26Answers: 1
    edited July 2014

    Somehow, I am confused as to whether I should generate the password-salt on the Editor.js file instead of the server-side PHP script. Here goes:

    $('#manageusers').dataTable( { // INCLUDE IDENTIFIER FOR THE FORM HERE.
                dom: "Tfrtip",
                ajax: {
                    "url": "php/manageusersEditor.php", // PHP CODE FOR THE EDITOR
                    "data" : {
                        "PWSalt" : genSalt()
                    }
                },
                columns: [  //  COLUMN DATA TO BE DISPLAYED
                    { data: "Login.ID" },
                    { data: "Login.Username" },
                    { data: "Login.Email" },
                    { data: "Login.RankID" },
                    { data: "Login.Status" }
                ],
                tableTools: {
                    sRowSelect: "os",
                    aButtons: [
                        { sExtends: "editor_create", editor: adder},
                        { sExtends: "editor_edit",   editor: editor}
                    ]
                }
            } );
    

    Notice that I added the "data" section under "ajax".
    I defined genSalt() as a function at the top of this JS script.
    Now I am thinking about storing the password-salt into the hidden field for the Editor (Adder) form. Thing is, how do I pass this salt (string) to the database when the user clicks "Create"?

    Code for the hidden field:

    adder = new $.fn.dataTable.Editor({
                ajax: "php/manageUsersAddEditor.php",
                table: "#manageusers",
                fields: [{
                        //... cut snippet {
                        label: "Salt:",
                        name: "Login.PWSalt",
                        type: "hidden"
                    } //... cut snippet
                ]
            } );
    
  • DaimianDaimian Posts: 62Questions: 1Answers: 15

    I am by no means an expert on network security, but generating the encryption salt with javascript and sending it to the server even using a top notch SSL screams security flaw.

    I would generate it serverside with PHP.

  • pansengtatpansengtat Posts: 66Questions: 26Answers: 1
    edited July 2014

    Hmmm... you're right. In that case, I wrote the PHP function for the encryption salt (I quickly removed the JS code), but question now is that I am not exactly sure how to intercept the Ajax call to the server when the user finishes keying in his/her user account details after clicking Create in the Editor.

    (Notice, that I added an additional field for PWSalt to attempt to save into the DB; this is an update to the PHP code I posted earlier)

    $data = Editor::inst($db, 'Login', 'ID')->field(
    Field::inst('Login.ID')->set(false),
    Field::inst('Login.Username')->validator( 'Validate::notEmpty'),
    Field::inst('Login.Email')->validator( 'Validate::email'), 
    Field::inst('Login.Password')->validator( 'Validate::notEmpty'), 
    Field::inst('Login.PWSalt')->validator( 'Validate::notEmpty'),
    Field::inst('Login.RankID')->validator('Validate::numeric'),
    Field::inst('Login.Status')->validator('Validate::notEmpty')
    )
    ->process($_POST)
    ->data();
    
    echo json_encode($data);
    
  • pansengtatpansengtat Posts: 66Questions: 26Answers: 1

    I rephrased my question into a new thread. Please see this for a more clear question: https://datatables.net/forums/discussion/22306/how-do-i-send-perform-additional-data-on-server-side-php-with-editor#latest

This discussion has been closed.