1. CSRF Refers to Cross Site Request Forgery. More on CSRF Here
2. When the Client makes the first GET request to the Server, Server generates CSRF token and sends back to Client
3. On the Subsequent PUT,POST and DELETE request from the Client this token would be used for Authentication
4. In Postman for the Same reason GET request would work irrespect we disable the CSRF in protected void configure(HttpSecurity httpSecurity) method. But for the PUT,POST and DELETE we should disable the CSRF as below otherwise the server would expect CSRF token when the request to server is PUT,POST and DELETE.

   @Override
   protected void configure(HttpSecurity httpSecurity) throws Exception
   {
   
   httpSecurity.csrf().disable()
               .authorizeRequests()
               .antMatchers("/", "index", "/css/*", "/js/*").permitAll()
               .
               . 
   

Using CSRF Token for Authorization

1. We have set of API’s exposed to the users whose role is ADMIN
2. The way CSRF works is first Token would be generated once the User Logins using UserID and Password. The Way it works in REST API is first time
   when you use GET method you should use Basic Auth in Authorization to Generate XSRF-TOKEN which would be set in Cookie along with JSessionID and also available in Response Headers
3. By default CSRF is not applicable for GET unless it is pointed to resource API. Simple reason behind that is, when the user types URL of login thats the first page which take login. If you try to access http://localhost:8080/ in postman it works fine without CSRF but when you access http://localhost:8080/api/v1/students/ which again uses GET method but points to resource API then it asks for UserId and Password due to basic Auth
4. Subsequent POST, PUT and DELETE request could be done by attaching X-XSRF-TOKEN to header. The Cookie which has the JSESSIONID and XSRF-TOKEN should not be deleted in Postman
5. Though CSRF is enabled explicity in my Code it didnt worked until i added following lines in ApplicationSecurityConfig.java

   .
   .
           httpSecurity
                        .csrf()
                        .csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse())
   .
   

Accessing resource using GET (No Authentication or Authorization)

Accessing resource using GET (Authentication needed for API Resource)

Accessing resource using POST (X-XSRF-TOKEN) in request header

XSRF-TOKEN received after GET with credentials and X-XSRF-TOKEN in haeder for sunsequent POST,PUT and DELETE calls

ApplicationSecurityConfig.java
Using CSRF Token for Authorization

@Override
    protected void configure(HttpSecurity httpSecurity) throws Exception{
        httpSecurity
                     .csrf()
                     .csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse())
                     .and()
                    .authorizeRequests()
                    .antMatchers("/", "index", "/css/*", "/js/*").permitAll()
                    .antMatchers("/api/**").hasRole("ADMIN")
                    .anyRequest()
                    .authenticated()
                    .and()
                    .httpBasic();
}

FAQ
There are N number of possibilities. Try out in Postman.

1. How GET method to API resource Works with out CSRF token?
   It works based on JSESSIONID. When the JSESSIONID in cookie is deleted then again it asks for Login and password
2. What happens when I delete XSRF token in Cookie?
   New Token would be generated based on JSESSIONID in cookie
3. What happens when I delete XSRF token and in Cookie and try POST, DELETE and PUT over API?
   New JSESSIONID would be generated and placed in cookie. For this X-XSRF-TOKEN should be passed in header.

Note:The example is for CSRF disabled

1. From the above diagram you can see JSESSIONID and HttpStatus.OK is send is response once the credentials are authenticated
2. JSESSIONID would be used for Subsequent request
3. In the below code we define URL for login and logout.

   .formLogin()
   .loginPage("/login").permitAll().usernameParameter("username").passwordParameter("password")
   .defaultSuccessUrl("/test", true)
   .and()
   .rememberMe()
   .and()
   .logout().logoutUrl("/logout").clearAuthentication(true).invalidateHttpSession(true).deleteCookies("JSESSIONID", "remember-me")
   .logoutSuccessUrl("/login")			
   

4. usernameParameter and passwordParameter is the name of the input form element as given in html
5. defaultSuccessUrl tells the default page after authentication
6. rememberMe allows the User to remember the session in server. The default JSESSIONID time is 30 minutes of inactivity. remember-me session would be active for 2 weeks and allows user to access page for 2 weeks
7. logout is similar to login with following

   .logout().logoutUrl("/logout")
   .clearAuthentication(true)
   .invalidateHttpSession(true)
   .deleteCookies("JSESSIONID", "remember-me")
   .logoutSuccessUrl("/login")			
   

JSESSIONID and remember-me as seen in cookie in response after login button clicked

JSESSIONID and remember-me cookie deleted in response after logout button clicked

login.html

<body>
<div class="container">
    <form class="form-signin" method="post" action="/login">
        <table cellpadding="3" cellspacing="3" border="1px solid black" style="border-collapse: collapse">
            <tr>
                <td><label for="username" class="sr-only">Username</label></td>
                <td><input type="text" id="username" name="username" class="form-control" placeholder="Username" required=""
                           autofocus=""></td>
            </tr>
            <tr>
                <td><label for="password" class="sr-only">Password</label></td>
                <td><input type="password" id="password" name="password" class="form-control" placeholder="Password"
                           required=""></td>
            </tr>
            <tr>
                <td><label for="remember-me" class="sr-only">Remember Me?</label></td>
                <td><input type="checkbox" id="remember-me" name="remember-me" class="form-control"></td>
            </tr>
            <tr>
                <td colspan="2" align="center"><button class="btn btn-lg btn-primary btn-block" type="submit">Login</button></td>
            </tr>
        </table>
    </form>
</div>
</body>

test.html

You have been Logged In

<form class="form-signin" method="get" action="/logout">
    <button class="btn btn-lg btn-primary btn-block" type="submit">Logout</button>
</form>

@Override
protected void configure(HttpSecurity httpSecurity) throws Exception{
	httpSecurity
				.csrf().disable()
				.authorizeRequests()
				.antMatchers("/", "index", "/css/*", "/js/*").permitAll()
				.antMatchers("/api/**").hasRole("ADMIN")
				.anyRequest()
				.authenticated()
				.and()
				.formLogin()
				.loginPage("/login").permitAll().usernameParameter("username").passwordParameter("password")
				.defaultSuccessUrl("/test", true)
				.and()
				.rememberMe()
				.and()
				.logout().logoutUrl("/logout").clearAuthentication(true).invalidateHttpSession(true).deleteCookies("JSESSIONID", "remember-me")
				.logoutSuccessUrl("/login");
}

What is the difference between a shim and a polyfill?
Shim
A piece of code that you could add (i.e. JavaScript) that would fix some functionality, but it would most often have it’s own API.Shims intercepts API calls and creates an abstract layer between the caller and the target. Typically shims are used for backward compability. For instance the es5-shim npm package will let you write ECMAScript 5 (ES5) syntax and not care if the browser is running ES5 or not. Take Date.now as an example. This is a new function in ES5 where the syntax in ES3 would be new Date().getTime(). If you use the es5-shim you can write Date.now and if the browser you’re running in supports ES5 it will just run. However, if the browser is running the ES3 engine es5-shim will intercept the call to Date.now and just return new Date().getTime() instead. This interception is called shimming. The relevant source code from es5-shim looks like this:

polyfill
something you could drop in (i.e. JavaScript) and it would silently work to mimic existing browser APIs that are otherwise unsupported.A polyfill is a piece of code (or plugin) that provides the technology that you, the developer, expect the browser to provide natively. Flattening the API landscape if you will.A polyfill is a type of shim that retrofits legacy browsers with modern HTML5/CSS3 features usually using Javascript or Flash.Polyfill is about implementing missing features in an API, whereas a shim wouldn’t necessarily be as much about implementing missing features as it is about correcting features. As an example there is no support for sessionStorage in IE7, but the polyfill in the sessionstorage npm package will add this feature in IE7 (and older) by using techniques like storing data in the name property of the window or by using cookies.

• Java
  • Interface
  • Abstract
  • String
  • Exceptions
  • Lambda
  • Streams
  • Collections
• Spring
  • Spring Core
  • Spring MVC
  • Spring AOP
  • Spring Transaction
• Web Services
  • Rest
  • SOAP
• UI
  • Angular
  • JQuery
  • Javascript
  • HTML
  • CSS

Track Sheet

Track Sheet

Download

Documentation Template

Last Updated on 20211217
Application Overview Excel

Basic Services

Sketch Notes Samples

To remove the Linkedin contacts from the Mobile phone follow the steps as below

Go to phone > Settings > applications > Manage applications > ALL > LinkedIn > Clear Data

Now you need to restart the Android once you are done with this

We are Done