+ {{ content | expand_urls: root_url }}
+
+ 
+ Google+
+
+ Follow @{{ site.twitter_user }}
+ {% endif %} +A little something about me.
++ Copyright © {{ site.time | date: "%Y" }} - {{ site.author }} - + Powered by Octopress +
diff --git a/.themes/classic/source/_includes/custom/head.html b/.themes/classic/source/_includes/custom/head.html new file mode 100644 index 0000000..85879f4 --- /dev/null +++ b/.themes/classic/source/_includes/custom/head.html @@ -0,0 +1,3 @@ + + + diff --git a/.themes/classic/source/_includes/custom/header.html b/.themes/classic/source/_includes/custom/header.html new file mode 100644 index 0000000..35f9c05 --- /dev/null +++ b/.themes/classic/source/_includes/custom/header.html @@ -0,0 +1,6 @@ + +'+(repos[i].description||'')+'
" + this.cook(it.d) + ""; + if (it.n) { + str += "" + this.cook(it.n) + "\n"; + } + if (it.t.length > 0) { + for (var i = 0; i < it.t.length; i++) { + var tag = it.t[i]; + str += " " + this.cook(tag).replace(/^\s+|\s+$/g, '') + " "; + } + } + str += "
'+''+prettyDate(tweets[t].created_at)+''+linkifyTweet(tweets[t].text.replace(/\n/g, '
'), tweets[t].entities.urls)+'
Debuggify is a simple cloud based full-stack debugging service which enhances the modern web development experience.
- -Debugging software is hard and also time consuming process. Its involves a lot of advance technologies, techniques and tools. As the web is evolving faster than ever and so are the technologies involved in developing a website.
- -The websites have moved from static pages to complex web applications which depends on the following
- -With HTML5, CSS3, & ES6 the browsers are upgrading continuously. There is big diversity in the browser vendors. Even the different versions of same vendors doesn’t have similar behavior for same api.
- -Due to high dependency on third party and bleeding edge browser environment, makes web application development even more complex process.
- -We are dedicated to build easy to use tools and technologies which helps developers not only build great and robust applications but also boost their productivity.
- -Normally the ajax pull data from self hosted as well 3rd party hosted APIs. In both cases, the failure of ajax request has to handled at both ends, but front end is more important because of its high impact on the user experience. In case of 3rd party APIs, there is any way no possibility to have control over back-end, so front-end is the default choice.
- -The browser behaves differently when it comes to make a ajax calls for same origin and ajax call for cross origin, and therefore exceptional handling also have to different.
- -In jQuery, the simplest way to catch all the ajax errors and exceptions on a web page
- -$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-
- // This is the default error handler for ajax request.
-
- // Extract all the information required to understand.
- var requestResponse = {
- url: ajaxSettings.url,
- method: ajaxSettings.type,
- data: ajaxSettings.data,
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- data: ajaxSettings.data
- };
-
- console.error(requestResponse)
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
-});
-One important thing to note here is this handler is not called for cross-domain scripts and cross-domain JSONP requests which made its easy to avoid any ajax errors happening in application other than your native javascript code.
- -Note If $.ajax() or $.ajaxSetup() is called with the global option set to false, the .ajaxError() method will not fire.
Apart from this generic handler, it is possible to have a dedicated error handler for each type of request.
- -$.ajax({
-
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- error: function(jqXHR, textStatus,errorThrown) {
- var requestResponse = {
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- };
-
- console.log(requestResponse);
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
- }
-});
-Event this dedicated handler is not called for cross-domain script and cross-domain JSONP requests.
- -The limitation for ajax exception handlers is not just a jQuery limitation, but it is a javascript limitation. The reason behind this limitation is that most browser are not giving permissions to access error messages for cross domain scripts due to security reasons.
- -There are some solutions (or workarounds) for this. (Reference stackoverflow )
- -First one, if backend is accessible, set (in my example PHP) headers to allow a cross domain call. When you do this, then JavaScript accepts the call, and no crossdomain tricks are needed.
- - header('Access-Control-Allow-Origin: http://domain1.com, http://domain2.com'); //whitelist
-Secondly if there is no access to backend, a timeout based workaround can be used to get a error callback
- -$.ajax({
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- success: start_map,
- timeout: 2000, // 2 seconds timeout before error function will be called
- dataType: 'script',
- crossDomain: true
-});
-This is a nasty trick to solve the problem as it can definitely screw up things for slow internet connection.
- -Another alternative option is using the jQuery plugin jquery-jsonp. This plugin is using script onload / onerror method along with timeout to get the error callback.
-]]>We have added this functionality, and to simplify it, we have come with 3 new APIs
- -Using this api, its possible to set an alias to the unique user identification used by the debuggify. This make it easy to map a debuggify user identifier to your site username or email id. Remember the old data will not have alias.
- -debuggify.alias('foo@example.com');
-Its pretty straight forward to use the above api.
- -Note Make sure every unique user should be given the one alias to avoid any data inconsistency.
- -To attach custom data along with every message
- -debuggify.metadata({'login': true});
-To attach custom data along with a single message. This api need to be called on the logger object
- -var ajaxErrors = debuggify.Logger.get('ajax_errors');
-
-ajaxErrors.attach({
- type: 'POST',
- url: '/api/notification'
-});
-
-ajaxErrors.error('Error in Notification Api');
-After calling attach, it must be followed by the one of the logging Apis like .log, .error, .warn, .debug or .message to push that data to the server.
Note: The attached data will expire after its once used by logging Api’s. To send data with every request use .metadata api
We soon be adding use cases on how to use this APIs more powerfully.
-]]>Setup Php, mysql & phpmyadmin:
- - sudo apt-get install php5-fpm php-apc mysql-server mysql-client phpmyadmin nginx
-Enter your MySQL password and phpmyadmin webinterface password when prompted
- -Enable mysql extension by editing /etc/php5/fpm/php.ini
- -sudo vim /etc/php5/fpm/php.ini
-Add the following line and save
- -extension=mysql.so
-Restart to use new config
- - sudo /etc/init.d/php5-fpm restart
- sudo /etc/init.d/nginx restart
-Next create a basic nginx vhost configuration in /etc/nginx/sites-available/ directory as follows:
- -sudo vim /etc/nginx/sites-available/phpmyadmin
-And add the following:
- -server {
-
- listen 80;
- server_name admin.lvh.me lvh.me;
- root /var/www/phpmyadmin;
- if ($http_host != "admin.lvh.me") {
- rewrite ^ http://admin.lvh.me$request_uri permanent;
- }
- index index.php index.html;
- location = /favicon.ico {
- log_not_found off;
- access_log off;
- }
- location = /robots.txt {
- allow all;
- log_not_found off;
- access_log off;
- }
- # Make sure files with the following extensions do not get loaded by nginx because nginx would display the source code, and these files can contain PASSWORDS!
- location ~* \.(engine|inc|info|install|make|module|profile|test|po|sh|.*sql|theme|tpl(\.php)?|xtmpl)$|^(\..*|Entries.*|Repository|Root|Tag|Template)$|\.php_ {
- deny all;
- }
- # Deny all attempts to access hidden files such as .htaccess, .htpasswd, .DS_Store (Mac).
- location ~ /\. {
- deny all;
- access_log off;
- log_not_found off;
- }
- location ~* \.(jpg|jpeg|png|gif|css|js|ico)$ {
- expires max;
- log_not_found off;
- }
- location ~ \.php$ {
- try_files $uri =404;
- include /etc/nginx/fastcgi_params;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- }
-
- location /phpmyadmin {
- root /usr/share/;
- index index.php index.html index.htm;
- location ~ ^/phpmyadmin/(.+\.php)$ {
- try_files $uri =404;
- root /usr/share/;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_index index.php;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- include /etc/nginx/fastcgi_params;
- }
- location ~* ^/phpmyadmin/(.+\.(jpg|jpeg|gif|css|png|js|ico|html|xml|txt))$ {
- root /usr/share/;
- }
- }
- location /phpMyAdmin {
- rewrite ^/* /phpmyadmin last;
- }
-}
-To enable that vhost, we create a symlink to it from the /etc/nginx/sites-enabled/ directory:
- -cd /etc/nginx/sites-enabled/
-sudo ln -s /etc/nginx/sites-available/phpmyadmin phpmyadmin
-Reload nginx for the new configuration to take effect:
- -sudo /etc/init.d/nginx reload
-Open the link in the browser http://admin.lvh.me/phpmyadmin
-]]>
Yeah, IE thowing error in javascript comment. For some time I didnot believe what I am seeing, but gradually I came to my senses. Like most developers, first thing I did was started cursing IE on twitter, but later reality struct me and that is to find a solution to this mess.
- -I dig in a lot of wrong places until I found conditional comments in IE. A sample of how the conditional logic works is below
- -<script>
-/*@cc_on
-
- @if (@_jscript_version == 10)
- document.write("You are using IE10");
-
- @elif (@_jscript_version == 9)
- document.write("You are using IE9");
-
- @elif (@_jscript_version == 5.8)
- document.write("You are using IE8");
-
- @elif (@_jscript_version == 5.7 && window.XMLHttpRequest)
- document.write("You are using IE7");
-
- @elif (@_jscript_version == 5.6 || (@_jscript_version == 5.7 && !window.XMLHttpRequest))
- document.write("You are using IE6");
-
- @elif (@_jscript_version == 5.5)
- document.write("You are using IE5.5");
-
- @else
- document.write("You are using IE5 or older");
-
- @end
-
-@*/
-</script>
-To fix this all I need to do is to remove the whole comment. This comment is anyways useful for sourcemaps supported browsers which is long way to go for IE.
- -Anyways this is just a hack for the time being. The sourcemap specs has been updated due to this problem. To know more check the uglifyjs issue on github
- -Finally all I have to say is God Bless IE Developers
Here is the presentation
- - - - - - -I will be explaining each point in details in the future posts.
- -I know I have abandoned the blog for long time but not any more. Stay connected for more.
- -Happy Debugging !!
-]]>With the rise of compiled to javascript languages it hard to traceback the errors to original source. Almost all modern provides the window.onerror api to catch all uncaught exceptions on a page. This api provides very limited information (error message, filename and line number only) which is the root cause of many problems.
- -With modern web development practices the amount of javascript code per page is growing rapidly. Also this code is minified by the minification tools(like Google Closure Compiler, UglifyJS2 etc) to reduce the code size. After minification whole code ends in one single line. Here is where most problem starts. I am listing some really annoying issues related to window.onerror below
- -Missing Char No: The char no is very important for the minified code to point at the exact statement as there is only one line in minified code. Even source maps cannot be helpful in tracking back to original line.
No Call Stack: The call stack is completely hidden from the developer so its hard to identify the functions flow. However there is a trick to extract stack in IE9 only.
Cross Origin Errors: These types are thown when some cross origin permission is broken. They are very common on pages with facebook like and google plus widget installed. For such errors window.error message throw a single message “Script Error”. As per stackoverflow post this behavior is intentional to avoid some security risks but its at expense of useful debugging information.
Most of above mentioned problems are roadblock in debugging production websites / applications. There is a need for better tools and libraries for the job.
- -I will soon be writing a post on Best Debugging Practices For Javascript In Production Environment
-]]>I was born 6 years back when I bought my first computer and a internet connection. To be frank, Internet is a second home to me. For most of people out there who feel same, are continuously trying to make Internet a better place.
- -I am also a computer science engineering grad, so I am surrounded by technology. In order to feed my engineering inquisitiveness I have explored the black, white and gray sections of the internet.
- -I am a full stack web developer by profession and have authored / co-authored many 3rd party social plugins for Shareaholic Inc which runs on thousands of different blogs and websites driving 1+ billion pageviews per month. These plugins can be installed on different CMS/blogging platform like Wordpress, Drupal, Tumblr, Blogger etc. While working on these plugins I closely interact with the different elements of the modern internet ecosystem.
- -- -A 3rd party plugin has to be robust enough to work in 3rd party environments while interacting with 3rd party apis and support every major browser vendor out there
Elaborating the above quote
- -doesn't break itself and neither the websitegood page load timenot conflict with other existing pluginssupport major browser vendors including internet explorersupport legacy browser versions like ie6 ie7 etc.As all wise developers know
- -- -Zero Bugs is a Myth
I have talked to a few friends about the problems. All are encountering similar set of problems on the daily basic. A majority their development time is spend in debugging and fixing bugs. The debugging is also becoming hard due to the evolving nature of the web.
- -So I finally decided to go on a quest to make Internet a better place for developers.
- -- -Developers are the keepers of the modern internet.
The web is evolving because of the developers. There are around 1+ million developers on the planet. I can build something that make developers more productive and can save up to 1hr/day of their time, it’s going to be revolutionary. Developers can reinvest this time in open source projects, new innovations or anything that eventually make Internet a better place
- -So that is Debuggify is all about. Contact me if you want to join me on my quest.
-]]>I was born 6 years back when I bought my first computer and a internet connection. To be frank, Internet is a second home to me. For most of people out there who feel same, are continuously trying to make Internet a better place.
- -I am also a computer science engineering grad, so I am surrounded by technology. In order to feed my engineering inquisitiveness I have explored the black, white and gray sections of the internet.
- -I am a full stack web developer by profession and have authored / co-authored many 3rd party social plugins for Shareaholic Inc which runs on thousands of different blogs and websites driving 1+ billion pageviews per month. These plugins can be installed on different CMS/blogging platform like Wordpress, Drupal, Tumblr, Blogger etc. While working on these plugins I closely interact with the different elements of the modern internet ecosystem.
- -- -A 3rd party plugin has to be robust enough to work in 3rd party environments while interacting with 3rd party apis and support every major browser vendor out there
Elaborating the above quote
- -doesn't break itself and neither the websitegood page load timenot conflict with other existing pluginssupport major browser vendors including internet explorersupport legacy browser versions like ie6 ie7 etc.As all wise developers know
- -- -Zero Bugs is a Myth
I have talked to a few friends about the problems. All are encountering similar set of problems on the daily basic. A majority their development time is spend in debugging and fixing bugs. The debugging is also becoming hard due to the evolving nature of the web.
- -So I finally decided to go on a quest to make Internet a better place for developers.
- -- -Developers are the keepers of the modern internet.
The web is evolving because of the developers. There are around 1+ million developers on the planet. I can build something that make developers more productive and can save up to 1hr/day of their time, it’s going to be revolutionary. Developers can reinvest this time in open source projects, new innovations or anything that eventually make Internet a better place
- -So that is Debuggify is all about. Contact me if you want to join me on my quest.
-Scott Hanselman blogged about JavaScript the assembly language for the web. There a plenty of languages that compiles to javascript. With the addition of Dart from Google and Typescript from Microsoft a war has broke out for better.
- -With the rise of compiled to javascript languages it hard to traceback the errors to original source. Almost all modern provides the window.onerror api to catch all uncaught exceptions on a page. This api provides very limited information (error message, filename and line number only) which is the root cause of many problems.
- -With modern web development practices the amount of javascript code per page is growing rapidly. Also this code is minified by the minification tools(like Google Closure Compiler, UglifyJS2 etc) to reduce the code size. After minification whole code ends in one single line. Here is where most problem starts. I am listing some really annoying issues related to window.onerror below
- -Missing Char No: The char no is very important for the minified code to point at the exact statement as there is only one line in minified code. Even source maps cannot be helpful in tracking back to original line.
No Call Stack: The call stack is completely hidden from the developer so its hard to identify the functions flow. However there is a trick to extract stack in IE9 only.
Cross Origin Errors: These types are thown when some cross origin permission is broken. They are very common on pages with facebook like and google plus widget installed. For such errors window.error message throw a single message “Script Error”. As per stackoverflow post this behavior is intentional to avoid some security risks but its at expense of useful debugging information.
Most of above mentioned problems are roadblock in debugging production websites / applications. There is a need for better tools and libraries for the job.
- -I will soon be writing a post on Best Debugging Practices For Javascript In Production Environment
-Today I had great time sharing my experience on javascript debugging with the javascript ninja community at Bangalore
- -Here is the presentation
- - - - - - -I will be explaining each point in details in the future posts.
- -I know I have abandoned the blog for long time but not any more. Stay connected for more.
- -Happy Debugging !!
-Last week, I was writing code in javascript when I found something that completly blew off my mind. This is what I found
- -
Yeah, IE thowing error in javascript comment. For some time I didnot believe what I am seeing, but gradually I came to my senses. Like most developers, first thing I did was started cursing IE on twitter, but later reality struct me and that is to find a solution to this mess.
- -I dig in a lot of wrong places until I found conditional comments in IE. A sample of how the conditional logic works is below
- -<script>
-/*@cc_on
-
- @if (@_jscript_version == 10)
- document.write("You are using IE10");
-
- @elif (@_jscript_version == 9)
- document.write("You are using IE9");
-
- @elif (@_jscript_version == 5.8)
- document.write("You are using IE8");
-
- @elif (@_jscript_version == 5.7 && window.XMLHttpRequest)
- document.write("You are using IE7");
-
- @elif (@_jscript_version == 5.6 || (@_jscript_version == 5.7 && !window.XMLHttpRequest))
- document.write("You are using IE6");
-
- @elif (@_jscript_version == 5.5)
- document.write("You are using IE5.5");
-
- @else
- document.write("You are using IE5 or older");
-
- @end
-
-@*/
-</script>
-To fix this all I need to do is to remove the whole comment. This comment is anyways useful for sourcemaps supported browsers which is long way to go for IE.
- -Anyways this is just a hack for the time being. The sourcemap specs has been updated due to this problem. To know more check the uglifyjs issue on github
- -Finally all I have to say is God Bless IE Developers
Setup Php, mysql & phpmyadmin:
- - sudo apt-get install php5-fpm php-apc mysql-server mysql-client phpmyadmin nginx
-Enter your MySQL password and phpmyadmin webinterface password when prompted
- -Enable mysql extension by editing /etc/php5/fpm/php.ini
- -sudo vim /etc/php5/fpm/php.ini
-Add the following line and save
- -extension=mysql.so
-Restart to use new config
- - sudo /etc/init.d/php5-fpm restart
- sudo /etc/init.d/nginx restart
-Next create a basic nginx vhost configuration in /etc/nginx/sites-available/ directory as follows:
- -sudo vim /etc/nginx/sites-available/phpmyadmin
-And add the following:
- -server {
-
- listen 80;
- server_name admin.lvh.me lvh.me;
- root /var/www/phpmyadmin;
- if ($http_host != "admin.lvh.me") {
- rewrite ^ http://admin.lvh.me$request_uri permanent;
- }
- index index.php index.html;
- location = /favicon.ico {
- log_not_found off;
- access_log off;
- }
- location = /robots.txt {
- allow all;
- log_not_found off;
- access_log off;
- }
- # Make sure files with the following extensions do not get loaded by nginx because nginx would display the source code, and these files can contain PASSWORDS!
- location ~* \.(engine|inc|info|install|make|module|profile|test|po|sh|.*sql|theme|tpl(\.php)?|xtmpl)$|^(\..*|Entries.*|Repository|Root|Tag|Template)$|\.php_ {
- deny all;
- }
- # Deny all attempts to access hidden files such as .htaccess, .htpasswd, .DS_Store (Mac).
- location ~ /\. {
- deny all;
- access_log off;
- log_not_found off;
- }
- location ~* \.(jpg|jpeg|png|gif|css|js|ico)$ {
- expires max;
- log_not_found off;
- }
- location ~ \.php$ {
- try_files $uri =404;
- include /etc/nginx/fastcgi_params;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- }
-
- location /phpmyadmin {
- root /usr/share/;
- index index.php index.html index.htm;
- location ~ ^/phpmyadmin/(.+\.php)$ {
- try_files $uri =404;
- root /usr/share/;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_index index.php;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- include /etc/nginx/fastcgi_params;
- }
- location ~* ^/phpmyadmin/(.+\.(jpg|jpeg|gif|css|png|js|ico|html|xml|txt))$ {
- root /usr/share/;
- }
- }
- location /phpMyAdmin {
- rewrite ^/* /phpmyadmin last;
- }
-}
-To enable that vhost, we create a symlink to it from the /etc/nginx/sites-enabled/ directory:
- -cd /etc/nginx/sites-enabled/
-sudo ln -s /etc/nginx/sites-available/phpmyadmin phpmyadmin
-Reload nginx for the new configuration to take effect:
- -sudo /etc/init.d/nginx reload
-Open the link in the browser http://admin.lvh.me/phpmyadmin
-In the past we have received many requests related to attach some custom data along with every messages collected.
- -We have added this functionality, and to simplify it, we have come with 3 new APIs
- -Using this api, its possible to set an alias to the unique user identification used by the debuggify. This make it easy to map a debuggify user identifier to your site username or email id. Remember the old data will not have alias.
- -debuggify.alias('foo@example.com');
-Its pretty straight forward to use the above api.
- -Note Make sure every unique user should be given the one alias to avoid any data inconsistency.
- -To attach custom data along with every message
- -debuggify.metadata({'login': true});
-To attach custom data along with a single message. This api need to be called on the logger object
- -var ajaxErrors = debuggify.Logger.get('ajax_errors');
-
-ajaxErrors.attach({
- type: 'POST',
- url: '/api/notification'
-});
-
-ajaxErrors.error('Error in Notification Api');
-After calling attach, it must be followed by the one of the logging Apis like .log, .error, .warn, .debug or .message to push that data to the server.
Note: The attached data will expire after its once used by logging Api’s. To send data with every request use .metadata api
We soon be adding use cases on how to use this APIs more powerfully.
-The web had already shifted from static web pages to ajax driven websites for good. This shift have made the web awesome and faster but have introduced some new problems which need to taken care of . One of these is failed ajax requests. There are many reasons for a ajax request to fail, some of them are
- -Normally the ajax pull data from self hosted as well 3rd party hosted APIs. In both cases, the failure of ajax request has to handled at both ends, but front end is more important because of its high impact on the user experience. In case of 3rd party APIs, there is any way no possibility to have control over back-end, so front-end is the default choice.
- -The browser behaves differently when it comes to make a ajax calls for same origin and ajax call for cross origin, and therefore exceptional handling also have to different.
- -In jQuery, the simplest way to catch all the ajax errors and exceptions on a web page
- -$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-
- // This is the default error handler for ajax request.
-
- // Extract all the information required to understand.
- var requestResponse = {
- url: ajaxSettings.url,
- method: ajaxSettings.type,
- data: ajaxSettings.data,
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- data: ajaxSettings.data
- };
-
- console.error(requestResponse)
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
-});
-One important thing to note here is this handler is not called for cross-domain scripts and cross-domain JSONP requests which made its easy to avoid any ajax errors happening in application other than your native javascript code.
- -Note If $.ajax() or $.ajaxSetup() is called with the global option set to false, the .ajaxError() method will not fire.
Apart from this generic handler, it is possible to have a dedicated error handler for each type of request.
- -$.ajax({
-
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- error: function(jqXHR, textStatus,errorThrown) {
- var requestResponse = {
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- };
-
- console.log(requestResponse);
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
- }
-});
-Event this dedicated handler is not called for cross-domain script and cross-domain JSONP requests.
- -The limitation for ajax exception handlers is not just a jQuery limitation, but it is a javascript limitation. The reason behind this limitation is that most browser are not giving permissions to access error messages for cross domain scripts due to security reasons.
- -There are some solutions (or workarounds) for this. (Reference stackoverflow )
- -First one, if backend is accessible, set (in my example PHP) headers to allow a cross domain call. When you do this, then JavaScript accepts the call, and no crossdomain tricks are needed.
- - header('Access-Control-Allow-Origin: http://domain1.com, http://domain2.com'); //whitelist
-Secondly if there is no access to backend, a timeout based workaround can be used to get a error callback
- -$.ajax({
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- success: start_map,
- timeout: 2000, // 2 seconds timeout before error function will be called
- dataType: 'script',
- crossDomain: true
-});
-This is a nasty trick to solve the problem as it can definitely screw up things for slow internet connection.
- -Another alternative option is using the jQuery plugin jquery-jsonp. This plugin is using script onload / onerror method along with timeout to get the error callback.
-Setup Php, mysql & phpmyadmin:
- - sudo apt-get install php5-fpm php-apc mysql-server mysql-client phpmyadmin nginx
-Enter your MySQL password and phpmyadmin webinterface password when prompted
- -Enable mysql extension by editing /etc/php5/fpm/php.ini
- -sudo vim /etc/php5/fpm/php.ini
-Add the following line and save
- -extension=mysql.so
-Restart to use new config
- - sudo /etc/init.d/php5-fpm restart
- sudo /etc/init.d/nginx restart
-Next create a basic nginx vhost configuration in /etc/nginx/sites-available/ directory as follows:
- -sudo vim /etc/nginx/sites-available/phpmyadmin
-And add the following:
- -server {
-
- listen 80;
- server_name admin.lvh.me lvh.me;
- root /var/www/phpmyadmin;
- if ($http_host != "admin.lvh.me") {
- rewrite ^ http://admin.lvh.me$request_uri permanent;
- }
- index index.php index.html;
- location = /favicon.ico {
- log_not_found off;
- access_log off;
- }
- location = /robots.txt {
- allow all;
- log_not_found off;
- access_log off;
- }
- # Make sure files with the following extensions do not get loaded by nginx because nginx would display the source code, and these files can contain PASSWORDS!
- location ~* \.(engine|inc|info|install|make|module|profile|test|po|sh|.*sql|theme|tpl(\.php)?|xtmpl)$|^(\..*|Entries.*|Repository|Root|Tag|Template)$|\.php_ {
- deny all;
- }
- # Deny all attempts to access hidden files such as .htaccess, .htpasswd, .DS_Store (Mac).
- location ~ /\. {
- deny all;
- access_log off;
- log_not_found off;
- }
- location ~* \.(jpg|jpeg|png|gif|css|js|ico)$ {
- expires max;
- log_not_found off;
- }
- location ~ \.php$ {
- try_files $uri =404;
- include /etc/nginx/fastcgi_params;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- }
-
- location /phpmyadmin {
- root /usr/share/;
- index index.php index.html index.htm;
- location ~ ^/phpmyadmin/(.+\.php)$ {
- try_files $uri =404;
- root /usr/share/;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_index index.php;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- include /etc/nginx/fastcgi_params;
- }
- location ~* ^/phpmyadmin/(.+\.(jpg|jpeg|gif|css|png|js|ico|html|xml|txt))$ {
- root /usr/share/;
- }
- }
- location /phpMyAdmin {
- rewrite ^/* /phpmyadmin last;
- }
-}
-To enable that vhost, we create a symlink to it from the /etc/nginx/sites-enabled/ directory:
- -cd /etc/nginx/sites-enabled/
-sudo ln -s /etc/nginx/sites-available/phpmyadmin phpmyadmin
-Reload nginx for the new configuration to take effect:
- -sudo /etc/init.d/nginx reload
-Open the link in the browser http://admin.lvh.me/phpmyadmin
-]]>Normally the ajax pull data from self hosted as well 3rd party hosted APIs. In both cases, the failure of ajax request has to handled at both ends, but front end is more important because of its high impact on the user experience. In case of 3rd party APIs, there is any way no possibility to have control over back-end, so front-end is the default choice.
- -The browser behaves differently when it comes to make a ajax calls for same origin and ajax call for cross origin, and therefore exceptional handling also have to different.
- -In jQuery, the simplest way to catch all the ajax errors and exceptions on a web page
- -$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-
- // This is the default error handler for ajax request.
-
- // Extract all the information required to understand.
- var requestResponse = {
- url: ajaxSettings.url,
- method: ajaxSettings.type,
- data: ajaxSettings.data,
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- data: ajaxSettings.data
- };
-
- console.error(requestResponse)
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
-});
-One important thing to note here is this handler is not called for cross-domain scripts and cross-domain JSONP requests which made its easy to avoid any ajax errors happening in application other than your native javascript code.
- -Note If $.ajax() or $.ajaxSetup() is called with the global option set to false, the .ajaxError() method will not fire.
Apart from this generic handler, it is possible to have a dedicated error handler for each type of request.
- -$.ajax({
-
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- error: function(jqXHR, textStatus,errorThrown) {
- var requestResponse = {
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- };
-
- console.log(requestResponse);
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
- }
-});
-Event this dedicated handler is not called for cross-domain script and cross-domain JSONP requests.
- -The limitation for ajax exception handlers is not just a jQuery limitation, but it is a javascript limitation. The reason behind this limitation is that most browser are not giving permissions to access error messages for cross domain scripts due to security reasons.
- -There are some solutions (or workarounds) for this. (Reference stackoverflow )
- -First one, if backend is accessible, set (in my example PHP) headers to allow a cross domain call. When you do this, then JavaScript accepts the call, and no crossdomain tricks are needed.
- - header('Access-Control-Allow-Origin: http://domain1.com, http://domain2.com'); //whitelist
-Secondly if there is no access to backend, a timeout based workaround can be used to get a error callback
- -$.ajax({
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- success: start_map,
- timeout: 2000, // 2 seconds timeout before error function will be called
- dataType: 'script',
- crossDomain: true
-});
-This is a nasty trick to solve the problem as it can definitely screw up things for slow internet connection.
- -Another alternative option is using the jQuery plugin jquery-jsonp. This plugin is using script onload / onerror method along with timeout to get the error callback.
-]]>Normally the ajax pull data from self hosted as well 3rd party hosted APIs. In both cases, the failure of ajax request has to handled at both ends, but front end is more important because of its high impact on the user experience. In case of 3rd party APIs, there is any way no possibility to have control over back-end, so front-end is the default choice.
- -The browser behaves differently when it comes to make a ajax calls for same origin and ajax call for cross origin, and therefore exceptional handling also have to different.
- -In jQuery, the simplest way to catch all the ajax errors and exceptions on a web page
- -$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-
- // This is the default error handler for ajax request.
-
- // Extract all the information required to understand.
- var requestResponse = {
- url: ajaxSettings.url,
- method: ajaxSettings.type,
- data: ajaxSettings.data,
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- data: ajaxSettings.data
- };
-
- console.error(requestResponse)
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
-});
-One important thing to note here is this handler is not called for cross-domain scripts and cross-domain JSONP requests which made its easy to avoid any ajax errors happening in application other than your native javascript code.
- -Note If $.ajax() or $.ajaxSetup() is called with the global option set to false, the .ajaxError() method will not fire.
Apart from this generic handler, it is possible to have a dedicated error handler for each type of request.
- -$.ajax({
-
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- error: function(jqXHR, textStatus,errorThrown) {
- var requestResponse = {
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- };
-
- console.log(requestResponse);
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
- }
-});
-Event this dedicated handler is not called for cross-domain script and cross-domain JSONP requests.
- -The limitation for ajax exception handlers is not just a jQuery limitation, but it is a javascript limitation. The reason behind this limitation is that most browser are not giving permissions to access error messages for cross domain scripts due to security reasons.
- -There are some solutions (or workarounds) for this. (Reference stackoverflow )
- -First one, if backend is accessible, set (in my example PHP) headers to allow a cross domain call. When you do this, then JavaScript accepts the call, and no crossdomain tricks are needed.
- - header('Access-Control-Allow-Origin: http://domain1.com, http://domain2.com'); //whitelist
-Secondly if there is no access to backend, a timeout based workaround can be used to get a error callback
- -$.ajax({
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- success: start_map,
- timeout: 2000, // 2 seconds timeout before error function will be called
- dataType: 'script',
- crossDomain: true
-});
-This is a nasty trick to solve the problem as it can definitely screw up things for slow internet connection.
- -Another alternative option is using the jQuery plugin jquery-jsonp. This plugin is using script onload / onerror method along with timeout to get the error callback.
-]]>
Yeah, IE thowing error in javascript comment. For some time I didnot believe what I am seeing, but gradually I came to my senses. Like most developers, first thing I did was started cursing IE on twitter, but later reality struct me and that is to find a solution to this mess.
- -I dig in a lot of wrong places until I found conditional comments in IE. A sample of how the conditional logic works is below
- -<script>
-/*@cc_on
-
- @if (@_jscript_version == 10)
- document.write("You are using IE10");
-
- @elif (@_jscript_version == 9)
- document.write("You are using IE9");
-
- @elif (@_jscript_version == 5.8)
- document.write("You are using IE8");
-
- @elif (@_jscript_version == 5.7 && window.XMLHttpRequest)
- document.write("You are using IE7");
-
- @elif (@_jscript_version == 5.6 || (@_jscript_version == 5.7 && !window.XMLHttpRequest))
- document.write("You are using IE6");
-
- @elif (@_jscript_version == 5.5)
- document.write("You are using IE5.5");
-
- @else
- document.write("You are using IE5 or older");
-
- @end
-
-@*/
-</script>
-To fix this all I need to do is to remove the whole comment. This comment is anyways useful for sourcemaps supported browsers which is long way to go for IE.
- -Anyways this is just a hack for the time being. The sourcemap specs has been updated due to this problem. To know more check the uglifyjs issue on github
- -Finally all I have to say is God Bless IE Developers
Normally the ajax pull data from self hosted as well 3rd party hosted APIs. In both cases, the failure of ajax request has to handled at both ends, but front end is more important because of its high impact on the user experience. In case of 3rd party APIs, there is any way no possibility to have control over back-end, so front-end is the default choice.
- -The browser behaves differently when it comes to make a ajax calls for same origin and ajax call for cross origin, and therefore exceptional handling also have to different.
- -In jQuery, the simplest way to catch all the ajax errors and exceptions on a web page
- -$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-
- // This is the default error handler for ajax request.
-
- // Extract all the information required to understand.
- var requestResponse = {
- url: ajaxSettings.url,
- method: ajaxSettings.type,
- data: ajaxSettings.data,
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- data: ajaxSettings.data
- };
-
- console.error(requestResponse)
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
-});
-One important thing to note here is this handler is not called for cross-domain scripts and cross-domain JSONP requests which made its easy to avoid any ajax errors happening in application other than your native javascript code.
- -Note If $.ajax() or $.ajaxSetup() is called with the global option set to false, the .ajaxError() method will not fire.
Apart from this generic handler, it is possible to have a dedicated error handler for each type of request.
- -$.ajax({
-
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- error: function(jqXHR, textStatus,errorThrown) {
- var requestResponse = {
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- };
-
- console.log(requestResponse);
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
- }
-});
-Event this dedicated handler is not called for cross-domain script and cross-domain JSONP requests.
- -The limitation for ajax exception handlers is not just a jQuery limitation, but it is a javascript limitation. The reason behind this limitation is that most browser are not giving permissions to access error messages for cross domain scripts due to security reasons.
- -There are some solutions (or workarounds) for this. (Reference stackoverflow )
- -First one, if backend is accessible, set (in my example PHP) headers to allow a cross domain call. When you do this, then JavaScript accepts the call, and no crossdomain tricks are needed.
- - header('Access-Control-Allow-Origin: http://domain1.com, http://domain2.com'); //whitelist
-Secondly if there is no access to backend, a timeout based workaround can be used to get a error callback
- -$.ajax({
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- success: start_map,
- timeout: 2000, // 2 seconds timeout before error function will be called
- dataType: 'script',
- crossDomain: true
-});
-This is a nasty trick to solve the problem as it can definitely screw up things for slow internet connection.
- -Another alternative option is using the jQuery plugin jquery-jsonp. This plugin is using script onload / onerror method along with timeout to get the error callback.
-]]>We have added this functionality, and to simplify it, we have come with 3 new APIs
- -Using this api, its possible to set an alias to the unique user identification used by the debuggify. This make it easy to map a debuggify user identifier to your site username or email id. Remember the old data will not have alias.
- -debuggify.alias('foo@example.com');
-Its pretty straight forward to use the above api.
- -Note Make sure every unique user should be given the one alias to avoid any data inconsistency.
- -To attach custom data along with every message
- -debuggify.metadata({'login': true});
-To attach custom data along with a single message. This api need to be called on the logger object
- -var ajaxErrors = debuggify.Logger.get('ajax_errors');
-
-ajaxErrors.attach({
- type: 'POST',
- url: '/api/notification'
-});
-
-ajaxErrors.error('Error in Notification Api');
-After calling attach, it must be followed by the one of the logging Apis like .log, .error, .warn, .debug or .message to push that data to the server.
Note: The attached data will expire after its once used by logging Api’s. To send data with every request use .metadata api
We soon be adding use cases on how to use this APIs more powerfully.
-]]>Normally the ajax pull data from self hosted as well 3rd party hosted APIs. In both cases, the failure of ajax request has to handled at both ends, but front end is more important because of its high impact on the user experience. In case of 3rd party APIs, there is any way no possibility to have control over back-end, so front-end is the default choice.
- -The browser behaves differently when it comes to make a ajax calls for same origin and ajax call for cross origin, and therefore exceptional handling also have to different.
- -In jQuery, the simplest way to catch all the ajax errors and exceptions on a web page
- -$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-
- // This is the default error handler for ajax request.
-
- // Extract all the information required to understand.
- var requestResponse = {
- url: ajaxSettings.url,
- method: ajaxSettings.type,
- data: ajaxSettings.data,
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- data: ajaxSettings.data
- };
-
- console.error(requestResponse)
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
-});
-One important thing to note here is this handler is not called for cross-domain scripts and cross-domain JSONP requests which made its easy to avoid any ajax errors happening in application other than your native javascript code.
- -Note If $.ajax() or $.ajaxSetup() is called with the global option set to false, the .ajaxError() method will not fire.
Apart from this generic handler, it is possible to have a dedicated error handler for each type of request.
- -$.ajax({
-
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- error: function(jqXHR, textStatus,errorThrown) {
- var requestResponse = {
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- };
-
- console.log(requestResponse);
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
- }
-});
-Event this dedicated handler is not called for cross-domain script and cross-domain JSONP requests.
- -The limitation for ajax exception handlers is not just a jQuery limitation, but it is a javascript limitation. The reason behind this limitation is that most browser are not giving permissions to access error messages for cross domain scripts due to security reasons.
- -There are some solutions (or workarounds) for this. (Reference stackoverflow )
- -First one, if backend is accessible, set (in my example PHP) headers to allow a cross domain call. When you do this, then JavaScript accepts the call, and no crossdomain tricks are needed.
- - header('Access-Control-Allow-Origin: http://domain1.com, http://domain2.com'); //whitelist
-Secondly if there is no access to backend, a timeout based workaround can be used to get a error callback
- -$.ajax({
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- success: start_map,
- timeout: 2000, // 2 seconds timeout before error function will be called
- dataType: 'script',
- crossDomain: true
-});
-This is a nasty trick to solve the problem as it can definitely screw up things for slow internet connection.
- -Another alternative option is using the jQuery plugin jquery-jsonp. This plugin is using script onload / onerror method along with timeout to get the error callback.
-]]>We have added this functionality, and to simplify it, we have come with 3 new APIs
- -Using this api, its possible to set an alias to the unique user identification used by the debuggify. This make it easy to map a debuggify user identifier to your site username or email id. Remember the old data will not have alias.
- -debuggify.alias('foo@example.com');
-Its pretty straight forward to use the above api.
- -Note Make sure every unique user should be given the one alias to avoid any data inconsistency.
- -To attach custom data along with every message
- -debuggify.metadata({'login': true});
-To attach custom data along with a single message. This api need to be called on the logger object
- -var ajaxErrors = debuggify.Logger.get('ajax_errors');
-
-ajaxErrors.attach({
- type: 'POST',
- url: '/api/notification'
-});
-
-ajaxErrors.error('Error in Notification Api');
-After calling attach, it must be followed by the one of the logging Apis like .log, .error, .warn, .debug or .message to push that data to the server.
Note: The attached data will expire after its once used by logging Api’s. To send data with every request use .metadata api
We soon be adding use cases on how to use this APIs more powerfully.
-]]>Here is the presentation
- - - - - - -I will be explaining each point in details in the future posts.
- -I know I have abandoned the blog for long time but not any more. Stay connected for more.
- -Happy Debugging !!
-]]>
Yeah, IE thowing error in javascript comment. For some time I didnot believe what I am seeing, but gradually I came to my senses. Like most developers, first thing I did was started cursing IE on twitter, but later reality struct me and that is to find a solution to this mess.
- -I dig in a lot of wrong places until I found conditional comments in IE. A sample of how the conditional logic works is below
- -<script>
-/*@cc_on
-
- @if (@_jscript_version == 10)
- document.write("You are using IE10");
-
- @elif (@_jscript_version == 9)
- document.write("You are using IE9");
-
- @elif (@_jscript_version == 5.8)
- document.write("You are using IE8");
-
- @elif (@_jscript_version == 5.7 && window.XMLHttpRequest)
- document.write("You are using IE7");
-
- @elif (@_jscript_version == 5.6 || (@_jscript_version == 5.7 && !window.XMLHttpRequest))
- document.write("You are using IE6");
-
- @elif (@_jscript_version == 5.5)
- document.write("You are using IE5.5");
-
- @else
- document.write("You are using IE5 or older");
-
- @end
-
-@*/
-</script>
-To fix this all I need to do is to remove the whole comment. This comment is anyways useful for sourcemaps supported browsers which is long way to go for IE.
- -Anyways this is just a hack for the time being. The sourcemap specs has been updated due to this problem. To know more check the uglifyjs issue on github
- -Finally all I have to say is God Bless IE Developers
Normally the ajax pull data from self hosted as well 3rd party hosted APIs. In both cases, the failure of ajax request has to handled at both ends, but front end is more important because of its high impact on the user experience. In case of 3rd party APIs, there is any way no possibility to have control over back-end, so front-end is the default choice.
- -The browser behaves differently when it comes to make a ajax calls for same origin and ajax call for cross origin, and therefore exceptional handling also have to different.
- -In jQuery, the simplest way to catch all the ajax errors and exceptions on a web page
- -$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-
- // This is the default error handler for ajax request.
-
- // Extract all the information required to understand.
- var requestResponse = {
- url: ajaxSettings.url,
- method: ajaxSettings.type,
- data: ajaxSettings.data,
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- data: ajaxSettings.data
- };
-
- console.error(requestResponse)
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
-});
-One important thing to note here is this handler is not called for cross-domain scripts and cross-domain JSONP requests which made its easy to avoid any ajax errors happening in application other than your native javascript code.
- -Note If $.ajax() or $.ajaxSetup() is called with the global option set to false, the .ajaxError() method will not fire.
Apart from this generic handler, it is possible to have a dedicated error handler for each type of request.
- -$.ajax({
-
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- error: function(jqXHR, textStatus,errorThrown) {
- var requestResponse = {
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- };
-
- console.log(requestResponse);
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
- }
-});
-Event this dedicated handler is not called for cross-domain script and cross-domain JSONP requests.
- -The limitation for ajax exception handlers is not just a jQuery limitation, but it is a javascript limitation. The reason behind this limitation is that most browser are not giving permissions to access error messages for cross domain scripts due to security reasons.
- -There are some solutions (or workarounds) for this. (Reference stackoverflow )
- -First one, if backend is accessible, set (in my example PHP) headers to allow a cross domain call. When you do this, then JavaScript accepts the call, and no crossdomain tricks are needed.
- - header('Access-Control-Allow-Origin: http://domain1.com, http://domain2.com'); //whitelist
-Secondly if there is no access to backend, a timeout based workaround can be used to get a error callback
- -$.ajax({
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- success: start_map,
- timeout: 2000, // 2 seconds timeout before error function will be called
- dataType: 'script',
- crossDomain: true
-});
-This is a nasty trick to solve the problem as it can definitely screw up things for slow internet connection.
- -Another alternative option is using the jQuery plugin jquery-jsonp. This plugin is using script onload / onerror method along with timeout to get the error callback.
-]]>Normally the ajax pull data from self hosted as well 3rd party hosted APIs. In both cases, the failure of ajax request has to handled at both ends, but front end is more important because of its high impact on the user experience. In case of 3rd party APIs, there is any way no possibility to have control over back-end, so front-end is the default choice.
- -The browser behaves differently when it comes to make a ajax calls for same origin and ajax call for cross origin, and therefore exceptional handling also have to different.
- -In jQuery, the simplest way to catch all the ajax errors and exceptions on a web page
- -$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-
- // This is the default error handler for ajax request.
-
- // Extract all the information required to understand.
- var requestResponse = {
- url: ajaxSettings.url,
- method: ajaxSettings.type,
- data: ajaxSettings.data,
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- data: ajaxSettings.data
- };
-
- console.error(requestResponse)
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
-});
-One important thing to note here is this handler is not called for cross-domain scripts and cross-domain JSONP requests which made its easy to avoid any ajax errors happening in application other than your native javascript code.
- -Note If $.ajax() or $.ajaxSetup() is called with the global option set to false, the .ajaxError() method will not fire.
Apart from this generic handler, it is possible to have a dedicated error handler for each type of request.
- -$.ajax({
-
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- error: function(jqXHR, textStatus,errorThrown) {
- var requestResponse = {
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- };
-
- console.log(requestResponse);
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
- }
-});
-Event this dedicated handler is not called for cross-domain script and cross-domain JSONP requests.
- -The limitation for ajax exception handlers is not just a jQuery limitation, but it is a javascript limitation. The reason behind this limitation is that most browser are not giving permissions to access error messages for cross domain scripts due to security reasons.
- -There are some solutions (or workarounds) for this. (Reference stackoverflow )
- -First one, if backend is accessible, set (in my example PHP) headers to allow a cross domain call. When you do this, then JavaScript accepts the call, and no crossdomain tricks are needed.
- - header('Access-Control-Allow-Origin: http://domain1.com, http://domain2.com'); //whitelist
-Secondly if there is no access to backend, a timeout based workaround can be used to get a error callback
- -$.ajax({
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- success: start_map,
- timeout: 2000, // 2 seconds timeout before error function will be called
- dataType: 'script',
- crossDomain: true
-});
-This is a nasty trick to solve the problem as it can definitely screw up things for slow internet connection.
- -Another alternative option is using the jQuery plugin jquery-jsonp. This plugin is using script onload / onerror method along with timeout to get the error callback.
-]]>Setup Php, mysql & phpmyadmin:
- - sudo apt-get install php5-fpm php-apc mysql-server mysql-client phpmyadmin nginx
-Enter your MySQL password and phpmyadmin webinterface password when prompted
- -Enable mysql extension by editing /etc/php5/fpm/php.ini
- -sudo vim /etc/php5/fpm/php.ini
-Add the following line and save
- -extension=mysql.so
-Restart to use new config
- - sudo /etc/init.d/php5-fpm restart
- sudo /etc/init.d/nginx restart
-Next create a basic nginx vhost configuration in /etc/nginx/sites-available/ directory as follows:
- -sudo vim /etc/nginx/sites-available/phpmyadmin
-And add the following:
- -server {
-
- listen 80;
- server_name admin.lvh.me lvh.me;
- root /var/www/phpmyadmin;
- if ($http_host != "admin.lvh.me") {
- rewrite ^ http://admin.lvh.me$request_uri permanent;
- }
- index index.php index.html;
- location = /favicon.ico {
- log_not_found off;
- access_log off;
- }
- location = /robots.txt {
- allow all;
- log_not_found off;
- access_log off;
- }
- # Make sure files with the following extensions do not get loaded by nginx because nginx would display the source code, and these files can contain PASSWORDS!
- location ~* \.(engine|inc|info|install|make|module|profile|test|po|sh|.*sql|theme|tpl(\.php)?|xtmpl)$|^(\..*|Entries.*|Repository|Root|Tag|Template)$|\.php_ {
- deny all;
- }
- # Deny all attempts to access hidden files such as .htaccess, .htpasswd, .DS_Store (Mac).
- location ~ /\. {
- deny all;
- access_log off;
- log_not_found off;
- }
- location ~* \.(jpg|jpeg|png|gif|css|js|ico)$ {
- expires max;
- log_not_found off;
- }
- location ~ \.php$ {
- try_files $uri =404;
- include /etc/nginx/fastcgi_params;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- }
-
- location /phpmyadmin {
- root /usr/share/;
- index index.php index.html index.htm;
- location ~ ^/phpmyadmin/(.+\.php)$ {
- try_files $uri =404;
- root /usr/share/;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_index index.php;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- include /etc/nginx/fastcgi_params;
- }
- location ~* ^/phpmyadmin/(.+\.(jpg|jpeg|gif|css|png|js|ico|html|xml|txt))$ {
- root /usr/share/;
- }
- }
- location /phpMyAdmin {
- rewrite ^/* /phpmyadmin last;
- }
-}
-To enable that vhost, we create a symlink to it from the /etc/nginx/sites-enabled/ directory:
- -cd /etc/nginx/sites-enabled/
-sudo ln -s /etc/nginx/sites-available/phpmyadmin phpmyadmin
-Reload nginx for the new configuration to take effect:
- -sudo /etc/init.d/nginx reload
-Open the link in the browser http://admin.lvh.me/phpmyadmin
-]]>
Yeah, IE thowing error in javascript comment. For some time I didnot believe what I am seeing, but gradually I came to my senses. Like most developers, first thing I did was started cursing IE on twitter, but later reality struct me and that is to find a solution to this mess.
- -I dig in a lot of wrong places until I found conditional comments in IE. A sample of how the conditional logic works is below
- -<script>
-/*@cc_on
-
- @if (@_jscript_version == 10)
- document.write("You are using IE10");
-
- @elif (@_jscript_version == 9)
- document.write("You are using IE9");
-
- @elif (@_jscript_version == 5.8)
- document.write("You are using IE8");
-
- @elif (@_jscript_version == 5.7 && window.XMLHttpRequest)
- document.write("You are using IE7");
-
- @elif (@_jscript_version == 5.6 || (@_jscript_version == 5.7 && !window.XMLHttpRequest))
- document.write("You are using IE6");
-
- @elif (@_jscript_version == 5.5)
- document.write("You are using IE5.5");
-
- @else
- document.write("You are using IE5 or older");
-
- @end
-
-@*/
-</script>
-To fix this all I need to do is to remove the whole comment. This comment is anyways useful for sourcemaps supported browsers which is long way to go for IE.
- -Anyways this is just a hack for the time being. The sourcemap specs has been updated due to this problem. To know more check the uglifyjs issue on github
- -Finally all I have to say is God Bless IE Developers
Yeah, IE thowing error in javascript comment. For some time I didnot believe what I am seeing, but gradually I came to my senses. Like most developers, first thing I did was started cursing IE on twitter, but later reality struct me and that is to find a solution to this mess.
- -I dig in a lot of wrong places until I found conditional comments in IE. A sample of how the conditional logic works is below
- -<script>
-/*@cc_on
-
- @if (@_jscript_version == 10)
- document.write("You are using IE10");
-
- @elif (@_jscript_version == 9)
- document.write("You are using IE9");
-
- @elif (@_jscript_version == 5.8)
- document.write("You are using IE8");
-
- @elif (@_jscript_version == 5.7 && window.XMLHttpRequest)
- document.write("You are using IE7");
-
- @elif (@_jscript_version == 5.6 || (@_jscript_version == 5.7 && !window.XMLHttpRequest))
- document.write("You are using IE6");
-
- @elif (@_jscript_version == 5.5)
- document.write("You are using IE5.5");
-
- @else
- document.write("You are using IE5 or older");
-
- @end
-
-@*/
-</script>
-To fix this all I need to do is to remove the whole comment. This comment is anyways useful for sourcemaps supported browsers which is long way to go for IE.
- -Anyways this is just a hack for the time being. The sourcemap specs has been updated due to this problem. To know more check the uglifyjs issue on github
- -Finally all I have to say is God Bless IE Developers
Yeah, IE thowing error in javascript comment. For some time I didnot believe what I am seeing, but gradually I came to my senses. Like most developers, first thing I did was started cursing IE on twitter, but later reality struct me and that is to find a solution to this mess.
- -I dig in a lot of wrong places until I found conditional comments in IE. A sample of how the conditional logic works is below
- -<script>
-/*@cc_on
-
- @if (@_jscript_version == 10)
- document.write("You are using IE10");
-
- @elif (@_jscript_version == 9)
- document.write("You are using IE9");
-
- @elif (@_jscript_version == 5.8)
- document.write("You are using IE8");
-
- @elif (@_jscript_version == 5.7 && window.XMLHttpRequest)
- document.write("You are using IE7");
-
- @elif (@_jscript_version == 5.6 || (@_jscript_version == 5.7 && !window.XMLHttpRequest))
- document.write("You are using IE6");
-
- @elif (@_jscript_version == 5.5)
- document.write("You are using IE5.5");
-
- @else
- document.write("You are using IE5 or older");
-
- @end
-
-@*/
-</script>
-To fix this all I need to do is to remove the whole comment. This comment is anyways useful for sourcemaps supported browsers which is long way to go for IE.
- -Anyways this is just a hack for the time being. The sourcemap specs has been updated due to this problem. To know more check the uglifyjs issue on github
- -Finally all I have to say is God Bless IE Developers
Yeah, IE thowing error in javascript comment. For some time I didnot believe what I am seeing, but gradually I came to my senses. Like most developers, first thing I did was started cursing IE on twitter, but later reality struct me and that is to find a solution to this mess.
- -I dig in a lot of wrong places until I found conditional comments in IE. A sample of how the conditional logic works is below
- -<script>
-/*@cc_on
-
- @if (@_jscript_version == 10)
- document.write("You are using IE10");
-
- @elif (@_jscript_version == 9)
- document.write("You are using IE9");
-
- @elif (@_jscript_version == 5.8)
- document.write("You are using IE8");
-
- @elif (@_jscript_version == 5.7 && window.XMLHttpRequest)
- document.write("You are using IE7");
-
- @elif (@_jscript_version == 5.6 || (@_jscript_version == 5.7 && !window.XMLHttpRequest))
- document.write("You are using IE6");
-
- @elif (@_jscript_version == 5.5)
- document.write("You are using IE5.5");
-
- @else
- document.write("You are using IE5 or older");
-
- @end
-
-@*/
-</script>
-To fix this all I need to do is to remove the whole comment. This comment is anyways useful for sourcemaps supported browsers which is long way to go for IE.
- -Anyways this is just a hack for the time being. The sourcemap specs has been updated due to this problem. To know more check the uglifyjs issue on github
- -Finally all I have to say is God Bless IE Developers
We have added this functionality, and to simplify it, we have come with 3 new APIs
- -Using this api, its possible to set an alias to the unique user identification used by the debuggify. This make it easy to map a debuggify user identifier to your site username or email id. Remember the old data will not have alias.
- -debuggify.alias('foo@example.com');
-Its pretty straight forward to use the above api.
- -Note Make sure every unique user should be given the one alias to avoid any data inconsistency.
- -To attach custom data along with every message
- -debuggify.metadata({'login': true});
-To attach custom data along with a single message. This api need to be called on the logger object
- -var ajaxErrors = debuggify.Logger.get('ajax_errors');
-
-ajaxErrors.attach({
- type: 'POST',
- url: '/api/notification'
-});
-
-ajaxErrors.error('Error in Notification Api');
-After calling attach, it must be followed by the one of the logging Apis like .log, .error, .warn, .debug or .message to push that data to the server.
Note: The attached data will expire after its once used by logging Api’s. To send data with every request use .metadata api
We soon be adding use cases on how to use this APIs more powerfully.
-]]>
Yeah, IE thowing error in javascript comment. For some time I didnot believe what I am seeing, but gradually I came to my senses. Like most developers, first thing I did was started cursing IE on twitter, but later reality struct me and that is to find a solution to this mess.
- -I dig in a lot of wrong places until I found conditional comments in IE. A sample of how the conditional logic works is below
- -<script>
-/*@cc_on
-
- @if (@_jscript_version == 10)
- document.write("You are using IE10");
-
- @elif (@_jscript_version == 9)
- document.write("You are using IE9");
-
- @elif (@_jscript_version == 5.8)
- document.write("You are using IE8");
-
- @elif (@_jscript_version == 5.7 && window.XMLHttpRequest)
- document.write("You are using IE7");
-
- @elif (@_jscript_version == 5.6 || (@_jscript_version == 5.7 && !window.XMLHttpRequest))
- document.write("You are using IE6");
-
- @elif (@_jscript_version == 5.5)
- document.write("You are using IE5.5");
-
- @else
- document.write("You are using IE5 or older");
-
- @end
-
-@*/
-</script>
-To fix this all I need to do is to remove the whole comment. This comment is anyways useful for sourcemaps supported browsers which is long way to go for IE.
- -Anyways this is just a hack for the time being. The sourcemap specs has been updated due to this problem. To know more check the uglifyjs issue on github
- -Finally all I have to say is God Bless IE Developers
Here is the presentation
- - - - - - -I will be explaining each point in details in the future posts.
- -I know I have abandoned the blog for long time but not any more. Stay connected for more.
- -Happy Debugging !!
-]]>Setup Php, mysql & phpmyadmin:
- - sudo apt-get install php5-fpm php-apc mysql-server mysql-client phpmyadmin nginx
-Enter your MySQL password and phpmyadmin webinterface password when prompted
- -Enable mysql extension by editing /etc/php5/fpm/php.ini
- -sudo vim /etc/php5/fpm/php.ini
-Add the following line and save
- -extension=mysql.so
-Restart to use new config
- - sudo /etc/init.d/php5-fpm restart
- sudo /etc/init.d/nginx restart
-Next create a basic nginx vhost configuration in /etc/nginx/sites-available/ directory as follows:
- -sudo vim /etc/nginx/sites-available/phpmyadmin
-And add the following:
- -server {
-
- listen 80;
- server_name admin.lvh.me lvh.me;
- root /var/www/phpmyadmin;
- if ($http_host != "admin.lvh.me") {
- rewrite ^ http://admin.lvh.me$request_uri permanent;
- }
- index index.php index.html;
- location = /favicon.ico {
- log_not_found off;
- access_log off;
- }
- location = /robots.txt {
- allow all;
- log_not_found off;
- access_log off;
- }
- # Make sure files with the following extensions do not get loaded by nginx because nginx would display the source code, and these files can contain PASSWORDS!
- location ~* \.(engine|inc|info|install|make|module|profile|test|po|sh|.*sql|theme|tpl(\.php)?|xtmpl)$|^(\..*|Entries.*|Repository|Root|Tag|Template)$|\.php_ {
- deny all;
- }
- # Deny all attempts to access hidden files such as .htaccess, .htpasswd, .DS_Store (Mac).
- location ~ /\. {
- deny all;
- access_log off;
- log_not_found off;
- }
- location ~* \.(jpg|jpeg|png|gif|css|js|ico)$ {
- expires max;
- log_not_found off;
- }
- location ~ \.php$ {
- try_files $uri =404;
- include /etc/nginx/fastcgi_params;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- }
-
- location /phpmyadmin {
- root /usr/share/;
- index index.php index.html index.htm;
- location ~ ^/phpmyadmin/(.+\.php)$ {
- try_files $uri =404;
- root /usr/share/;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_index index.php;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- include /etc/nginx/fastcgi_params;
- }
- location ~* ^/phpmyadmin/(.+\.(jpg|jpeg|gif|css|png|js|ico|html|xml|txt))$ {
- root /usr/share/;
- }
- }
- location /phpMyAdmin {
- rewrite ^/* /phpmyadmin last;
- }
-}
-To enable that vhost, we create a symlink to it from the /etc/nginx/sites-enabled/ directory:
- -cd /etc/nginx/sites-enabled/
-sudo ln -s /etc/nginx/sites-available/phpmyadmin phpmyadmin
-Reload nginx for the new configuration to take effect:
- -sudo /etc/init.d/nginx reload
-Open the link in the browser http://admin.lvh.me/phpmyadmin
-]]>We have added this functionality, and to simplify it, we have come with 3 new APIs
- -Using this api, its possible to set an alias to the unique user identification used by the debuggify. This make it easy to map a debuggify user identifier to your site username or email id. Remember the old data will not have alias.
- -debuggify.alias('foo@example.com');
-Its pretty straight forward to use the above api.
- -Note Make sure every unique user should be given the one alias to avoid any data inconsistency.
- -To attach custom data along with every message
- -debuggify.metadata({'login': true});
-To attach custom data along with a single message. This api need to be called on the logger object
- -var ajaxErrors = debuggify.Logger.get('ajax_errors');
-
-ajaxErrors.attach({
- type: 'POST',
- url: '/api/notification'
-});
-
-ajaxErrors.error('Error in Notification Api');
-After calling attach, it must be followed by the one of the logging Apis like .log, .error, .warn, .debug or .message to push that data to the server.
Note: The attached data will expire after its once used by logging Api’s. To send data with every request use .metadata api
We soon be adding use cases on how to use this APIs more powerfully.
-]]>Setup Php, mysql & phpmyadmin:
- - sudo apt-get install php5-fpm php-apc mysql-server mysql-client phpmyadmin nginx
-Enter your MySQL password and phpmyadmin webinterface password when prompted
- -Enable mysql extension by editing /etc/php5/fpm/php.ini
- -sudo vim /etc/php5/fpm/php.ini
-Add the following line and save
- -extension=mysql.so
-Restart to use new config
- - sudo /etc/init.d/php5-fpm restart
- sudo /etc/init.d/nginx restart
-Next create a basic nginx vhost configuration in /etc/nginx/sites-available/ directory as follows:
- -sudo vim /etc/nginx/sites-available/phpmyadmin
-And add the following:
- -server {
-
- listen 80;
- server_name admin.lvh.me lvh.me;
- root /var/www/phpmyadmin;
- if ($http_host != "admin.lvh.me") {
- rewrite ^ http://admin.lvh.me$request_uri permanent;
- }
- index index.php index.html;
- location = /favicon.ico {
- log_not_found off;
- access_log off;
- }
- location = /robots.txt {
- allow all;
- log_not_found off;
- access_log off;
- }
- # Make sure files with the following extensions do not get loaded by nginx because nginx would display the source code, and these files can contain PASSWORDS!
- location ~* \.(engine|inc|info|install|make|module|profile|test|po|sh|.*sql|theme|tpl(\.php)?|xtmpl)$|^(\..*|Entries.*|Repository|Root|Tag|Template)$|\.php_ {
- deny all;
- }
- # Deny all attempts to access hidden files such as .htaccess, .htpasswd, .DS_Store (Mac).
- location ~ /\. {
- deny all;
- access_log off;
- log_not_found off;
- }
- location ~* \.(jpg|jpeg|png|gif|css|js|ico)$ {
- expires max;
- log_not_found off;
- }
- location ~ \.php$ {
- try_files $uri =404;
- include /etc/nginx/fastcgi_params;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- }
-
- location /phpmyadmin {
- root /usr/share/;
- index index.php index.html index.htm;
- location ~ ^/phpmyadmin/(.+\.php)$ {
- try_files $uri =404;
- root /usr/share/;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_index index.php;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- include /etc/nginx/fastcgi_params;
- }
- location ~* ^/phpmyadmin/(.+\.(jpg|jpeg|gif|css|png|js|ico|html|xml|txt))$ {
- root /usr/share/;
- }
- }
- location /phpMyAdmin {
- rewrite ^/* /phpmyadmin last;
- }
-}
-To enable that vhost, we create a symlink to it from the /etc/nginx/sites-enabled/ directory:
- -cd /etc/nginx/sites-enabled/
-sudo ln -s /etc/nginx/sites-available/phpmyadmin phpmyadmin
-Reload nginx for the new configuration to take effect:
- -sudo /etc/init.d/nginx reload
-Open the link in the browser http://admin.lvh.me/phpmyadmin
-]]>Setup Php, mysql & phpmyadmin:
- - sudo apt-get install php5-fpm php-apc mysql-server mysql-client phpmyadmin nginx
-Enter your MySQL password and phpmyadmin webinterface password when prompted
- -Enable mysql extension by editing /etc/php5/fpm/php.ini
- -sudo vim /etc/php5/fpm/php.ini
-Add the following line and save
- -extension=mysql.so
-Restart to use new config
- - sudo /etc/init.d/php5-fpm restart
- sudo /etc/init.d/nginx restart
-Next create a basic nginx vhost configuration in /etc/nginx/sites-available/ directory as follows:
- -sudo vim /etc/nginx/sites-available/phpmyadmin
-And add the following:
- -server {
-
- listen 80;
- server_name admin.lvh.me lvh.me;
- root /var/www/phpmyadmin;
- if ($http_host != "admin.lvh.me") {
- rewrite ^ http://admin.lvh.me$request_uri permanent;
- }
- index index.php index.html;
- location = /favicon.ico {
- log_not_found off;
- access_log off;
- }
- location = /robots.txt {
- allow all;
- log_not_found off;
- access_log off;
- }
- # Make sure files with the following extensions do not get loaded by nginx because nginx would display the source code, and these files can contain PASSWORDS!
- location ~* \.(engine|inc|info|install|make|module|profile|test|po|sh|.*sql|theme|tpl(\.php)?|xtmpl)$|^(\..*|Entries.*|Repository|Root|Tag|Template)$|\.php_ {
- deny all;
- }
- # Deny all attempts to access hidden files such as .htaccess, .htpasswd, .DS_Store (Mac).
- location ~ /\. {
- deny all;
- access_log off;
- log_not_found off;
- }
- location ~* \.(jpg|jpeg|png|gif|css|js|ico)$ {
- expires max;
- log_not_found off;
- }
- location ~ \.php$ {
- try_files $uri =404;
- include /etc/nginx/fastcgi_params;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- }
-
- location /phpmyadmin {
- root /usr/share/;
- index index.php index.html index.htm;
- location ~ ^/phpmyadmin/(.+\.php)$ {
- try_files $uri =404;
- root /usr/share/;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_index index.php;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- include /etc/nginx/fastcgi_params;
- }
- location ~* ^/phpmyadmin/(.+\.(jpg|jpeg|gif|css|png|js|ico|html|xml|txt))$ {
- root /usr/share/;
- }
- }
- location /phpMyAdmin {
- rewrite ^/* /phpmyadmin last;
- }
-}
-To enable that vhost, we create a symlink to it from the /etc/nginx/sites-enabled/ directory:
- -cd /etc/nginx/sites-enabled/
-sudo ln -s /etc/nginx/sites-available/phpmyadmin phpmyadmin
-Reload nginx for the new configuration to take effect:
- -sudo /etc/init.d/nginx reload
-Open the link in the browser http://admin.lvh.me/phpmyadmin
-]]>Setup Php, mysql & phpmyadmin:
- - sudo apt-get install php5-fpm php-apc mysql-server mysql-client phpmyadmin nginx
-Enter your MySQL password and phpmyadmin webinterface password when prompted
- -Enable mysql extension by editing /etc/php5/fpm/php.ini
- -sudo vim /etc/php5/fpm/php.ini
-Add the following line and save
- -extension=mysql.so
-Restart to use new config
- - sudo /etc/init.d/php5-fpm restart
- sudo /etc/init.d/nginx restart
-Next create a basic nginx vhost configuration in /etc/nginx/sites-available/ directory as follows:
- -sudo vim /etc/nginx/sites-available/phpmyadmin
-And add the following:
- -server {
-
- listen 80;
- server_name admin.lvh.me lvh.me;
- root /var/www/phpmyadmin;
- if ($http_host != "admin.lvh.me") {
- rewrite ^ http://admin.lvh.me$request_uri permanent;
- }
- index index.php index.html;
- location = /favicon.ico {
- log_not_found off;
- access_log off;
- }
- location = /robots.txt {
- allow all;
- log_not_found off;
- access_log off;
- }
- # Make sure files with the following extensions do not get loaded by nginx because nginx would display the source code, and these files can contain PASSWORDS!
- location ~* \.(engine|inc|info|install|make|module|profile|test|po|sh|.*sql|theme|tpl(\.php)?|xtmpl)$|^(\..*|Entries.*|Repository|Root|Tag|Template)$|\.php_ {
- deny all;
- }
- # Deny all attempts to access hidden files such as .htaccess, .htpasswd, .DS_Store (Mac).
- location ~ /\. {
- deny all;
- access_log off;
- log_not_found off;
- }
- location ~* \.(jpg|jpeg|png|gif|css|js|ico)$ {
- expires max;
- log_not_found off;
- }
- location ~ \.php$ {
- try_files $uri =404;
- include /etc/nginx/fastcgi_params;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- }
-
- location /phpmyadmin {
- root /usr/share/;
- index index.php index.html index.htm;
- location ~ ^/phpmyadmin/(.+\.php)$ {
- try_files $uri =404;
- root /usr/share/;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_index index.php;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- include /etc/nginx/fastcgi_params;
- }
- location ~* ^/phpmyadmin/(.+\.(jpg|jpeg|gif|css|png|js|ico|html|xml|txt))$ {
- root /usr/share/;
- }
- }
- location /phpMyAdmin {
- rewrite ^/* /phpmyadmin last;
- }
-}
-To enable that vhost, we create a symlink to it from the /etc/nginx/sites-enabled/ directory:
- -cd /etc/nginx/sites-enabled/
-sudo ln -s /etc/nginx/sites-available/phpmyadmin phpmyadmin
-Reload nginx for the new configuration to take effect:
- -sudo /etc/init.d/nginx reload
-Open the link in the browser http://admin.lvh.me/phpmyadmin
-]]>Setup Php, mysql & phpmyadmin:
- - sudo apt-get install php5-fpm php-apc mysql-server mysql-client phpmyadmin nginx
-Enter your MySQL password and phpmyadmin webinterface password when prompted
- -Enable mysql extension by editing /etc/php5/fpm/php.ini
- -sudo vim /etc/php5/fpm/php.ini
-Add the following line and save
- -extension=mysql.so
-Restart to use new config
- - sudo /etc/init.d/php5-fpm restart
- sudo /etc/init.d/nginx restart
-Next create a basic nginx vhost configuration in /etc/nginx/sites-available/ directory as follows:
- -sudo vim /etc/nginx/sites-available/phpmyadmin
-And add the following:
- -server {
-
- listen 80;
- server_name admin.lvh.me lvh.me;
- root /var/www/phpmyadmin;
- if ($http_host != "admin.lvh.me") {
- rewrite ^ http://admin.lvh.me$request_uri permanent;
- }
- index index.php index.html;
- location = /favicon.ico {
- log_not_found off;
- access_log off;
- }
- location = /robots.txt {
- allow all;
- log_not_found off;
- access_log off;
- }
- # Make sure files with the following extensions do not get loaded by nginx because nginx would display the source code, and these files can contain PASSWORDS!
- location ~* \.(engine|inc|info|install|make|module|profile|test|po|sh|.*sql|theme|tpl(\.php)?|xtmpl)$|^(\..*|Entries.*|Repository|Root|Tag|Template)$|\.php_ {
- deny all;
- }
- # Deny all attempts to access hidden files such as .htaccess, .htpasswd, .DS_Store (Mac).
- location ~ /\. {
- deny all;
- access_log off;
- log_not_found off;
- }
- location ~* \.(jpg|jpeg|png|gif|css|js|ico)$ {
- expires max;
- log_not_found off;
- }
- location ~ \.php$ {
- try_files $uri =404;
- include /etc/nginx/fastcgi_params;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- }
-
- location /phpmyadmin {
- root /usr/share/;
- index index.php index.html index.htm;
- location ~ ^/phpmyadmin/(.+\.php)$ {
- try_files $uri =404;
- root /usr/share/;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_index index.php;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- include /etc/nginx/fastcgi_params;
- }
- location ~* ^/phpmyadmin/(.+\.(jpg|jpeg|gif|css|png|js|ico|html|xml|txt))$ {
- root /usr/share/;
- }
- }
- location /phpMyAdmin {
- rewrite ^/* /phpmyadmin last;
- }
-}
-To enable that vhost, we create a symlink to it from the /etc/nginx/sites-enabled/ directory:
- -cd /etc/nginx/sites-enabled/
-sudo ln -s /etc/nginx/sites-available/phpmyadmin phpmyadmin
-Reload nginx for the new configuration to take effect:
- -sudo /etc/init.d/nginx reload
-Open the link in the browser http://admin.lvh.me/phpmyadmin
-]]>Here is the presentation
- - - - - - -I will be explaining each point in details in the future posts.
- -I know I have abandoned the blog for long time but not any more. Stay connected for more.
- -Happy Debugging !!
-]]>Normally the ajax pull data from self hosted as well 3rd party hosted APIs. In both cases, the failure of ajax request has to handled at both ends, but front end is more important because of its high impact on the user experience. In case of 3rd party APIs, there is any way no possibility to have control over back-end, so front-end is the default choice.
- -The browser behaves differently when it comes to make a ajax calls for same origin and ajax call for cross origin, and therefore exceptional handling also have to different.
- -In jQuery, the simplest way to catch all the ajax errors and exceptions on a web page
- -$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-
- // This is the default error handler for ajax request.
-
- // Extract all the information required to understand.
- var requestResponse = {
- url: ajaxSettings.url,
- method: ajaxSettings.type,
- data: ajaxSettings.data,
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- data: ajaxSettings.data
- };
-
- console.error(requestResponse)
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
-});
-One important thing to note here is this handler is not called for cross-domain scripts and cross-domain JSONP requests which made its easy to avoid any ajax errors happening in application other than your native javascript code.
- -Note If $.ajax() or $.ajaxSetup() is called with the global option set to false, the .ajaxError() method will not fire.
Apart from this generic handler, it is possible to have a dedicated error handler for each type of request.
- -$.ajax({
-
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- error: function(jqXHR, textStatus,errorThrown) {
- var requestResponse = {
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- };
-
- console.log(requestResponse);
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
- }
-});
-Event this dedicated handler is not called for cross-domain script and cross-domain JSONP requests.
- -The limitation for ajax exception handlers is not just a jQuery limitation, but it is a javascript limitation. The reason behind this limitation is that most browser are not giving permissions to access error messages for cross domain scripts due to security reasons.
- -There are some solutions (or workarounds) for this. (Reference stackoverflow )
- -First one, if backend is accessible, set (in my example PHP) headers to allow a cross domain call. When you do this, then JavaScript accepts the call, and no crossdomain tricks are needed.
- - header('Access-Control-Allow-Origin: http://domain1.com, http://domain2.com'); //whitelist
-Secondly if there is no access to backend, a timeout based workaround can be used to get a error callback
- -$.ajax({
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- success: start_map,
- timeout: 2000, // 2 seconds timeout before error function will be called
- dataType: 'script',
- crossDomain: true
-});
-This is a nasty trick to solve the problem as it can definitely screw up things for slow internet connection.
- -Another alternative option is using the jQuery plugin jquery-jsonp. This plugin is using script onload / onerror method along with timeout to get the error callback.
-]]>Normally the ajax pull data from self hosted as well 3rd party hosted APIs. In both cases, the failure of ajax request has to handled at both ends, but front end is more important because of its high impact on the user experience. In case of 3rd party APIs, there is any way no possibility to have control over back-end, so front-end is the default choice.
- -The browser behaves differently when it comes to make a ajax calls for same origin and ajax call for cross origin, and therefore exceptional handling also have to different.
- -In jQuery, the simplest way to catch all the ajax errors and exceptions on a web page
- -$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-
- // This is the default error handler for ajax request.
-
- // Extract all the information required to understand.
- var requestResponse = {
- url: ajaxSettings.url,
- method: ajaxSettings.type,
- data: ajaxSettings.data,
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- data: ajaxSettings.data
- };
-
- console.error(requestResponse)
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
-});
-One important thing to note here is this handler is not called for cross-domain scripts and cross-domain JSONP requests which made its easy to avoid any ajax errors happening in application other than your native javascript code.
- -Note If $.ajax() or $.ajaxSetup() is called with the global option set to false, the .ajaxError() method will not fire.
Apart from this generic handler, it is possible to have a dedicated error handler for each type of request.
- -$.ajax({
-
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- error: function(jqXHR, textStatus,errorThrown) {
- var requestResponse = {
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- };
-
- console.log(requestResponse);
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
- }
-});
-Event this dedicated handler is not called for cross-domain script and cross-domain JSONP requests.
- -The limitation for ajax exception handlers is not just a jQuery limitation, but it is a javascript limitation. The reason behind this limitation is that most browser are not giving permissions to access error messages for cross domain scripts due to security reasons.
- -There are some solutions (or workarounds) for this. (Reference stackoverflow )
- -First one, if backend is accessible, set (in my example PHP) headers to allow a cross domain call. When you do this, then JavaScript accepts the call, and no crossdomain tricks are needed.
- - header('Access-Control-Allow-Origin: http://domain1.com, http://domain2.com'); //whitelist
-Secondly if there is no access to backend, a timeout based workaround can be used to get a error callback
- -$.ajax({
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- success: start_map,
- timeout: 2000, // 2 seconds timeout before error function will be called
- dataType: 'script',
- crossDomain: true
-});
-This is a nasty trick to solve the problem as it can definitely screw up things for slow internet connection.
- -Another alternative option is using the jQuery plugin jquery-jsonp. This plugin is using script onload / onerror method along with timeout to get the error callback.
-]]>Setup Php, mysql & phpmyadmin:
- - sudo apt-get install php5-fpm php-apc mysql-server mysql-client phpmyadmin nginx
-Enter your MySQL password and phpmyadmin webinterface password when prompted
- -Enable mysql extension by editing /etc/php5/fpm/php.ini
- -sudo vim /etc/php5/fpm/php.ini
-Add the following line and save
- -extension=mysql.so
-Restart to use new config
- - sudo /etc/init.d/php5-fpm restart
- sudo /etc/init.d/nginx restart
-Next create a basic nginx vhost configuration in /etc/nginx/sites-available/ directory as follows:
- -sudo vim /etc/nginx/sites-available/phpmyadmin
-And add the following:
- -server {
-
- listen 80;
- server_name admin.lvh.me lvh.me;
- root /var/www/phpmyadmin;
- if ($http_host != "admin.lvh.me") {
- rewrite ^ http://admin.lvh.me$request_uri permanent;
- }
- index index.php index.html;
- location = /favicon.ico {
- log_not_found off;
- access_log off;
- }
- location = /robots.txt {
- allow all;
- log_not_found off;
- access_log off;
- }
- # Make sure files with the following extensions do not get loaded by nginx because nginx would display the source code, and these files can contain PASSWORDS!
- location ~* \.(engine|inc|info|install|make|module|profile|test|po|sh|.*sql|theme|tpl(\.php)?|xtmpl)$|^(\..*|Entries.*|Repository|Root|Tag|Template)$|\.php_ {
- deny all;
- }
- # Deny all attempts to access hidden files such as .htaccess, .htpasswd, .DS_Store (Mac).
- location ~ /\. {
- deny all;
- access_log off;
- log_not_found off;
- }
- location ~* \.(jpg|jpeg|png|gif|css|js|ico)$ {
- expires max;
- log_not_found off;
- }
- location ~ \.php$ {
- try_files $uri =404;
- include /etc/nginx/fastcgi_params;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- }
-
- location /phpmyadmin {
- root /usr/share/;
- index index.php index.html index.htm;
- location ~ ^/phpmyadmin/(.+\.php)$ {
- try_files $uri =404;
- root /usr/share/;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_index index.php;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- include /etc/nginx/fastcgi_params;
- }
- location ~* ^/phpmyadmin/(.+\.(jpg|jpeg|gif|css|png|js|ico|html|xml|txt))$ {
- root /usr/share/;
- }
- }
- location /phpMyAdmin {
- rewrite ^/* /phpmyadmin last;
- }
-}
-To enable that vhost, we create a symlink to it from the /etc/nginx/sites-enabled/ directory:
- -cd /etc/nginx/sites-enabled/
-sudo ln -s /etc/nginx/sites-available/phpmyadmin phpmyadmin
-Reload nginx for the new configuration to take effect:
- -sudo /etc/init.d/nginx reload
-Open the link in the browser http://admin.lvh.me/phpmyadmin
-]]>The web had already shifted from static web pages to ajax driven websites for good. This shift have made the web awesome and faster but have introduced some new problems which need to taken care of . One of these is failed ajax requests. There are many reasons for a ajax request to fail, some of them are
- -Normally the ajax pull data from self hosted as well 3rd party hosted APIs. In both cases, the failure of ajax request has to handled at both ends, but front end is more important because of its high impact on the user experience. In case of 3rd party APIs, there is any way no possibility to have control over back-end, so front-end is the default choice.
- -The browser behaves differently when it comes to make a ajax calls for same origin and ajax call for cross origin, and therefore exceptional handling also have to different.
- -In jQuery, the simplest way to catch all the ajax errors and exceptions on a web page
- -$(document).ajaxError(function(event, jqXHR, ajaxSettings, thrownError) {
-
- // This is the default error handler for ajax request.
-
- // Extract all the information required to understand.
- var requestResponse = {
- url: ajaxSettings.url,
- method: ajaxSettings.type,
- data: ajaxSettings.data,
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- data: ajaxSettings.data
- };
-
- console.error(requestResponse)
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
-});
-One important thing to note here is this handler is not called for cross-domain scripts and cross-domain JSONP requests which made its easy to avoid any ajax errors happening in application other than your native javascript code.
- -Note If $.ajax() or $.ajaxSetup() is called with the global option set to false, the .ajaxError() method will not fire.
Apart from this generic handler, it is possible to have a dedicated error handler for each type of request.
- -$.ajax({
-
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- error: function(jqXHR, textStatus,errorThrown) {
- var requestResponse = {
- httpStatus: jqXHR.status,
- error: thrownError || jqXHR.statusText,
- };
-
- console.log(requestResponse);
-
- // Notify the user so he might not wonder.
- alert('Something went wrong, Please try again');
-
-
- // Report it back for fixing it
- // Only for debuggify users
- var ajaxErrors = debuggify.Logger.get('ajax_errors');
- ajaxErrors.attach(requestResponse);
- ajaxErrors.error('Caught ajax error');
-
- }
-});
-Event this dedicated handler is not called for cross-domain script and cross-domain JSONP requests.
- -The limitation for ajax exception handlers is not just a jQuery limitation, but it is a javascript limitation. The reason behind this limitation is that most browser are not giving permissions to access error messages for cross domain scripts due to security reasons.
- -There are some solutions (or workarounds) for this. (Reference stackoverflow )
- -First one, if backend is accessible, set (in my example PHP) headers to allow a cross domain call. When you do this, then JavaScript accepts the call, and no crossdomain tricks are needed.
- - header('Access-Control-Allow-Origin: http://domain1.com, http://domain2.com'); //whitelist
-Secondly if there is no access to backend, a timeout based workaround can be used to get a error callback
- -$.ajax({
- type: "POST",
- url: "https://api.twitter.com/1.1/statuses/user_timeline.json",
- success: start_map,
- timeout: 2000, // 2 seconds timeout before error function will be called
- dataType: 'script',
- crossDomain: true
-});
-This is a nasty trick to solve the problem as it can definitely screw up things for slow internet connection.
- -Another alternative option is using the jQuery plugin jquery-jsonp. This plugin is using script onload / onerror method along with timeout to get the error callback.
-In the past we have received many requests related to attach some custom data along with every messages collected.
- -We have added this functionality, and to simplify it, we have come with 3 new APIs
- -Using this api, its possible to set an alias to the unique user identification used by the debuggify. This make it easy to map a debuggify user identifier to your site username or email id. Remember the old data will not have alias.
- -debuggify.alias('foo@example.com');
-Its pretty straight forward to use the above api.
- -Note Make sure every unique user should be given the one alias to avoid any data inconsistency.
- -To attach custom data along with every message
- -debuggify.metadata({'login': true});
-To attach custom data along with a single message. This api need to be called on the logger object
- -var ajaxErrors = debuggify.Logger.get('ajax_errors');
-
-ajaxErrors.attach({
- type: 'POST',
- url: '/api/notification'
-});
-
-ajaxErrors.error('Error in Notification Api');
-After calling attach, it must be followed by the one of the logging Apis like .log, .error, .warn, .debug or .message to push that data to the server.
Note: The attached data will expire after its once used by logging Api’s. To send data with every request use .metadata api
We soon be adding use cases on how to use this APIs more powerfully.
-Setup Php, mysql & phpmyadmin:
- - sudo apt-get install php5-fpm php-apc mysql-server mysql-client phpmyadmin nginx
-Enter your MySQL password and phpmyadmin webinterface password when prompted
- -Enable mysql extension by editing /etc/php5/fpm/php.ini
- -sudo vim /etc/php5/fpm/php.ini
-Add the following line and save
- -extension=mysql.so
-Restart to use new config
- - sudo /etc/init.d/php5-fpm restart
- sudo /etc/init.d/nginx restart
-Next create a basic nginx vhost configuration in /etc/nginx/sites-available/ directory as follows:
- -sudo vim /etc/nginx/sites-available/phpmyadmin
-And add the following:
- -server {
-
- listen 80;
- server_name admin.lvh.me lvh.me;
- root /var/www/phpmyadmin;
- if ($http_host != "admin.lvh.me") {
- rewrite ^ http://admin.lvh.me$request_uri permanent;
- }
- index index.php index.html;
- location = /favicon.ico {
- log_not_found off;
- access_log off;
- }
- location = /robots.txt {
- allow all;
- log_not_found off;
- access_log off;
- }
- # Make sure files with the following extensions do not get loaded by nginx because nginx would display the source code, and these files can contain PASSWORDS!
- location ~* \.(engine|inc|info|install|make|module|profile|test|po|sh|.*sql|theme|tpl(\.php)?|xtmpl)$|^(\..*|Entries.*|Repository|Root|Tag|Template)$|\.php_ {
- deny all;
- }
- # Deny all attempts to access hidden files such as .htaccess, .htpasswd, .DS_Store (Mac).
- location ~ /\. {
- deny all;
- access_log off;
- log_not_found off;
- }
- location ~* \.(jpg|jpeg|png|gif|css|js|ico)$ {
- expires max;
- log_not_found off;
- }
- location ~ \.php$ {
- try_files $uri =404;
- include /etc/nginx/fastcgi_params;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- }
-
- location /phpmyadmin {
- root /usr/share/;
- index index.php index.html index.htm;
- location ~ ^/phpmyadmin/(.+\.php)$ {
- try_files $uri =404;
- root /usr/share/;
- fastcgi_pass 127.0.0.1:9000;
- fastcgi_index index.php;
- fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
- include /etc/nginx/fastcgi_params;
- }
- location ~* ^/phpmyadmin/(.+\.(jpg|jpeg|gif|css|png|js|ico|html|xml|txt))$ {
- root /usr/share/;
- }
- }
- location /phpMyAdmin {
- rewrite ^/* /phpmyadmin last;
- }
-}
-To enable that vhost, we create a symlink to it from the /etc/nginx/sites-enabled/ directory:
- -cd /etc/nginx/sites-enabled/
-sudo ln -s /etc/nginx/sites-available/phpmyadmin phpmyadmin
-Reload nginx for the new configuration to take effect:
- -sudo /etc/init.d/nginx reload
-Open the link in the browser http://admin.lvh.me/phpmyadmin
-Last week, I was writing code in javascript when I found something that completly blew off my mind. This is what I found
- -
Yeah, IE thowing error in javascript comment. For some time I didnot believe what I am seeing, but gradually I came to my senses. Like most developers, first thing I did was started cursing IE on twitter, but later reality struct me and that is to find a solution to this mess.
- -I dig in a lot of wrong places until I found conditional comments in IE. A sample of how the conditional logic works is below
- -<script>
-/*@cc_on
-
- @if (@_jscript_version == 10)
- document.write("You are using IE10");
-
- @elif (@_jscript_version == 9)
- document.write("You are using IE9");
-
- @elif (@_jscript_version == 5.8)
- document.write("You are using IE8");
-
- @elif (@_jscript_version == 5.7 && window.XMLHttpRequest)
- document.write("You are using IE7");
-
- @elif (@_jscript_version == 5.6 || (@_jscript_version == 5.7 && !window.XMLHttpRequest))
- document.write("You are using IE6");
-
- @elif (@_jscript_version == 5.5)
- document.write("You are using IE5.5");
-
- @else
- document.write("You are using IE5 or older");
-
- @end
-
-@*/
-</script>
-To fix this all I need to do is to remove the whole comment. This comment is anyways useful for sourcemaps supported browsers which is long way to go for IE.
- -Anyways this is just a hack for the time being. The sourcemap specs has been updated due to this problem. To know more check the uglifyjs issue on github
- -Finally all I have to say is God Bless IE Developers
Today I had great time sharing my experience on javascript debugging with the javascript ninja community at Bangalore
- -Here is the presentation
- - - - - - -I will be explaining each point in details in the future posts.
- -I know I have abandoned the blog for long time but not any more. Stay connected for more.
- -Happy Debugging !!
-Scott Hanselman blogged about JavaScript the assembly language for the web. There a plenty of languages that compiles to javascript. With the addition of Dart from Google and Typescript from Microsoft a war has broke out for better.
- -With the rise of compiled to javascript languages it hard to traceback the errors to original source. Almost all modern provides the window.onerror api to catch all uncaught exceptions on a page. This api provides very limited information (error message, filename and line number only) which is the root cause of many problems.
- -With modern web development practices the amount of javascript code per page is growing rapidly. Also this code is minified by the minification tools(like Google Closure Compiler, UglifyJS2 etc) to reduce the code size. After minification whole code ends in one single line. Here is where most problem starts. I am listing some really annoying issues related to window.onerror below
- -Missing Char No: The char no is very important for the minified code to point at the exact statement as there is only one line in minified code. Even source maps cannot be helpful in tracking back to original line.
No Call Stack: The call stack is completely hidden from the developer so its hard to identify the functions flow. However there is a trick to extract stack in IE9 only.
Cross Origin Errors: These types are thown when some cross origin permission is broken. They are very common on pages with facebook like and google plus widget installed. For such errors window.error message throw a single message “Script Error”. As per stackoverflow post this behavior is intentional to avoid some security risks but its at expense of useful debugging information.
Most of above mentioned problems are roadblock in debugging production websites / applications. There is a need for better tools and libraries for the job.
- -I will soon be writing a post on Best Debugging Practices For Javascript In Production Environment
-I was born 6 years back when I bought my first computer and a internet connection. To be frank, Internet is a second home to me. For most of people out there who feel same, are continuously trying to make Internet a better place.
- -I am also a computer science engineering grad, so I am surrounded by technology. In order to feed my engineering inquisitiveness I have explored the black, white and gray sections of the internet.
- -I am a full stack web developer by profession and have authored / co-authored many 3rd party social plugins for Shareaholic Inc which runs on thousands of different blogs and websites driving 1+ billion pageviews per month. These plugins can be installed on different CMS/blogging platform like Wordpress, Drupal, Tumblr, Blogger etc. While working on these plugins I closely interact with the different elements of the modern internet ecosystem.
- -- -A 3rd party plugin has to be robust enough to work in 3rd party environments while interacting with 3rd party apis and support every major browser vendor out there
Elaborating the above quote
- -doesn't break itself and neither the websitegood page load timenot conflict with other existing pluginssupport major browser vendors including internet explorersupport legacy browser versions like ie6 ie7 etc.As all wise developers know
- -- -Zero Bugs is a Myth
I have talked to a few friends about the problems. All are encountering similar set of problems on the daily basic. A majority their development time is spend in debugging and fixing bugs. The debugging is also becoming hard due to the evolving nature of the web.
- -So I finally decided to go on a quest to make Internet a better place for developers.
- -- -Developers are the keepers of the modern internet.
The web is evolving because of the developers. There are around 1+ million developers on the planet. I can build something that make developers more productive and can save up to 1hr/day of their time, it’s going to be revolutionary. Developers can reinvest this time in open source projects, new innovations or anything that eventually make Internet a better place
- -So that is Debuggify is all about. Contact me if you want to join me on my quest.
-'+de+"
'},counterHtml:function(b){return b>0?'
Comments
',"","