shengzhaoli.shengz
1 year ago
6 changed files with 297 additions and 41 deletions
@ -0,0 +1,107 @@ |
|||||||
|
<!DOCTYPE html> |
||||||
|
<html lang="en" xmlns:th="https://www.thymeleaf.org"> |
||||||
|
<head> |
||||||
|
<meta charset="utf-8"/> |
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
||||||
|
<title>授权确认 - Spring Security&OAuth2.1</title> |
||||||
|
<link rel="stylesheet" href="../static/bootstrap.min.css" th:href="@{/bootstrap.min.css}"/> |
||||||
|
<script> |
||||||
|
function cancelConsent() { |
||||||
|
document.consent_form.reset(); |
||||||
|
document.consent_form.submit(); |
||||||
|
} |
||||||
|
</script> |
||||||
|
</head> |
||||||
|
<body> |
||||||
|
<div class="container"> |
||||||
|
<div class="row py-5"> |
||||||
|
<h1 class="text-center text-primary">授权确认</h1> |
||||||
|
</div> |
||||||
|
<div class="row"> |
||||||
|
<div class="col text-center"> |
||||||
|
<p> |
||||||
|
The application |
||||||
|
<span class="fw-bold text-primary" th:text="${clientId}"></span> |
||||||
|
wants to access your account |
||||||
|
<span class="fw-bold" th:text="${principalName}"></span> |
||||||
|
</p> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div th:if="${userCode}" class="row"> |
||||||
|
<div class="col text-center"> |
||||||
|
<p class="alert alert-warning"> |
||||||
|
You have provided the code |
||||||
|
<span class="fw-bold" th:text="${userCode}"></span>. |
||||||
|
Verify that this code matches what is shown on your device. |
||||||
|
</p> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="row pb-3"> |
||||||
|
<div class="col text-center"> |
||||||
|
<p> |
||||||
|
The following permissions are requested by the above app.<br/> |
||||||
|
Please review these and consent if you approve. |
||||||
|
</p> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="row"> |
||||||
|
<div class="col text-center"> |
||||||
|
<form name="consent_form" method="post" th:action="${requestURI}"> |
||||||
|
<input type="hidden" name="client_id" th:value="${clientId}"> |
||||||
|
<input type="hidden" name="state" th:value="${state}"> |
||||||
|
<input th:if="${userCode}" type="hidden" name="user_code" th:value="${userCode}"> |
||||||
|
|
||||||
|
<div th:each="scope: ${scopes}" class="form-check py-1"> |
||||||
|
<input class="form-check-input" |
||||||
|
style="float: none" |
||||||
|
type="checkbox" |
||||||
|
name="scope" |
||||||
|
th:value="${scope.scope}" |
||||||
|
th:id="${scope.scope}"> |
||||||
|
<label class="form-check-label fw-bold px-2" th:for="${scope.scope}" |
||||||
|
th:text="${scope.scope}"></label> |
||||||
|
<p class="text-primary" th:text="${scope.description}"></p> |
||||||
|
</div> |
||||||
|
|
||||||
|
<p th:if="${not #lists.isEmpty(previouslyApprovedScopes)}"> |
||||||
|
You have already granted the following permissions to the above app: |
||||||
|
</p> |
||||||
|
<div th:each="scope: ${previouslyApprovedScopes}" class="form-check py-1"> |
||||||
|
<input class="form-check-input" |
||||||
|
style="float: none" |
||||||
|
type="checkbox" |
||||||
|
th:id="${scope.scope}" |
||||||
|
disabled |
||||||
|
checked> |
||||||
|
<label class="form-check-label fw-bold px-2" th:for="${scope.scope}" |
||||||
|
th:text="${scope.scope}"></label> |
||||||
|
<p class="text-primary" th:text="${scope.description}"></p> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="pt-3"> |
||||||
|
<button class="btn btn-primary btn-lg" type="submit" id="submit-consent"> |
||||||
|
Submit Consent |
||||||
|
</button> |
||||||
|
</div> |
||||||
|
<div class="pt-3"> |
||||||
|
<button class="btn btn-link regular" type="button" id="cancel-consent" onclick="cancelConsent();"> |
||||||
|
Cancel |
||||||
|
</button> |
||||||
|
</div> |
||||||
|
</form> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="row pt-4"> |
||||||
|
<div class="col text-center"> |
||||||
|
<p> |
||||||
|
<small> |
||||||
|
Your consent to provide access is required.<br/> |
||||||
|
If you do not approve, click Cancel, in which case no information will be shared with the app. |
||||||
|
</small> |
||||||
|
</p> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div th:replace="~{fragments/main :: footer}"/> |
||||||
|
</body> |
||||||
|
</html> |
||||||
@ -0,0 +1,36 @@ |
|||||||
|
<!DOCTYPE html> |
||||||
|
<html lang="en" xmlns:th="https://www.thymeleaf.org"> |
||||||
|
<head> |
||||||
|
<meta charset="utf-8"/> |
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
||||||
|
<title>Device Login - Spring Security&OAuth2.1</title> |
||||||
|
<link rel="stylesheet" href="../static/bootstrap.min.css" th:href="@{/bootstrap.min.css}"/> |
||||||
|
</head> |
||||||
|
<body> |
||||||
|
<div class="container"> |
||||||
|
<div class="row py-5"> |
||||||
|
<h1 class="text-center text-primary">Device Login</h1> |
||||||
|
</div> |
||||||
|
<div class="row"> |
||||||
|
<div class="col text-center"> |
||||||
|
<form name="device_form" method="post" action=""> |
||||||
|
<div class="form-group"> |
||||||
|
<label for="user_code">Device User-Code</label> |
||||||
|
<input type="text" class="form-control" id="user_code" name="user_code" placeholder="XXXX-XXXX" |
||||||
|
required/> |
||||||
|
<p class="help-block">Please type device user code</p> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="form-group"> |
||||||
|
<button class="btn btn-primary btn-lg" type="submit" id="submit-">Submit</button> |
||||||
|
</div> |
||||||
|
<div class="pt-3"> |
||||||
|
<a class="btn btn-link regular" id="cancel-" th:href="@{/}">Cancel</a> |
||||||
|
</div> |
||||||
|
</form> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div th:replace="~{fragments/main :: footer}"/> |
||||||
|
</body> |
||||||
|
</html> |
||||||
@ -0,0 +1,113 @@ |
|||||||
|
<!DOCTYPE html> |
||||||
|
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/extras/spring-security"> |
||||||
|
<head> |
||||||
|
<meta charset="utf-8"/> |
||||||
|
<meta name="viewport" content="width=device-width,user-scalable=no"/> |
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> |
||||||
|
<link rel="shortcut icon" href="../static/favicon.ico" th:href="@{/favicon.ico}"/> |
||||||
|
|
||||||
|
<title>Home - Spring Security&OAuth2.1</title> |
||||||
|
|
||||||
|
<th:block th:insert="~{fragments/main::header-css}"/> |
||||||
|
</head> |
||||||
|
<body class="container"> |
||||||
|
<h2>Spring Security&OAuth2.1 |
||||||
|
<small class="badge" title="Version">3.0.0</small> |
||||||
|
</h2> |
||||||
|
|
||||||
|
<div> |
||||||
|
Logged: <span class="text-success" th:text="${#authentication.principal.username}"></span> |
||||||
|
<br/> |
||||||
|
Authorities：<span th:each="authority : ${#authentication.authorities}" th:text="${authority.authority + ' '}"></span> |
||||||
|
|
||||||
|
<form th:action="@{/signout}" method="post"> |
||||||
|
<button class="btn btn-info btn-sm" type="submit">Logout</button> |
||||||
|
</form> |
||||||
|
</div> |
||||||
|
<br/> |
||||||
|
<div> |
||||||
|
操作说明: |
||||||
|
<ol> |
||||||
|
<li> |
||||||
|
<p> |
||||||
|
菜单 User 是不需要OAuth 验证即可访问的(即公开的resource); 用于管理用户信息(添加,删除等). |
||||||
|
</p> |
||||||
|
</li> |
||||||
|
<li> |
||||||
|
<p> |
||||||
|
菜单 Unity 与 Mobile 需要OAuth 验证后才能访问(即受保护的resource); <br/> |
||||||
|
Unity 需要 [ROLE_UNITY] 权限, Mobile 需要 [ROLE_MOBILE] 权限. |
||||||
|
</p> |
||||||
|
</li> |
||||||
|
<li> |
||||||
|
<p> |
||||||
|
在使用之前, 建议先了解OAuth2.1支持的<code>grant_type</code>, 请访问 <a href="https://andaily.com/blog/?p=103" |
||||||
|
target="_blank">https://andaily.com/blog/?p=103</a> |
||||||
|
</p> |
||||||
|
</li> |
||||||
|
<li> |
||||||
|
<p> |
||||||
|
在项目的 others目录里有 <a |
||||||
|
href="https://gitee.com/shengzhao/spring-oauth-server/blob/config/others/oauth_test.txt" |
||||||
|
target="_blank">oauth_test.txt</a>文件, 里面有测试的URL地址(包括浏览器与客户端的),<br/> |
||||||
|
若想访问 Unity 与 Mobile, 则先用基于浏览器的测试URL 访问,等验证通过后即可访问(注意不同的账号对应的权限). |
||||||
|
</p> |
||||||
|
</li> |
||||||
|
<li> |
||||||
|
<p> |
||||||
|
若需要自定义<code>client_details</code>数据并进行测试, |
||||||
|
可进入<a th:href="@{client_details}">client_details</a>去手动添加<code>client_details</code>或删除已创建的<code>client_details</code>. |
||||||
|
</p> |
||||||
|
</li> |
||||||
|
</ol> |
||||||
|
</div> |
||||||
|
<br/> |
||||||
|
菜单 |
||||||
|
<ul> |
||||||
|
<li> |
||||||
|
<p> |
||||||
|
<a th:href="@{/api/SOS_API-2.0.html}" href="../static/api/SOS_API-2.0.html" target="_blank">API</a> <span |
||||||
|
class="text-muted">- 查看提供的API文档</span> |
||||||
|
</p> |
||||||
|
</li> |
||||||
|
<li> |
||||||
|
<p> |
||||||
|
<a th:href="@{client_details}">client_details</a> <span class="text-muted">- 管理ClientDetails</span> |
||||||
|
</p> |
||||||
|
</li> |
||||||
|
<li sec:authorize="hasRole('ROLE_ADMIN')"> |
||||||
|
<p> |
||||||
|
<a th:href="@{/user/overview}">User</a> <span class="text-muted">- 管理User</span> |
||||||
|
</p> |
||||||
|
</li> |
||||||
|
<li> |
||||||
|
<p> |
||||||
|
<a th:href="@{/unity/dashboard}">Unity</a> <span class="text-muted">- Unity 资源(resource), 需要具有 [ROLE_UNITY] 权限才能访问</span> |
||||||
|
</p> |
||||||
|
</li> |
||||||
|
<li> |
||||||
|
<p> |
||||||
|
<a th:href="@{/m/dashboard}">Mobile</a> <span class="text-muted">- Mobile资源(resource), 需要具有 [ROLE_MOBILE] 权限才能访问</span> |
||||||
|
</p> |
||||||
|
</li> |
||||||
|
</ul> |
||||||
|
<br/> |
||||||
|
|
||||||
|
<div class="well well-sm"> |
||||||
|
<p> |
||||||
|
<strong>说明</strong>: Unity与Mobile菜单需要先获取到<code>access_token</code>后才能正常访问; 可以尝试在URL后面任意添加access_token参数值试试效果, |
||||||
|
<br/> |
||||||
|
如: <a th:href="@{/m/dashboard?access_token=i_am_testing_access_token}">/m/dashboard?access_token=i_am_testing_access_token</a> |
||||||
|
</p> |
||||||
|
|
||||||
|
<p> |
||||||
|
请求受保护的资源时传递 |
||||||
|
<mark>Access Token</mark> |
||||||
|
有两种方式, 方式一在URL参数中添加<code>access_token</code>, 方式二在请求的Header中添加 <em>Authorization</em>, 其值为 <em>Bearer |
||||||
|
your_access_token</em>【推荐方式二】 |
||||||
|
</p> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div th:replace="~{fragments/main :: footer}"/> |
||||||
|
</body> |
||||||
|
</html> |
||||||
Loading…
Reference in new issue