How can I block the client from calling ajax function from console? - javascript

I'm working on a project and I've decided to execute submit forms with AJAX for multiple reasons and I have this function;
I've tried to call the delete(someid) function from the console of my browser and it worked; This is now a security concern;
How can I achieve this?
Below is a code snippet illustrating it:
function delete(someid) {
$.ajax({
type: 'POST',
url: 'delete',
data: {
id: 'someid'
}
});
}

I tried to call the delete(someid) function from the console in the browser and that worked wich is now a security issue.
This isn't a security issue from the client side. As far as I know, there is no way to disable people from using the console to call javascript to be used against your API, and even if it is possible there would be over 100 different ways of getting around that.
For this, the security issue would be from your server/api side, and you should be checking requests before doing any sort of actual deleting with server side code.
So the security issue that I saw if that any user can call the delete function with any given id " and that function will delete a persone from a database with the given id.
This would be a server side issue. You need to be doing some sort of authorization on the user. It's a pretty broad topic to answer in a single answer.
Generally the flow you would have, is the user makes a delete request to your server, the server would have some sort of information for the user sending the request (like an id), and the server would then check and see if the user with that id has the ability to delete users from the database.

Related

how to avoid logged users to use ajax by console?

Im using this ajax function to insert a product from an eccommerce site into the database.
I see that this method is very insecure, some experienced users with programming knowledge can use this ajax and insert products , or something else.
I read in others post that propose as a solution to use hidden input fields with a token, but as I said some experienced users with programming knowledge will find it.
Is there some REAL way to make this "add product" function secure without refreshing the page in every insert?
$(document).on('click','#save',function(e) {
var vidArt = $(".imagepreview").attr('value');
$.ajax({
data: {idArt: vidArt},
type: "POST",
url: "classes/add_to_cart.php",
success: function(data){
}
});
});
It doesn't matter if you design your API to be used by Ajax or by whole new page loads. An HTTP request is an HTTP request and people can make whatever HTTP requests they like.
There is no way to ensure that an HTTP request comes from code you have written.
However, that should not matter. If you are going to let the user add_to_cart using the user interface you designed, why worry if they add_to_cart using a user interface they designed?
If you want to impose restrictions (such as "Only products with an X in the name can be added") then impose those restrictions using your server-side code and not the user interface.

HTML form seems to be submitting *both* POST and GET?

This is not a duplicate of questions such as this, but rather the opposite: I have a form that I'm submitting via jQuery
$('<form>', {
action : 'service',
method : 'post',
target : '_blank'
}).append(
$('<input>', {
type : 'hidden',
name : 'payload',
value : JSON.stringify(payload)
})
).appendTo('body').submit().remove();
This is done so that I can open a different page with HTML.
Since I need to submit quite a lot of complex information, what I actually do is serialize them all into a big JSON string, then create a form with only one field ("payload") and submit that.
The receiving end has a filter that goes like this:
if the method is POST,
and there is only one submitted variable,
and the name of that one variable is "payload",
then JSON-decode its value and use it to create fake GET data.
So when the GET data grows too much I can switch methods without modifying the actual script, which notices no changes at all.
It always worked until today.
What should happen
The server should receive a single POST submission, and open the appropriate response in a popup window.
What actually happens instead
The server does receive the correct POST submission...
...apparently ignores it...
...and immediately after that, the browser issues a GET with no parameters, and it is the result of that parameterless GET that gets (pardon the pun) displayed in the popup window.
Quite unsurprisingly, this is always a "You did not submit any parameters" error. Duh.
What I already did
verified that this method works, and has always worked for the last couple of years with different forms and different service endpoints
tried replacing the form with a hardcoded <FORM> in HTML, without any jQuery whatsoever. Same results. So, this is not a jQuery problem.
tried with different browsers (it would not have helped if it only worked on some browsers: I need to support most modern browsers. However, I checked. Luckily, this failure reproduces in all of them, even on iPhones).
tried sending few data (just "{ test: 0 }").
tried halting the endpoint script as soon as it receives anything.
checked Stack Overflow. I found what seems to be the same problem, in various flavours, but it's of little comfort. This one has an interesting gotcha but no, it does not help.
checked firewalls, proxies, adblockers and plugins (I'm now using plain vanilla Firefox).
called the IT guys and asked pointed questions about recent SVN commits. There were none.
What I did not yet do
Check the HTTPS conversation at low level (I don't have sufficient access).
Compared the configuration, step by step, of a server where this works and the new server where it does not.
Quite clearly, put my thinking hat on. There must be something obvious that I'm missing and I'm setting myself up for a sizeable facepalm.
Use a tool like hurl.it or Postman to manually send a request to the server. The tools will nicely display the response from the server including all HTTP headers. I suspect the server responds with a redirect (Status code 30X) which leads to a GET request being issued after the POST completes.
Update: HTTP redirects
HTTP redirects do not necessarily use the same HTTP method or even the same data to issue a request to the redirect target. Especially for non-idempotent requests this could be a security issue (you don't generally want your form submission to be automatically re-submitted to another address). However, HTTP gives you both options:
[...] For this reason, HTTP/1.1 (RFC 2616) added the new status codes 303 and 307 [...], with 303 mandating the change of request type to GET, and 307 preserving the request type as originally sent. Despite the greater clarity provided by this disambiguation, the 302 code is still employed in web frameworks to preserve compatibility with browsers that do not implement the HTTP/1.1 specification.
[from Wikipedia: HTTP 302]
Also for 301s:
If the 301 status code is received in response to a request of any type other than GET or HEAD, the client must ask the user before redirecting.
[from Wikipedia: HTTP 301]

How to manually submit a post request to a server?

I am looking for a way to manually submit a Post request to a server, without using the website's UI. I can see the request headers and the post parameters in Firebug when I perform the action manually (clicking the UI's "submit" button). I am hoping there is a way to reverse engineer some Javascript using these headers and parameters so that we can automate this process.
Reason: My company recently purchased some process automation software that enables us to write automation bots that access out business partner's portal site and automatically adjust our digital marketing bids. For one of our partner sites, front-end manipulation doesn't appear to work, because the Post request is submitted via AJAX.
The software does allow us to execute custom javascript within the environment, so I am trying to construct some Javascript using the headers and request parameters.
Is there a standard template into which I can plug these parameters to execute Javascript that will send the Post request to the server?
Thank you
UPDATE:
Thank you all for your help! I've made some progress but am still having difficulty implementing the solution within the software.
The following request works when I run the code in Firebug in Firefox:
$.ajax({
type: "POST",
url: "http://acp.example.com/campaigns/122828",
data: "data-string"
});
However, the software we're using might be a little out of date and I'm not sure it recognizes the AJAX syntax.
Is there a way to effectively write the same statement above, but in Javascript rather than AJAX? Then I think it would work.
You can use AJAX to post data to a server without any direct UI interaction. I will break down a simple jQuery example below:
$.ajax({
type: "POST",
url: url,
data: data,
success: success,
});
$.ajax Is a method offered by the jQuery framework to make AJAX requests simple and cross browser compatible. As you can see I have passed in a JSON object containing various values:
type - This is the first key I have specified, in this instance you'll want this to be of the value POST as this determines the HTTP Request Method.
url - This specifies the server end point, for example: post/data/here.php would post the data to that url so that it can be picked up and handled correctly.
data - This key expects a JSON object, string or array of data to send in the POST request.
success - This key expects a function, it is called on the server's response to the request, with any relevant data passed through.
More documentation is available at: http://api.jquery.com/jquery.ajax/
If all you want to do is POST data, no JavaScript needed.
You should be able to use a browser extension for this. I have one called REST Console that is similar to what you describe. I believe REST Console is for Chrome only, but a quick Google search yielded a similar looking extension for FireFox called RESTClient.

POST manipulation, Tamper Data and AJAX security issues

Frequently when I work on AJAX applications, I'll pass around parameters via POST. Certain parts of the application might send the same number of parameters or the same set of data, but depending on a custom parameter I pass, it may do something completely different (such as delete instead of insert or update). When sending data, I'll usually do something like this:
$.post("somepage.php", {action: "complete", somedata: data, moredata: anotherdata}, function(data, status) {
if(status == "success") {
//do something
}
});
On another part of the application, I might have similar code but instead setting the action property to deny or something application specific that will instead trigger code to delete or move data on the server side.
I've heard about tools that let you modify POST requests and the data associated with them, but I've only used one such tool called Tamper Data for Firefox. I know the chances of someone modifying the data of a POST request is slim and even slimmer for them to change a key property to make the application do something different on the backend (such as changing action: "complete" to action: "deny"), but I'm sure it happens in day to day attacks on web applications. Can anyone suggest some good ways to avoid this kind of tampering? I've thought of a few ways that consist of checking if the action is wrong for the event being triggered and validating that along with everything else, but I can see that being an extra 100 lines of code for each part of the application that needs to have these kinds of requests protected.
You need to authorize clients making the AJAX call just like you would with normal requests. As long as the user has the rights to do what he is trying to do, there should be no problem.
You should also pass along an authentication token that you store in the users session, to protect against CSRF.
Your server can't trust anything it receives from the client. You can start establishing trust using sessions and authentication (make sure the user is who she says she is), SSL/TLS (prevent tampering from the network) and XSRF protection (make sure the action was carried out from html that you generated) as well as care to prevent XSS injection (make sure you control the way your html is generated). All these things can be handled by a server-side framework of good quality, but there are still many ways to mess up. So you should probably take steps to make sure the user can't do anything overly destructive for either party.

How to hide details in jquery ajax from browser page source

I am using jquery for all my ajax thing, I don't know if that is fine but I use that for now.
I have one text input when user type characters in it I call server side get some values and add them on the view.
Code that I use bellow works fine but I want to improve it a little.
How can I make this ajax call so that users that want to investigate my page source code can't see what I call here?
So basically I want to hide from page source what url, what type and data send I use here, is it possible?
$(function () {
$("#txtSearch").keyup(function (evt) {
$.ajax({
url: "/Prethors/Users/SearchUsers",
type: "POST",
data: "text=" + this.value,
success: function (result) {
$("#searchResult").prepend("<p>" + result + "</p>");
}
});
});
});
No, a user will always be able to figure out what calls you are making if you include it in javascript.
You can compress and minify the javascript, but a determined person will always be able to find your url calls.
Here's a js compression site, for example.
http://jscompress.com/
overall, you shouldn't worry about this. there is no way I'm aware of to hide your ajax calls, but you shouldn't need to.
-you could encrypt the info.
-you could use comet to stream the data on a persistent connection. (super complicated).
-follow good server security practices and not worry about it.
source: here
If you are really worried about this, you could set up kind of an anonymous URL, which will then redirect to where you really want to go based on some variable which is arbitrary.
for example, instead of going to "/Prethors/Users/SearchUsers"
go to "/AnonymousCall?code=5"
from which you could execute the code you want for searchusers
You can't hide client-side code. You can disguise it with minification but sensitive data should always be stored and processed on the server-side.
Use console.clear(); after you ajax calls :P
It just clears the reqs from the console but you still cannot hide client side calls.

Categories

Resources