Building protected "exclusive website sections" utilizing near-serverless website structure (AJAX template wizardry)

At the outset, I apologize if my English is not up to par; I will do my best to be as clear as possible. I am in the process of planning a web site with the following architecture:

The site will consist of static pages served to clients using JavaScript templates and ajax to load content, with the content being provided via an ASP.NET MVC application that sends JSON results to the client pages.

My question is quite straightforward: What methods can I employ to create private areas for users on my site?

The only solution that comes to mind is to implement a login page that sends encrypted login information to the server via ajax. The server would then return a token to be stored as a cookie. For subsequent calls to the server via ajax (specifically to access private areas), the token would need to be sent and authenticated, with the appropriate content provided as a result.

How can I go about implementing this system? What security and privacy issues should I be aware of?

For reference, I am utilizing C# on the server side, along with JQuery for basic ajax handling and Jquery.LoadJSON for content loading. I am also using Mustache in JavaScript to manage elements such as partials. I am seeking a solution that allows for easy and clear cookie management; any suggestions are welcome.

Thank you in advance!

c#javascriptasp.netasp.net-mvcajax

Answer №1

Utilizing the built-in ASP.NET Authentication mechanism is a viable option:

  • To meet the requirement, grant anonymous access to all pages.
  • Keep track of user authentication status using a JavaScript variable on the client side.
  • When accessing secure content/areas, utilize a common JavaScript function to determine if the current user is authenticated. If not, take necessary steps to authenticate the user.
  • In the case of forms-based authentication, the function should display a modal dialog prompting the user for credentials and then send these credentials to the server via an AJAX call. Validate the credentials on the server side and use FormsAuthentication.SetAuthCookie to indicate successful authentication to the ASP.NET runtime. The runtime will manage the authentication token.
  • For AJAX calls serving secure content, the server-side code should verify if the user is authenticated using 
    HttpContext.Current.User.Identity.IsAuthenticated
    . If not, consider redirecting to an error page or issuing a 401 response code (recommended for Windows authentication schemes). Custom authorization schemes can be added to AJAX calls for authenticated users.

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

Troubleshooting the issue of array filtering not functioning properly in Async.js

When attempting to utilize async's filter method, I am not receiving the expected result. Could someone point me in the right direction? async.filter([1, 3, 5], function (item, done) { done(item > 1); }, function (results) { con ...

javascriptnode.jsasync.js

Using JQuery to Customize Navigation Menu Targeting

On my website, I am trying to make an href button and a menu fade in as the page loads. However, I am struggling to find the correct code due to its placement within multiple tags, especially since I am new to JS and JQuery. I have provided a fiddle with a ...

javascriptjqueryhtmlcss

Having trouble accessing the loadTokenizer function in Tensorflow JS

As a beginner with Tensorflow.js concepts, I recently attempted to tokenize a sentence using the Universal Sentence Encoder in Javascript. You can explore more about it on Github Reference $ npm install @tensorflow/tfjs @tensorflow-models/universal-sentenc ...

javascriptnpmpackagetokenizetensorflow.js

Utilizing Javascript to export modules and call multiple functions simultaneously

Is there a way to automate the calling of all functions within a module instead of individually selecting each one? For instance: bettermovies.js module.exports={ printAvatar: function(){ console.log("Avatar"); }, printLord: funct ...

javascriptmoduleexport

Is it feasible to save BoxGeometries or MeshLambertMaterial in an array using Three.js?

var taCubeGeometryArray = new Array(); var taCubeMaterialArray = new Array(); taCubeGeometryArray.push(new THREE.BoxGeometry( .5, .5, .5)); taCubeMaterialArray.push(new THREE.MeshLambertMaterial({map: THREE.ImageUtils.loadTexture( "image.png" )})); Could ...

javascriptarraysthree.js

Error: Unable to access the `insertUsername` property as it is not defined

When I attempt to submit the login form created by the new.ejs file, instead of being redirected to the expected page, I am encountering an error message that reads: Cannot read property 'insertUsername' of undefined This same error message is ...

javascriptmysqlnode.jsexpressejs

Is it possible to manipulate an Angular #variableName in order to retrieve an ElementRef for an HTML element?

Suppose I have a scenario where I create a button like this: <button #myButton>My Button</button> ...and then use ViewChild in the following way: @ViewChild('myButton', { static: true }) createButton: ElementRef; In this case, creat ...

javascripthtmlangulartypescriptangular-material

What is the best way to retrieve an element from an array within a script?

As a newbie in the realm of vue and Laravel Framework, I am eager to fetch data from an API and display it dynamically on my web page. To achieve this, I have already set up a table named 'Progress' where I seeded some initial data. Utilizing AP ...

javascriptphphtmllaravelvue.js

Utilizing React Selector: Propagating the onChange Event Up Two Components

Struggling to pass an onChange event from React selector through two components back up to the parent App. The issue is that e.target.value is coming back as undefined, indicating that the event might not be returning properly. Can someone pinpoint what&ap ...

javascriptreactjsonchange

PHP/MySQL clarification regarding time slots

Could someone assist me with this discussion I found? Due to my low reputation, I am unable to comment for further clarification. Although I grasp the solution provided in the mentioned discussion, I am struggling to comprehend how to pass the data to my ...

javascriptphpjquerymysql

Convert a list to a JSON object utilizing the Json.NET library

I am using json.net to convert currency rates to JSON format. In the C# entity, there are Name and Value properties; where Name represents currencies like USD, GBP, etc. and Value holds the currency rate. Since I do not know the index of different curren ...

c#javascriptjson.net

What steps should I follow to set up the mapping of an array of ObjectIds using BsonClassMap?

Here is a C# class to consider: public class Role { public string Id { get; set; } public IEnumerable<string> Users { get; set; } } I am looking to configure the mapping of Users to an array of ObjectIds in MongoDB using BsonClassMap.Regist ...

c#.netmongodbserializationbson

Click on a button to completely remove all JavaScript from your website using jQuery

I'm currently experiencing some difficulties with my website Concept Studio. On a specific page, I have a typing animation within a form and I'd like to include a button that allows users to skip the animation. However, I'm unsure of how to ...

javascriptjquery

Obtaining a value from within an Angular 'then' block

I have a unique issue that I haven't been able to find a solution for on StackOverflow: Within an Angular 6 service, I am trying to call a function from another service using TypeScript. Here is the code snippet: Service1: myArray: Array<IMyInte ...

javascriptangulartypescriptpromise

Error encountered in Typescript when attempting to invoke axios - the call lacks a suitable overload

When I make a call to axios, I include a config object like this: const req = { method, url, timeout: 300000, headers: { 'Content-Type': 'application/json' } } axios(req) An error in TypeScript is thrown stating that "No overload matc ...

javascripttypescriptaxios

Is there a way to effortlessly scroll an element when the CSS overflow property is designated as auto?

I need help with creating a testimonial section where two divs automatically scroll inside a fixed-height container. Currently, only one div is scrolling while the other remains static in my code. I have implemented JavaScript for automatic scrolling wit ...

javascripthtmlcssbootstrap-4frontend

The method .depth() does not exist within this context

When I attempted to execute this code using npm start in the terminal //index.js const api = require('./api'); console.log('Starting monitoring!'); setInterval(async () => { //console.log(await api.time()); console.log(await ...

javascriptnode.jsfunctionapi

The table loaded with Jquery/AJAX is not appearing on Internet Explorer 9

I'm encountering an issue with a table loaded via Jquery/AJAX. function initializeDaily() { jQuery.post( 'ajax-functions.php', { 'action':'getdailyStatus' }, function(respons ...

jqueryajaxhtml-table

Encountering Error with NodeJS Typescript: Issue with loading ES Module when running sls offline command

I have come up with a unique solution using NodeJS, Typescript, and Serverless framework to build AWS Lambdas. To debug it locally in VS Code, I use the serverless-offline library/plugin. You can find my project on GitHub here However, when I run the comm ...

javascriptnode.jstypescriptecmascript-6serverless-framework

Angular cookies may expire, but using the back button always revives them

Utilizing angular's cookie library, I have successfully set a cookie to store the id and passcode of a shopping cart on the backend. However, despite setting the expiration date to a past time in order to expire the cookie once the cart is purchased, ...

javascriptangularjscookies