I've deployed a simple Flask Application on Apache2 in Ubuntu 16.04 x64(Alibaba Cloud) with mod_wsgi. I'm using mysql as my database server on the same ubuntu server instance. The python version is 3.5.
In the backend of the application I'm processing data from some database queries from some relatively large database tables.
In frontend page, I'm visualizing the data I'm expecting to get from the backend by D3PLUS JS library. And, in a single page, I'm showing 4 charts/graphs in 4 html divs and two other divs to show text data. All of the requests for the data is currently handled by ajax post.
I've ensured CSRF protection for ajax request by
var csrf_token = "{{ csrf_token() }}";
$.ajaxSetup({
beforeSend: function(xhr, settings) {
if (!/^(GET|HEAD|OPTIONS|TRACE)$/i.test(settings.type) && !this.crossDomain) {
xhr.setRequestHeader("X-CSRFToken", csrf_token);
}
}
});
The post request requires around 20-25 seconds to get response normally from the backend. Here is the example of the post request:
$('#company_button').on('click', function(event) {
var company_name = ($('#company_select').select2('data'))[0].text;
if (company_name==null){
alert('Enter a name please!');
}
else{
handle_all(company_name);
}
event.preventDefault();
});
function handle_all(company_name){
show_loader();
//baike_getter(event,company_name);
//recommend_getter(company_name);
$.ajax({
type:"POST",
contentType: "application/json; charset=utf-8",
data : JSON.stringify({company_name : company_name}),
dataType: "json",
url: flask_util.url_for('_company_info_all'),
success: function (data) {
JSON.parse(data[0].recommendation);
remove_loader();
update_company(data[0].company_general[0]);
all_graphs(data[0].country,data[0].product,data[0].haiguan,data[0].shipping);
recommend_getter2(company_name);
baike_getter2(event,company_name);
}
});
}
The size of the JSON data got as response is around 5-10 KB and it includes Chinese text(Unicode).
The problem is that after two-three times of sending the batch(Actually only one request which handles processing everything in backend) of post request to backend, when data comes as response, the page freezes forever.
Any help will be encouraged. Thanks in advance !
Edit/Update: The charts/graphs I'm generating in this page are tree_map,pie,2 bar charts. All are with .format({"locale":"zh_CN"}). Version used D3Plus V1
Related
I'm working on a progressive page loading script where new pages will load continuously when bottom of the page is reached. I'm using ajax to fetch the data dynamically through jQuery ajax from the server, the return data will return the url of the new post as well as its content.
My problem is what code should I use to submit my returned post url to analytic so that it registers as a valid page view?
$.ajax({
type: 'GET',
url: 'http://somedomain.com/fetch_pages.php',
data: { 'page': this.$loadMoreCounter , 'section': that.$section },
dataType: 'json',
success: function (data) {
//analytic code upon each successful callback.
});
i am making an ajax call to fetch event for rendering a fullcalendar.
i am using a webmethod written in c#.
the ajax call is being made from an aspx page.
my site is a sharepoint 2010 site.
the calendar is being rendered using fullcalendar.js
i am facing the below issue :
the calendar works perfectly in most of the browsers and machines. but in some machine it doesn't render the events and when i look into the developer tool of the browser. it show me a
500 internal server error
in my ajax post call status.
can anyone tell me that what are the possible reasons for this error.
below is my call syntax along with the webmethod.
$.ajax({
url: 'PublicCauseList.aspx/GetCalendarItems',
type: "POST",
async: false,
data: data,
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function (data) {
}
},
error: function (error) {
console.log("Error in fetching calendar events.");
}
});
[WebMethod]
public static string GetCalendarItems(string courtSelected, DateTime start, DateTime end)
{
}
thanks
I have got an AJAX request running on a server with varnish. The request is as follows:
(function() {
$("#name").autocomplete({
minLength:3, //minimum length of characters for type ahead to begin
source: function (request, response) {
$.ajax({
type: 'GET',
url: php_vars.var_1, //your server side script
dataType: 'json',
data: {
postcode: request.term
},
success: function (data) {
alert("Success");
}
});
}
});
})();
For the url, I use wp_localize_scripts and array with the absolute URL of the php script. I have consoled this url before this script and it is ok.
I have this setup on a server not running with varnish and it works fine. However on my server with varnish, I have noticed that the request URL is not correct (should be "auspost.php" and instead it is the page url with the query params). On my none varnish server the GET request url is correct.
It looks like varnish is caching my GET requests. Any advice would be very much appreciated! I can pastebin my vcl config if need be?
For ajax requests you should have the following header available
X-Reqeusted-With: XMLHttpRequest
In your varnish vcl_recv you can check if this header is present and force a pass.
if (req.http.X-Requested-With == "XMLHttpRequest"){
return (pass);
}
I am trying to save an image from android emulator to drupal site using drupalgap, but I am unable to do this, below is my ajax call which I wrote to save the data to drupal site.
My AJAX call
$.ajax({
url: "http://192.168.1.146/drunew/?q=my_services/node.json",
type: 'post',
data: 'node[type]=drupalgap&node[title]=' + encodeURIComponent(title) + '&node[language]=und&node[body][und][0][value]=' + encodeURIComponent(body) + '&node[files][field_filef_und_0]=' + encodeURIComponent(filef),
dataType: 'json',
beforeSend: function (request) {
request.setRequestHeader("X-CSRF-Token", token);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert('page_node_create_submit - failed to login');
console.log(JSON.stringify(XMLHttpRequest));
console.log(JSON.stringify(textStatus));
console.log(JSON.stringify(errorThrown));
},
success: function (data) {
$.mobile.changePage("main.html", "slideup");
}
});
But the above code is not working for file field, then after doing some R&D I got to know that first we have to get the fid, then save it.
Below is the respone after creating the fid for the image.
{"fid":"47","uri":"http://192.168.1.146/drunew/my_services/file/47"}
Here my doubt is how can I integrate this response in my above ajax call to save the image in drupal site.
Any help, thanks..
Once you have the File ID, you pass that along with the Node Create/Update resource like so:
Node Create - POST
http://www.example.com/?q=drupalgap/node.json&title=Hello&type=article&field_images[und][0][fid]=47
Node Update - PUT
http://www.example.com/?q=drupalgap/node/123.json&field_images[und][0][fid]=47
FYI, this feature is now built into DrupalGap core, so you shouldn't have to do much when adding/editing nodes.
Im making a Login whit facebook.
using the javascript sdk im geting the response (i guess is JSON), and i want to send this response to a php file to check if the user is in the database or not.
so heres what i got so far.
this is the function i call when the user is loged into facebook.
function testing(){
FB.api('/me', function(response) {
response = JSON.stringify(response);
//call another function, sending the data recived
ajaxlog(response);
});
}
and here is the ajaxlog function
function ajaxlog(facedatos){
$.ajax({
type: "POST",
url: "facebook-ajax-login.php",
dataType: "json",
data: facedatos,
success: function(response){
//the php brings the conect response true or false
if(response.conect==true){
$("#exist").html(response.data);
}else{
}
},
beforeSend: function(){
$("#exist").html("<img class='img-responsive ajax-l' style='width:40px;padding-top:10px;margin-right:10px;' src='images/ajax-loader.gif' />")
}
});//<!--ajax-->
im doing alerts and the facebook data comes with no problem. i think the issue is how i send the data by post, im not reciving the data in the php
I find the issue by myself,
the problem is that i was sending the post request whitout a name.
in the ajax function changed
data: facedatos,
for
data:{
face: facedatos
}
and in the php recived the data as $_POST["face"];