Verification - enter a unique key for each ajax call

As I develop a new app, I am aiming to separate the HTML/JS layer from the PHP layer in order to prepare for a potential phonegap version in the future.

One major concern I have is regarding authentication. Since I won't be able to rely on session variables this time, I need to come up with a different approach to handle authentication. Here's my plan:

  1. The user will input their login information and submit it via ajax to a PHP file.
  2. The PHP file will validate the login credentials and generate a key-token for that user. This token will be stored on the user's end (e.g. in MySQL) and sent back to the client side as JavaScript.
  3. The browser will receive the key-token and store it in session_storage.
  4. Each subsequent ajax request will include this token, which will then be verified by the PHP script.

Do you see any potential flaws in this plan? Is there a simpler or more effective solution available? My idea is loosely based on how PHP sessions work, but using a key-token instead of a session ID. Any advice would be greatly appreciated.

javascriptajaxauthentication

Answer №1

Utilizing session variables is not an option for me

Your description closely resembles a session, however, you are choosing to develop it from scratch rather than utilizing the established PHP session handler with its tested properties and adaptability. By doing this, you may introduce flaws in your implementation, even if you manage to avoid initial design issues.

I highly recommend sticking with the standard PHP mechanism (although you could explore more advanced save handlers, like enabling the multi-layer function).

If executed correctly, what you have described should work similar to the PHP handler - but in terms of security, based on the information provided, it does not seem secure.

Storing sessions allows for more secure operations without relying solely on SSL (though HTTPS is crucial for security). This is because you can pre-share encryption keys, although the initial key negotiation process is susceptible to vulnerabilities.

On the other hand, the method you've outlined is at risk of being intercepted, injected, and vulnerable to CSRF attacks.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Move on to a different screen in a React Component once the data has been fetched

Currently, I am delving into the world of React and TypeScript and attempting to utilize "react-router-dom" in order to create a login component that will interact with my backend server. Essentially, my goal is to develop a "Login" class that, upon form ...

javascriptreactjstypescriptreact-router

A configuration for ".node" files is missing: specifically, the loader for node_modules/fsevents/fsevents.node in a project using Vite

Everything was running smoothly in my Vite + React project until last week when out of nowhere, I encountered this error: No loader is configured for ".node" files: node_modules/fsevents/fsevents.node node_modules/fsevents/fsevents.js:13:23: 1 ...

javascriptnode.jsviteloaderfsevents

Find the nearest minute when calculating the difference between two dates

To determine the difference between dates and round to the nearest minute, you can choose to either round date1 or date2 up or down. The result returned is already rounded up to the full minute. You have the flexibility to modify date1 and date2, but do no ...

javascriptreactjsdatetimemomentjs

Adjust the CSS of a dynamically generated jQuery checkbox button in real-time

I am working on a project where I am creating a series of jQuery checkboxes dynamically within a loop. Here is how I am doing it: var checkbox = $('<input>').attr({type: 'checkbox', id: checkbox_id); panel.append(checkbox); panel ...

javascriptjquerycssjquery-ui

What could be causing my Javascript clock to malfunction?

I am having an issue with my clock code, which is supposed to display the date and time set 2 weeks in advance. Unfortunately, it is not working on either local or server environments. Can anyone help me troubleshoot this problem? Here is the code that I ...

javascriptjqueryhtmlclock

The function Waterline.create() is not available

Currently in the process of building a basic REST API using Sails.js and Waterline-ORM, I've encountered an issue regarding Post.create is not a function when trying to create an object within the ORM on a Post request. Here is my model: module.expor ...

javascriptsails.jsnodeswaterline

What is the preferred method for implementing a dynamic select control with Ajax

I'm having an issue with AJAX and MySQL in PHP. Can anyone offer assistance? Within my form, I have a select control: <form action="index.php" method="post" name="pretraga" class="border"> <p>Location:</p> <div ...

phpjavascriptmysqlajax

Connect ng-include URL to certain paths

I am working with multiple routes in my application: routes.js $routeProvider.when( '/dashboard/one', { templateUrl: 'partials/dashboard.html', controller: 'DashboardCtrl' }); $routeProvider.when( '/da ...

javascriptangularjsangular-ui-router

Validating usernames with parsley (version 2.8.1) using php

Despite reading all the documentation on the Parsley Js website, I am still struggling to understand how to set up custom validation based on AJAX responses. My specific challenge is to validate a username and check if it already exists in the database. I ...

phpajaxbootstrap-4parsley.js

How should res.render() and res.redirect() be properly utilized within Express framework?

I am struggling to understand the difference between res.render('viewname', {msg: 'Message' }) and res.redirect('route') The render function allows you to pass a "message", but the redirect function does not. However, ther ...

javascriptnode.jsexpress

What is the most effective way to transmit a conditional operator via a TypeScript boolean field?

Currently, as part of my transition to typescript, I am working on incorporating a conditional operator into the table component provided by Ant Design. const paginationLogic = props.data.length <= 10 ? false : true return ( <> ...

javascriptreactjstypescriptbooleanconditional-operator

Laravel method to send back JSON error messages through the use of an "error" object in the response

My aim is to utilize the "Bootstrap File-input" plugin for JQuery to facilitate file uploads via AJAX. This plugin expects error messages to be received in a JSON key labeled "error" as shown below: {error: 'You are not allowed to upload such a file. ...

phpjqueryjsonajaxlaravel

Searching and paginating through custom post types using an ajax call with $wpdb

I have recently developed a customized post type called "news" using Wordpress, and I am looking for a way to search through these posts and implement pagination without causing page reloads. Currently, I am utilizing the $wpdb class which is functioning ...

ajaxwordpress

What is the reason for having two plugin declarations within the galleriffic.js file?

I am currently working on enhancing the functionality of galleriffic.js by implementing a feature that will update a <div> element with text content as images are being changed. However, I am facing some challenges understanding the code. What perpl ...

javascriptjquery

Creating a schedule by aligning each day of the week with its corresponding date

weekly calendar<----img here--! I am looking to enhance my weekly table by incorporating a calendar system into it. Instead of just displaying the year in the image, I want it to showcase a 7-day week layout (for example: 12/20/20 - 12/27/2020), with ...

javascriptjquery

Using JQuery and AJAX, transfer information to the file input element

Currently, I am utilizing a JQuery library to crop images. Once the user clicks on the crop button, the cropped image (result) is sent back to the HTML page via AJAX as "file data". An example of this file data format is: data:image/png;base64,iVBORw0KGgo ...

phpjqueryajax

Ways to extract data from a JSON object

When using my web application, the Web API responds with the following JSON object: [ { "templateID":1, "template":"{\r\n \"Body\": \"sample date hete hee. Name\"\r\n}" }, { "templateI ...

javascriptarraysjsonregexreplace

vue utilize filtering to search through a nested array of objects within a parent array of objects

After making an API call, I receive JSON-formatted data with a specific structure like this: data = [ { name: 'John', school:[ { school_name: 'Harvard', date_attended: '2017-05-23' }, { schoo ...

javascriptvue.jscomputed-properties

Combine various arrays of objects into one consolidated object

Problem: There are untyped objects returned with over 100 different possible keys. I aim to restructure all error objects, regardless of type, into a singular object. const data = [ { "type":"cat", "errors" ...

javascripttypescriptreduce

What is the best way to update the innerHTML of a date input to reflect the current value entered by the user?

Currently, my task involves extracting data from a table by obtaining the innerHTML of each row. The table contains date inputs that can be manually adjusted or generated automatically. However, the innerHTML does not update accordingly. Thus, when exporti ...

javascripthtmljquery