Monday 20 June 2016

Get the current URL via JavaScript and change url to short

Example if url is like this : 
http://localhost:8080/someapplication/?token=sUyJhbGciiOiJIUzI1NiJ9.eyJleHAiOjE0NjYxNzIxNTIs1NiJ9.eyJleHAiOjE0NjYInN1YiI6ImthZ2FtaS1hdXRoLXRpY2tldCIsImlzcyI6ImFkbWluIiwicm9sZSI6ImFkbWluIn0.d50P0r2dyeB-XyOG7I-daRp2Pu1OzaBxwisS4Et_rYI&service=auth#/somepage

and output URL to be : http://localhost:8080/someapplication/#/somepage

working code through javascript below : 

/*URL change start*/
if (history.pushState) {
    var newurl = window.location.protocol + "//" + window.location.host + window.location.pathname + '?token=/';
    window.history.pushState({path:newurl},'',newurl);
}
$(window).bind('hashchange', function() {
/* url change code here */
if (window.location.search.match("?token=")){
     var newHash = "/" + window.location.search;
var newHash = "/" ;
     if (window.history.replaceState){
       window.history.replaceState( {}, "", window.location.toString().replace(window.location.search, ""));
     }     
   }
});
function hashHandler(){
    this.oldHash = window.location.hash;
    this.Check;
    var that = this;
    var detect = function(){
        if(that.oldHash!=window.location.hash){
            //alert("HASH CHANGED - new has" + window.location.hash);
            that.oldHash = window.location.hash;
        }
    };
    this.Check = setInterval(function(){ detect() }, 100);
}
var hashDetection = new hashHandler();
/*URL change end*/

-----------------------------------------------------------------------------------------------------------------------------

JavaScript provides you many methods to retrieve and change the current URL which is displayed in browser's address bar. All these methods uses the Location object, which is a property of the Window object. You can create a new Location object that has the current URL as follows:
var currentLocation = window.location;
Basic Structure of a URL
<protocol>//<hostname>:<port>/<pathname><search><hash>
Basic structure of a URL
  1. Protocol -- Specifies the protocol name be used to access the resource on the Internet. (HTTP (without SSL) or HTTPS (with SSL))
  2. hostname -- Host name specifies the host that owns the resource. For example, www.stackoverflow.com. A server provides services using the name of the host.
  3. port -- A port number used to recognize a specific process to which an Internet or other network message is to be forwarded when it arrives at a server.
  4. pathname -- The path gives info about the specific resource within the host that the Web client wants to access. For example, /index.html.
  5. query -- A query string follows the path component, and provides a string of information that the resource can utilize for some purpose (for example, as parameters for a search or as data to be processed).
  6. hash -- The anchor portion of a URL, includes the hash sign (#).
With these Location object properties you can access all of these URL components
  1. hash - Sets or returns the anchor portion of a URL.
  2. host - Sets or returns the hostname and port of a URL.
  3. hostname - Sets or returns the hostname of a URL.
  4. href - Sets or returns the entire URL.
  5. pathname - Sets or returns the path name of a URL.
  6. port - Sets or returns the port number the server uses for a URL.
  7. protocol - Sets or returns the protocol of a URL.
  8. search - Sets or returns the query portion of a URL


Hope it helps you.......




Saturday 11 June 2016

unique text color to multiple rows in javascript

for(var i=0;i<10;i++){
  var x = ".itemborder" + i;
  var color='#'+Math.random().toString(16).substr(2,6);
  $(x).css("border-color", color );     
}

output : rgb(023, 230, 111)

Sunday 28 February 2016

Cross Site Request Forgery in JS Web Apps

Ensuring that attackers don’t forge requests in your web applications can be a tricky businesses, one that often requires a hand-rolled solution.
As soon as you have a session, you need to start thinking about cross site request forgery (CSRF). Every request to your site will contain authentication cookies, and HTML forms don’t abide by the same origin policy (SOP).
One method of ensuring that destructive requests (PUTs/POSTs/DELETEs) to your site are made from your domain, is by only allowing requests with aContent-Type header of application/json. The only way to set this header is via Ajax, and Ajax requests are limited to the same domain.
However, there have been active vectors in the past that have allowed header injection (such as some of the Flash exploits), and Egor, who is the expert in these things, assures me it’s not enough.
The classic method of preventing CSRF attacks is via a token that you pass with every destructive request. The idea is that attackers can’t get hold of this token (because of the SOP), and thus can’t forge requests.
If you’re using Rails, you get this for free. If you’re using Rack, than Rack CSRF is your best bet. It’ll deal with generating tokens and checking requests. The only part you have to handle is on the client side.
jQuery has a neat feature called ajaxPrefilter, which lets you provide a callback to be invoked every Ajax request. You can pass a CSRF token to the client side via, say, a meta tag. Then set a header using ajaxPrefilter.
var CSRF_HEADER = 'X-CSRF-Token';

var setCSRFToken = function(securityToken) {
  jQuery.ajaxPrefilter(function(options, _, xhr) {
    if ( !xhr.crossDomain ) 
        xhr.setRequestHeader(CSRF_HEADER, securityToken);
  });
};

setCSRFToken($('meta[name="csrf-token"]').attr('content'));
In the example above we’re retrieving our CSRF token from a meta tag in the page. Then we’re ensuring that any local Ajax requests forward the token as part of the request’s header.

site ref : http://blog.alexmaccaw.com/jswebapps-csrf#kudo