Login with GitHub

pom.xml

@@ -74,6 +74,15 @@
 			<artifactId>azure-storage-spring-boot-starter</artifactId>
 		</dependency>
 
+		<dependency>
+			<groupId>org.springframework.security</groupId>
+			<artifactId>spring-security-oauth2-client</artifactId>
+		</dependency>
+		<dependency>
+			<groupId>org.springframework.security</groupId>
+			<artifactId>spring-security-oauth2-jose</artifactId>
+		</dependency>
+
 		<dependency>
 			<groupId>org.springframework.boot</groupId>
 			<artifactId>spring-boot-devtools</artifactId>

src/main/java/com/microsoft/azure/springcloudplayground/controller/MainController.java

@@ -11,11 +11,15 @@
 import org.apache.tools.ant.Project;
 import org.apache.tools.ant.taskdefs.Zip;
 import org.apache.tools.ant.types.ZipFileSet;
+import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.http.ResponseEntity;
 import org.springframework.lang.NonNull;
+import org.springframework.security.oauth2.client.OAuth2AuthorizedClientService;
+import org.springframework.security.oauth2.client.authentication.OAuth2AuthenticationToken;
 import org.springframework.stereotype.Controller;
 import org.springframework.ui.Model;
 import org.springframework.util.StreamUtils;
+import org.springframework.util.StringUtils;
 import org.springframework.web.bind.annotation.*;
 import org.springframework.web.servlet.resource.ResourceUrlProvider;
 
@@ -108,7 +112,10 @@ private void triggerLoginEvent(@NonNull String accountType) {
     }
 
     @RequestMapping(path = "/", produces = "text/html")
-    public String home(Map<String, Object> model) {
+    public String home(Map<String, Object> model, OAuth2AuthenticationToken token) {
+        if (token != null && !StringUtils.isEmpty(token.getName())) {
+            model.put("loggedInUser", token.getPrincipal().getAttributes().get("login"));
+        }
 
         this.addBuildInformation(model);
         this.renderHome(model);

src/main/java/com/microsoft/azure/springcloudplayground/security/WebSecurityConfig.java

@@ -3,12 +3,19 @@
 import org.springframework.security.config.annotation.web.builders.HttpSecurity;
 import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity;
 import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter;
+import org.springframework.security.web.util.matcher.AntPathRequestMatcher;
 
 @EnableWebSecurity
 public class WebSecurityConfig extends WebSecurityConfigurerAdapter{
 
     @Override
     protected void configure(HttpSecurity http) throws Exception {
-        http.authorizeRequests().anyRequest().permitAll();
+        http.authorizeRequests().anyRequest().permitAll().and().oauth2Login().loginPage("/");
+
+        http.formLogin().disable()
+                .logout().logoutRequestMatcher(new AntPathRequestMatcher("/logout"))
+                .logoutSuccessUrl("/").deleteCookies("JSESSIONID").invalidateHttpSession(true);
+
+        http.httpBasic().disable();
     }
 }

src/main/resources/application.yml

@@ -1,6 +1,14 @@
 spring:
   mustache:
     expose-request-attributes: true
+  security:
+    oauth2:
+      client:
+        registration:
+          github:
+            client-id: xxxxxx
+            client-secret: xxxxxxx
+            scope: user, public_repo
 
 playground:
   env:

src/main/resources/static/css/customize.css

@@ -121,6 +121,7 @@ body, button, input, p, select, textarea, label, h1, h2, h3, h4 {
     top: 0;
     right: 0;
     border: 0;
+    z-index: 1000;
 }
 
 .start-video {

src/main/resources/static/js/auth.js

@@ -0,0 +1,34 @@
+(function() {
+    var $signInButton = $("#login_link");
+    var $signOutButton = $("#logout_link");
+    var $userDropdown = $("#user_dropdown");
+    var $loggedUser = $("#logged_user");
+
+    $signOutButton.on("click", function() {
+        logout();
+    });
+
+    function logout() {
+        var csrfToken = $("input[name='_csrf']").val();
+        var csrfTokenHeader = $("input[name='_csrf_header']").val();
+
+        var xhttp = new XMLHttpRequest();
+
+        xhttp.onreadystatechange = function () {
+            if(this.readyState == XMLHttpRequest.DONE && this.status == 200) {
+                loggedOutSuccess();
+            }
+        }
+
+        xhttp.open("POST", '/logout');
+        xhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
+        xhttp.setRequestHeader(csrfTokenHeader, csrfToken);
+        xhttp.send(null);
+    }
+
+    function loggedOutSuccess() {
+        $signInButton.removeClass("hidden");
+        $userDropdown.addClass("hidden");
+        $loggedUser.text(undefined);
+    }
+}())

src/main/resources/templates/home.mustache

@@ -30,6 +30,21 @@
                     Spring Cloud Azure Playground
                 </h1>
             </div>
+            <div class="navbar-end azure-navbar-link {{#loggedInUser}}hidden{{/loggedInUser}}" id="login_link">
+                <a href="/oauth2/authorization/github">Login</a>
+            </div>
+            <div class="navbar-end azure-navbar-link {{^loggedInUser}}hidden{{/loggedInUser}}" id="user_dropdown">
+                <div class="navbar-item has-dropdown is-hoverable">
+                    <a class="truncate" id="logged_user">
+                        {{#loggedInUser}}{{loggedInUser}}{{/loggedInUser}}
+                    </a>
+                    <div class="navbar-dropdown" id="logout_link">
+                        <a class="navbar-item">
+                            Logout
+                        </a>
+                    </div>
+                </div>
+            </div>
         </div>
     </div>
 </nav>
@@ -84,6 +99,7 @@
 <script src="{{#linkTo}}/js/mousetrap.min.js{{/linkTo}}"></script>
 <script src="{{#linkTo}}/js/adal.min.js{{/linkTo}}"></script>
 <script src="{{#linkTo}}/js/all.js{{/linkTo}}"></script>
+<script src="{{#linkTo}}/js/auth.js{{/linkTo}}"></script>
 <script src="{{#linkTo}}/js/start.js{{/linkTo}}"></script>
 </body>
 </html>