I've a simple MVC model. I'm doing an Ajax request where I send some data to be processed by PHP and retrieve database records as JSON. As this object could be quite large, is there some way I could compress/encrypt it on the PHP (server side) and decrypt it on the Javascript side (client)
$.ajax({
url: "/php/function/link/",
dataType: 'json',
data: {
"date": date,
},
type: "POST",
success: function(_data){
// load encrypted data here and decrypt it.
},
error: function() {
alert("Some error fetching!");
}
I tried using the following methods, but they didn't seem to work (I was getting error while decompressing them on the javascript end):
JSONC
https://stackoverflow.com/a/11901649/1443702
Are there any other better ways?
I simply need to :
compress data on javascript to be passed from client->send it to server (PHP) -> decompress it and compute database queries -> compress it -> pass it to javascript(client side) -> decompress it
The best way is just to enable HTTP traffic compression in web server. All modern browsers and servers support it. Read more about HTTP_compression. And you will have additional bonus: all your traffic will be compressed, not AJAX traffic only.
For php - You can try this: http://rosettacode.org/wiki/LZW_compression#PHP
For JavaScript - http://rosettacode.org/wiki/LZW_compression#JavaScript
Ideally you should avoid sending large data set unless the use case is unavoidable. I would suggest you to reconsider your design. But recently I ran into similar use-case as part of product requirement where I needed to compress handle 5MB of JSON data (partially) in JavaScript. I tried the above and was able achieve 50% compression.
Related
So my team has made a small tool to perform Image Annotation and Labeling. And we were trying to optimize our code.
We were able to compress data from the server, but we have been trying to perform compression on data that is being sent from client to server.
What data you may ask, its just text file around 2 - 3mb.
Is there any way we can perform compression?
We are using JavaScirpt and want to send to FLASK.
This is the first question i am posting on here :)
You can try with this lib: Paco-zlib
var binaryString = pako.deflate("2-3mb text content", { to: 'string' });
// Here you can do base64 encode, make xhr requests and so on.
But at server side, responding page will receive compressed data. You shoud decompress it using something like zlib.decompress(compressedData)
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
}
});
I have seen at several places developers are using JSON.stringify(data) while making an Ajax call to the server for the serialization of post data in JSON string, but why it is needed ?
$.ajax({
url: url,
type: "POST",
data: JSON.stringify(data),
contentType: "application/json",
complete: callback
});
You have to encode the data using some method in order to send it over HTTP.
JSON is a standard format that supports common data structures like arrays. This lets you describe most kinds of data that you would want to send.
Several modern frameworks are capable to directly bind JSON data structures to their model businesses, this allows for a incredibly fast and easy relationship between client and server data models.
This way you can work feely on your client side with js objects, on the moment that you send data to the server via AJAX, you just stringify these objects to allow the server end to understand them, and in an automatic way your server will be able to translate that info to your server data classes, without further interaction needed (of course, you will need defined classes that are compatible with your client model data structures).
I am trying to get a CSV file from the following URL (http://s3.amazonaws.com/misc-ww/data.csv) and parse the data in this file on the fly. What I am trying to achieve by parsing the data in the file is important, feel free to look at the file if you wish to make suggestions on it; however my current problem lies in getting the data in the file itself. When using either XMLHttpRequest, or an Ajax call, or a JSONP call; the response is always returning with error. Meaning that the file for some reason cannot be accessed.
After researching for a few hours, I am sure this has got to do with some kind of security restriction (cross domain request), sadly I have not come any closer to understanding how to get around it. For sample purposes I have created a jsFiddle highlighting my attempt at retrieving the CSV file via an AJAX JSONP call (code seen below).
HTML
<button>Click me to get the CSV File</button>
Javascript
function getCSV() {
$.ajax({
url: "http://s3.amazonaws.com/misc-ww/data.csv",
type: 'get',
dataType: 'jsonp',
success: function(data) {
alert("Success: " + data);
},
error: function(jqXHR, textStatus, errorThrow){
alert("Error: " + jqXHR['responseText']);
}
});
}
$('button').click(function() {
getCSV();
});
My main goal is to be able to achieve this via Javascript alone, however I do welcome any answers that involve jQuery. I am aware of javascript frameworks that could allow this to work for me, but in my case I need to code without them.
You cant really bypass CORS with JSONP calls if server doesn't support them. Its more the way server don't have to set "Access-Control-Allow-Origin: *" header. Instead server can send respond inside callback function to bypass straight JSON response. So your problem is that you .csv file is not wrapped inside a callback function.
So server which supports JSONP and gets ?callback=cbFunc it will print:
cbFunc('here is my file content')
Now you are asking .csv file and server is sending it without wrapping it to callback function. That's why you end up with security restriction.
Long story short: You cant get file via AJAX JSONP like that because s3.amazonaws.com does not support JSONP.
here is nice explanation about JSON and JSONP: http://json-jsonp-tutorial.craic.com/index.html
Sorry about repeating myself.
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.