New at coding. So part of my assignment require me to validate login credentials through JSON.
user.json file would look something like this.. first is the email address then their password.
{
"mary#mary.com":"12345678",
"joseph#gmail.com":"293sfvdet"
}
my website will ask for the login and will go through JSON to validate the information. I am only allowed to use JSON, JS and HTML.I am definitely not familiar with JSON.
i would like to know how I could access my JSON file through JS and how i should go about using JSON for validation.
You may link your local json file in the page:
<script type="text/javascript" src="user.json"></script>
Then you can use it like:
var userdata = JSON.parse(user);
First of all (although you are maybe aware of this) this is not a secure way to implement a login at all but I assume, since this is for your assignment, this isn't really relevant to you.
Instead of writing your user data into a seperate JSON-file, you could just declare a constant inside your JS code like so:
const users = {
"mary#mary.com":"12345678",
"joseph#gmail.com":"293sfvdet"
}
After that you could just validate the entered credentials against this.
You may want to read this to learn more about javascript objects.
You're going to want to use Javascript to read the contents of the JSON file. (jQuery can help with this, if you're allowed to use a library, otherwise, look into fetch).
Then, you'll take the returned object that will look something like: response = { "mary#mary.com":"12345678", "joseph#gmail.com":"293sfvdet" } and you'll check to see if the email/password entered matches any record in the json.
var enteredEmail = 'mary#mary.com';
var enteredPassword = '12345678';
if(response[enteredEmail] == enteredPassword){
// login validated.
}
As other users have pointed out, storing user info in a JSON file like this is not a secure practice - nor is it practical. However, if it's just an assignment, this should work.
Related
Some URLs in my single-page-app (SPA) contain sensitive information like an access token, user information, etc.
Examples:
/callback#access_token=HBVYTU2Rugv3gUbvgIUY
/?email=username#example.com
I see that hotjar allows suppressing DOM elements and images from tracked data. Is it possible to hide params in URL or at least disable tracking for some pages?
Since you are saying that it is your SPA, you might solve the problem by switching from GET requests (which have the parameters inside the URL) to POST requests. I do not know hotjar, but if you tell the tracking service to analyze URLs only, that would be an option worth considering.
Another option frequently used is to obfuscate your parameters in the URL, see e.g. Best way to obfuscate an e-mail address on a website? However, that is never a really safe solution for sensitive data, since the de-ciphering step is too easy, in particular if your man-in-the-middle has all requests ever send to your SPA.
Edit. I just found in the Hotjar allows RegEx. Assuming you could enter a regular expression of URL-parts to exclude.
The general syntax /foo/bar/ means that foo should be replaced by bar, in our case, we want to delete the given snippet, that why it is /foo//.
For the given case of the access token, the regular expression would be
/callback#access_token=[a-zA-Z0-9]{15}//
and respectively for the email part of the URL
/\?email=(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")#(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9]))\.){3}(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9])|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])//
This second RegEx partially taken from How to validate an email address using a regular expression?
It seems to me that it's reasonable to assume that tracking scripts will try to access window.location.href or similar to get the current url which they will store.
So a possible solution would be create a dynamic scope which has a different value for window.location.href (with all sensitive info filtered out)
This is how it might work:
// get the tracker script as a string, so you can eval it in a dynamic scope
let trackerScript = 'console.log("Tracked url:", window.location.href)';
// now lets lock it up
function trackerJail(){
let window = {
location: {
// put your filtered url here
href: "not so fast mr.bond"
}
}
eval(String(trackerScript))
}
trackerJail()
If the tracking snippet is wrapped in a function it might be possible to create a dynamic scope for it without running eval by overriding it's prototype instead. But I'm not sure you can count on tracker scripts being wrapped in a neat function you can modify.
Also, there are a couple more ways the script might try to access the URL, so make sure to cover all the exits
If you control the page and order of scripts, you could read the data from the url then delete it before anything else can get to it.
proofOfConcept.html
<script id="firstThingToLoad.js">
console.log(window.location.href);
const keyRegex = /key=[^&]*/;
const key = window.location.href.match(keyRegex);
console.log("I have key", key);
const href = window.location.href.replace(keyRegex, "");
history.replaceState({}, "", href);
</script>
<script id="someSnoopyCode.js">
console.log("I'm snooping: ", window.location.href);
</script>
<body>
Link to private
</body>
Of course the Link to private should not exist as is. Also, this does break refresh and most navigation in general, though there are ways to catch and save that.
I'm building a message system to learn how it works, and I've already got
pretty much everything. I can log in and make a post on a board, but now I would like to be able to edit it. The back-end is ready, it receives a POST request
Basically what I need to do is check if the currently logged in user is the author of a certain post from Javascript to show or hide the edit button. I know how to tell if the user is logged in from PHP so that it blocks requests if you aren't the author, but I can't hide or show the buttons as the posts are dinamically generated from a <template> using JS.
Login snippet:
$_SESSION["userid"] = $userid;
Edit check PHP snippet (kinda pseudo-code):
if ($_POST["action"] == "modifypost" && isset($_POST["postid"]) && isset($_POST["content"]))
{
$post = get_post($_POST["postid"]);
if ($post.userid != $_SESSION["userid"])
{
die("you are not allowed");
}
//MySQL queries
}
Post dynamic generation (abbreviated):
function add_post(post) {
var t = document.querySelector('#historypost');
t.content.querySelector(".content").innerHTML = post.content;
var clone = document.importNode(t.content, true);
document.body.appendChild(clone);
}
I had originally thought of setting a variable with the user ID from HTML with <script> and <?php ?>, but then the user would be able to manually set that variable from the console and show the buttons.
I had originally thought of setting a variable with the user ID from HTML with <script> and <?php ?>
Yes, this is one correct approach. Basically, use PHP to tell JavaScript which posts actually belong to the current user.
but then the user would be able to manually set that variable from the console and show the buttons
True. There is no way to secure information from user-meddling once you've sent it to the browser. This is because the user is in control of what gets executed in the browser. Instead of thinking of the button visibility as a security feature, think of it as a convenience -- something to make the user experience more pleasing.
Application security is really enforced on the server. Just make sure that one user is not allowed to edit another user's posts, and do not trust what comes from the browser. Verify inputs.
Ideally, I would prefer to put the post rendering logic inside the server-side.
But as your solution is focused in javascript, an option makes PHP render a javascript variable that tells if the user is the post author.
Example:
Inside your PHP file, in the HTML render part you can do this:
<script>var isAuthor = '<?php echo ($post.userid == $_SESSION["userid"])'; ?></script>
Doing this you will have javascript script variable called isAuthor, that will have value "1" is the user is the author.
-
But as I said, this doesn't look like a good approach to solve the problem. It's something that PHP can handle better, without expose your logic to the client.
Hello I have a small website where data is passed between pages over URL.
My question is can someone break into it and make it pass the same data always?
For example let say, when you click button one, page below is loaded.
example.com?clicked=5
Then at that page I take value 5 and get some more data from user through a form. Then pass all the data to a third page. In this page data is entered to a database. While I observe collected data I saw some unusual combinations of records. How can I verify this?
yes. as javascript is open on the website, everyone can hack it.
you will need to write some code on you backend to validade it.
always think that you user/costumer will try to hack you sytem.
so take precautions like, check if user is the user of the session, if he is logged, if he can do what he is trying to do. check if the record that he is trying get exists.
if u are using a stand alone site, that u made the entire code from the ashes, you will need to implement this things by yourself.
like using the standard php session, making the data validation etc.
or you can find some classes that other people have made, you can find a lot o this on google. as it is a common problem of web programing.
if u are using a backed framework that isnt from another world, probably already has one. sp, go check its documentation.
html:
<a id = 'button-one' name = '5'> Button One </a>
javascript:
window.onload = function() {
document.getElementById('button-one').onclick = function() {
changeURL(this.attributes.name.value);
};
};
function changeURL(data) {
location.hash = data;
}
I need to create a check out form that would automatically select a zip code from the billing address on the form and match the zip code with an assigned email. Each email will have multiple zip codes assigned to them. The form that I currently have is in cgi and I am not sure if it can implement this since it doesn't actually run off a data base.
I am looking for any opinion on how to accomplish this with out creating a database.
I am familiar with java script, php and html (cgi), is there anyway to do this with out creating a database using java script?
If I cant come up with anything, I may have to re-do everything and use a SQL DB for it.
Thank you.
you can have a JSON object in the Form which will hold all the zip code and email. something like this -
<script type='text/javascript'>
var emails = [{zip:12345,email:'test#email.com'},{zip:12312,email:'test#email.com'},{zip:12123,email:'email#test.com'}];
</script>
then you can get the email address by iterating through the object array using javascript. if you use jquery then you would to something like this to iterate
$.each(emails,function(i,item){
if(item.zip == zip_code_in_address)
variable_to_hold_email = item.email;
});
check the JSFiddle here
I'm reading a boook on XSS attacks, and I've found an example about XSS filter evasion that is a little weird (IMHO).
This is the example text:
Another possible injection point that could exist is when the developer uses unsanitized
user input as part of the generated HTML within a script element. For example:
<script>
var query_string="<XSS>";
somefunction(query_string);
function somefunction {
...
}
</script>
It appears we have access to the inside of the JavaScript function. Let’s try adding some
quotes and see if we can jump out of the encapsulation:
<script>
var query_string="”<XSS>";
somefunction(query_string);
function somefunction {
...
}
<script>
It worked, and also caused a JavaScript error in the process as shown in Figure 3.38.
Let’s try one more time, but instead of trying to inject HTML, let’s use straight
JavaScript. Because we are in a script tag anyway, why not use it to our advantage?
<script>
var query_string="”;alert(“XSS”);//";
somefunction(query_string);
function somefunction {
...
}
</script>
the bold text is what I suppose to be the user input, taken for example from a form.
Back to my question: is there any way that this kind of attack works? For example, suppose somefunction(query_string) is used to run some sql query, and query_string is a product name to search within the database. If inside the search function I create sql_query = 'SELECT name FROM table WHERE name = "'+query_string+'"';, I think there's no way to inject some string with quotes to "jump out of the encapsulation", i.e inputting YAY";alert('hi');// will not change the JS to this:
var query_string = [user input, in this case YAY";alert('hi');//]
function abc(query_string){
sql_query = "select name FROM table WHERE name = 'YAY';
alert('hi');//
....
}
Am I wrong? What do you think? Can you make me a simple example (if it possible) on how this kind of attack can make some sort of damages?
I thought about something like an online shop, but assuming the JS is not used on server side, the only thing this attack can do is modify the query string and then submit it to the server..
Hope you can understand what I wrote and what I'd like to understand, thanks, best regards.
You should only look at the first line. The rest doesn't come into play in this xss example. It's a badly chosen example. So take this much simple example
var first_name="<XSS>";
In this example <xss> is user generated content. So your e.g. php code looks like this
var first_name="<? echo $firstName; ?>";
$firstName is taken from some database or something else, and was generated by the user who typed it into some textfield. Say the user typed: ";alert("XSS");//. PHP will generate the following code
var first_name="";alert("XSS");//";
Pretty printed:
var first_name="";
alert("XSS");
//";
As you see the user was able to run his code alert("XSS") in every other users browser that visited the page. In this example nothing bad will happen except some alert box, but the user might inject some code that gets the cookie info and sends it to some server, so the attacker can steal someone's login session.
This same problem - forgetting to escape user generated content - also applies for creating sql queries, but this isn't related to this example. The creator of this example should have used query_string in his example, as it is obviously confusing.