user権限変更非同期

src/main/java/com/example/SecurityConfig.java

@@ -14,7 +14,7 @@ public class SecurityConfig extends WebSecurityConfigurerAdapter{
 	
 	@Override
 	public void configure(WebSecurity web) throws Exception{
-		web.debug(false).ignoring().antMatchers("/images/**", "/js/**", "/css/**", "/fonts/**", "/limited/inputCart", "/limited/buy", "/limited/editCart");
+		web.debug(false).ignoring().antMatchers("/images/**", "/js/**", "/css/**", "/fonts/**", "/limited/inputCart", "/limited/buy", "/limited/editCart", "/limited/admin/management/1/changeRole");
 	}
 	
 	@Override
@@ -35,6 +35,7 @@ public class SecurityConfig extends WebSecurityConfigurerAdapter{
 				.invalidateHttpSession(true)
 				.deleteCookies("JSESSIONID") //ログアウト時キャッシュを削除する処理
 				.logoutSuccessUrl("/limited/login"); //ログアウト後に表示するURL
+		//http.csrf().disable();
 	}
 	
 	@Bean //パスワードのハッシュか

src/main/java/com/example/web/ManagementController.java

@@ -204,19 +204,19 @@ public class ManagementController {
 		return "redirect:/limited/admin/management";
 	}
 	
-	//user権限変更
-	@PostMapping(path = "{id}")
-	String changeRoles(Integer id, @AuthenticationPrincipal LoginUser loginUser){
-		User user = loginUserDetailsService.findOne(id);
-		String role = user.getRoles();
-		if(role.equals("ADMIN")){
-			user.setRoles("USER");
-		}else{
-			user.setRoles("ADMIN");
-		}
-		loginUserDetailsService.create(user);
-		return "redirect:/limited/admin/management";
-	}
+//	//user権限変更
+//	@PostMapping(path = "{id}")
+//	String changeRoles(Integer id, @AuthenticationPrincipal LoginUser loginUser){
+//		User user = loginUserDetailsService.findOne(id);
+//		String role = user.getRoles();
+//		if(role.equals("ADMIN")){
+//			user.setRoles("USER");
+//		}else{
+//			user.setRoles("ADMIN");
+//		}
+//		loginUserDetailsService.create(user);
+//		return "redirect:/limited/admin/management";
+//	}
 	
 
 }

src/main/java/com/example/web/ManagementRestController.java

+package com.example.web;
+
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.security.core.annotation.AuthenticationPrincipal;
+import org.springframework.web.bind.annotation.PathVariable;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+
+import com.example.domain.User;
+import com.example.service.LoginUser;
+import com.example.service.LoginUserDetailsService;
+
+
+@RestController
+@RequestMapping("limited/admin/management")
+public class ManagementRestController {
+	@Autowired
+	LoginUserDetailsService loginUserDetailsService;
+	
+	//user権限変更
+	@PostMapping(path = "{id}/changeRole")
+	User changeRoles(@PathVariable Integer id, @AuthenticationPrincipal LoginUser loginUser, @RequestBody User userdata){
+		User user = loginUserDetailsService.findOne(id);
+		//String role = userdata.getRoles();
+		if(userdata.getRoles().equals("ADMIN")){
+			user.setRoles("USER");
+		}else{
+			user.setRoles("ADMIN");
+		}
+		loginUserDetailsService.create(user);
+		return user;
+	}
+}

src/main/resources/static/js/management.js

@@ -7,15 +7,44 @@ $('#user_button').on('click', function(){
   $('#shoe_management').hide();
 })
 
-//権限変更の確認アラート
-$('.roleBtn').on('click', function(){
-  if(!confirm('本当に権限を変更しますか?')) {
-    return false;
-  }else{
-    //user権限変更
-  }
+
+//権限変更の確認アラート	
+$('.roleBtn').click(function(event){
+	var token = $("meta[name='_csrf']").attr("content");
+	var header = $("meta[name='_csrf_header']").attr("content");
+	$(document).ajaxSend(function(e, xhr, options) {
+		xhr.setRequestHeader(header, token);
+	});
+	console.log("ok");
+	if(confirm('本当に権限を変更しますか?')) {
+		//user権限変更
+		let userIntId = event.target.parentElement.parentElement.parentElement.parentElement.parentElement.children[0].textContent;
+		let userId = parseInt(event.target.parentElement.parentElement.parentElement.parentElement.parentElement.children[0].textContent);
+		let userRole = event.target.parentElement.parentElement.parentElement.parentElement.parentElement.children[2].textContent;
+		let RoleForm = event.target.parentElement.parentElement.parentElement.parentElement.parentElement.children[2];
+
+		let data = {
+				id: userId,
+				roles: userRole
+		};
+
+		$.ajax({
+			type:'POST',
+			url:'management/'+ userIntId + '/changeRole',
+			contentType: 'application/json',
+			dataType: "json",
+			data: JSON.stringify(data)
+		})
+		.done(function(data1,textStatus,jqXHR){
+			//レスポンスからuserRole取得
+			let responseRole = data1.roles;
+			//HTML上で書き換え
+			RoleForm.textContent = responseRole;
+		})
+	}
 })
 
+
 //商品管理
 $('#shoe_button').on('click', function(){
   $('#user_management').hide();

src/main/resources/templates/management.html

@@ -2,6 +2,8 @@
 <html class="no-js" lang="en" xmlns:th="http://www.thymeleaf.org"
 							  xmlns:sec="http://www.thymeleaf.org/extras/spring-security">
     <head>
+    	<meta name="_csrf" th:content="${_csrf.token}"/>
+		<meta name="_csrf_header" th:content="${_csrf.headerName}"/>
         <meta charset="utf-8"/>
         <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
         <title>Limited</title>
@@ -42,17 +44,20 @@
                             <tr th:each="users : ${users}">
                                 <td th:text="${users.id}">1</td>
                                 <td th:text="${users.name}">demo</td>
-                                <td name="roles" th:text="${users.roles}"></td>
+                                <td name="roles" th:text="${users.roles}" class="userRoleForm"></td>
                                 <td>
                                 	<div th:object="${user}" th:switch="${user.id}">
                                 	<div th:case="${users.id}">
 										<a>ログイン中のため変更できません</a>
 	                               	</div>
 	                               	<div th:case="*">
-	                                	<form th:action="@{/limited/admin/management/{id}(id=${users.id})}" th:method="post">
+	                                    <form>
+	                                        <button type="button" name="form" value="権限変更" class="roleBtn">権限変更</button>
+	                                    </form>
+	                                    <!-- <form th:action="@{/limited/admin/management/{id}(id=${users.id})}" th:method="post">
 	                                        <input type="submit" name="form" value="権限変更" class="roleBtn"/>
 	                                        <input type="hidden" name="id" th:value="${users.id}"/>
-	                                    </form>
+	                                    </form> -->
 	                               	</div>
 	                                </div>
                                 </td>