Secure ajax data for submission - javascript

I am trying to use AJAX to securely submit data to a script. After collecting the below values, I am trying to somehow, transmit the collected values, securely, to process.php however, I have never done this before.
I appreciate any suggestions on how to encrypt or somehow secure the below data and submit it with ajax.
My JQuery
$('.process-button').click(function(){
var processNum = $('.process-num').val();
var month = $('.process-month').val();
var amount = $('.charge-amount').val();
$.ajax({
url: "process.php",
type: "post",
success: function(data){
alert(data);
}
});
});
Many thanks in advance!

There may be more that others can point out, but a few security concepts I can think of:
Transmit data using HTTPS. You may need to set up your server software for this. The page you post from may also need to be in HTTPS (so that it will be the same domain)
Do not include any information in the URL, like you often might in a GET request. (ie, POST "provider/patienthistory/patients/frankgumby/"). This is mostly handled by doing it as a POST request.
On PHP, do not trust off the bat that the information is coming from that Javascript call. Assume someone is sending requests from a random page on your site, with made-up data, and ensure said person cannot do anything malicious.

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.

Is it possible to execute an external URL in the client side and get JSON response by using PHP?

I got a URL from a ecommerce website and when i access it i get all the last 5 products that i've visited in their site. I don't know how it works, i guess it's because of the cookie that this ecommerce website have left in my browser.
I would like to use this URL to show in my website something like this: "The Last 5 Products You Have Seen at X Ecommerce Website".
But to do that this URL must be executed in somehow in the client side and i will still need to get the JSON content returned by this URL.
Is there exist anyway to do that by using PHP or any other web technology?
Thank you!
It might be cookies, localStorage (there are other APIs to save data on local computer, imo they are unused or deprecated e.g. openDatabase) or last views could be connected with account and saved on internal database.
You should use AJAX, but by default in browser mechanism called CORS blocks all requests coming from other domain than resource.
In PHP you can download external page using file_get_contents function or cURL library, but without localStorage/cookies (which can be accessed from JS executed on domain, where that cookies are saved).
AJAX is your option for client side requests. Here's the jQuery guide for it.
https://api.jquery.com/jquery.ajax/
Here's a quick example:
$.ajax({
url: "http://ecommerce.com/your/url/here",
method: 'get',
dataType: 'json', //if you're sure its returning json you can set this
success: function(data) {
//handle success json here
//be sure that you're going to receive json though, possibly could receive some other data type and you should handle appropriately
},
error: function(error) {
//handle error json here
}
});

Changing a ajax request to a different php file vulnerability, potential exploit clarification

I am creating an application, that accepts a ajax call (jquery) and returns the validated user an entry token to the website.
Say for example the ajax is called checkAuth.php and there are all the other php files in this directory. By changing the JS to validate another file like checkMail.php for example:
var xmlRequest = $.ajax({
url: "checkAuth.php",
processData: false,
data: xmlDocument
});
change the url to checkMail.php and create a vulnerability in the site?
var xmlRequest = $.ajax({
url: "checkMail.php",
processData: false,
data: xmlDocument
});
Although the result would return a different object but by doing so would this create an "open door" perhaps where the malicious user would keep sending requests in order to gain access? I understand that the user would have to know that the php file exists however I am unsure how to process this securely whilst maintaining my directory structure.
Please note this is not my actual code and I cant clarify the answer with these other posts or I am not understanding this correctly.
Edit: In addition - would this mean that any site using jquery would be able to ajax request any file from the server and create a vulnerability?
How to authenticate an AJAX request to a PHP file?
Question regarding Ajax Hacking
Ajax Security questions
How to send secure AJAX requests with PHP and jQuery
In general, any AJAX request can access all files which accessible via http request like as user types full URL as the browser address.
So, you have to check security token or something else in the begining of PHP-scripts.
You can restrict access to folders or files using .htaccess, see https://stackoverflow.com/a/11729748/3325396

Minimising server access with heavy javascript webpage

I've been working on a webpage that has a PHP backend to access a database and generate the basic page HTML. Once loaded, all user interaction is controlled by javascript.
To communicate back to the server I'm using the traditional post method:
jQuery.ajax({
type: 'POST',
url: ajaxurl,
data: postdata,
success: function(data) {
// PHP returns data
}
});
However, the moment I start communicating back to the server using this method, I create lag in the UI and the user experience suffers, especially if they have a slow connection. I've got the usual loading gif spinners and progress bars where appropriate, but I want the UI to be as instant as it can be.
The primary reason I'm going back to the server is to grab information from the database. I've been wondering if there are ways to remove this?
1) Download the database data and access it directly in Javascript? Completely removing to need to go to the server to retrieve data. Is this possible? Are there any libraries for this?
2) In general, are there more efficient ways to retrieve data from a server than using the post method?
Some possible solutions are to preload data where possible, turn on caching on server side if needed, optimize your queries to database, do not return whole html from POST etc.

Setting cookies in flask vs JS

I'm writing a small web-store, The backend is written in Flask, and I'm using jQuery to display popups, filter some inputs, etc.
There's a very simple cart, and I've ran into one question while making it.
I was thinking of storing the id's of each product selected (along with the amount) in cookies, and to generate the 'cart' part of the page via JS by accessing them.
Currently, I'm setting the cookies by POSTing an AJAX call to the server, which then updates the cookies.
Javascript:
$('#addcart_' + this_id).click(function() {
$.ajax({
type: "POST",
url: '/cart/',
data: JSON.stringify({"id": this_id, "amount": total_amt}),
contentType: "application/json; charset=UTF-8",
datatype: 'json',
async: false
});
});
And in Flask:
#app.route('/cart/', methods=["POST"])
def cart_update():
if request.method == "POST":
data = request.get_json()
# more code
return resp # response with cookies
Now, I was wondering, is there any point in actually doing that? I just need to store some data in cookies, and doing a call to Flask doesn't seem to add anything, so perhaps I could just set them via JS and live happily ever after?
Or are there some downsides?
There is absolutely no need to make a server-side call to set the selected products cookie. Updating it on the client side is much preferred, as it takes out all of the latency from the transaction.
Another thing to consider though is that your cookie will be sent along with every server-bound request. If you don't need this behavior (and you are fine with the browser support for it) you can use localStorage and only send back the selected values when the user checks out.

Categories

Resources