微信授權就是這個原理，Spring Cloud OAuth2 授權碼模式

上一篇文章Spring Cloud OAuth2 實現單點登錄介紹了使用 password 模式進行身份認證和單點登錄。本篇介紹 Spring Cloud OAuth2 的另外一種授權模式-授權碼模式。

授權碼模式的認證過程是這樣的：

1、用戶客戶端請求認證服務器的認證接口，並附上回調地址；

2、認證服務接口接收到認證請求后調整到自身的登錄界面；

3、用戶輸入用戶名和密碼，點擊確認，跳轉到授權、拒絕提示頁面(也可省略)；

4、用戶點擊授權或者默認授權后，跳轉到微服務客戶端的回調地址，並傳入參數 code；

5、回調地址一般是一個 RESTful 接口，此接口拿到 code 參數后，再次請求認證服務器的 token 獲取接口，用來換取 access_token 等信息；

6、獲取到 access_token 后，拿着 token 去請求各個微服務客戶端的接口。

注意上面所說的用戶客戶端可以理解為瀏覽器、app 端，微服務客戶端就是我們系統中的例如訂單服務、用戶服務等微服務，認證服務端就是用來做認證授權的服務，相對於認證服務端來說，各個業務微服務也可以稱作是它的客戶端。

認證服務端配置

認證服務端繼續用上一篇文章的配置，代碼不需要任何改變，只需要在數據庫里加一條記錄，來支持新加的微服務客戶端的認證

我們要創建的客戶端的 client-id 為 code-client，client-secret 為 code-secret-8888，但是同樣需要加密，可以用如下代碼獲取：

System.out.println(new BCryptPasswordEncoder().encode("code-secret-8888"));

除了以上這兩個參數，要將 authorized_grant_types 設置為 authorization_code,refresh_token，web_server_redirect_uri 設置為回調地址，稍后微服務客戶端會創建這個接口。

然后將這條記錄組織好插入數據庫中。

INSERT INTO oauth_client_details
    (client_id, client_secret, scope, authorized_grant_types,
    web_server_redirect_uri, authorities, access_token_validity,
    refresh_token_validity, additional_information, autoapprove)
VALUES
    ('code-client', '$2a$10$jENDQZRtqqdr6sXGQK.L0OBADGIpyhtaRfaRDTeLKI76I/Ir1FDn6', 'all',
    'authorization_code,refresh_token', 'http://localhost:6102/client-authcode/login', null, 3600, 36000, null, true);

創建授權模式的微服務

引入 maven 包

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
    <groupId>org.springframework.cloud</groupId>
    <artifactId>spring-cloud-starter-oauth2</artifactId>
</dependency>
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-data-redis</artifactId>
</dependency>
<dependency>
    <groupId>io.jsonwebtoken</groupId>
    <artifactId>jjwt</artifactId>
    <version>0.9.1</version>
</dependency>
<dependency>
    <groupId>com.squareup.okhttp3</groupId>
    <artifactId>okhttp</artifactId>
    <version>3.14.2</version>
</dependency>
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

引入 okhttp 和 thymeleaf 是因為要做一個簡單的頁面並模擬正常的認證過程。

配置文件 application.yml

spring:
  application:
    name: client-authcode
server:
  port: 6102
  servlet:
    context-path: /client-authcode


security:
  oauth2:
    client:
      client-id: code-client
      client-secret: code-secret-8888
      user-authorization-uri: http://localhost:6001/oauth/authorize
      access-token-uri: http://localhost:6001/oauth/token
    resource:
      jwt:
        key-uri: http://localhost:6001/oauth/token_key
        key-value: dev
    authorization:
      check-token-access: http://localhost:6001/oauth/check_token

**創建 resourceConfig **

@Configuration
@EnableResourceServer
@EnableGlobalMethodSecurity(prePostEnabled = true)
public class ResourceServerConfig extends ResourceServerConfigurerAdapter {


    @Bean
    public TokenStore jwtTokenStore() {
        return new JwtTokenStore(jwtAccessTokenConverter());
    }

    @Bean
    public JwtAccessTokenConverter jwtAccessTokenConverter() {
        JwtAccessTokenConverter accessTokenConverter = new JwtAccessTokenConverter();

        accessTokenConverter.setSigningKey("dev");
        accessTokenConverter.setVerifierKey("dev");
        return accessTokenConverter;
    }

    @Autowired
    private TokenStore jwtTokenStore;

    @Override
    public void configure(ResourceServerSecurityConfigurer resources) throws Exception {
        resources.tokenStore(jwtTokenStore);
    }

    @Override
    public void configure(HttpSecurity http) throws Exception {
        http.authorizeRequests().antMatchers("/login").permitAll();
    }
}

使用 jwt 作為 token 的存儲，注意允許 /login 接口無授權訪問，這個地址是認證的回調地址，會返回 code 參數。

創建 application.java啟動類

@SpringBootApplication
public class Application {

    public static void main(String[] args) {
        SpringApplication.run(Application.class, args);
    }
}

到這步可以先停一下了。我們把認證服務端和剛剛創建的認證客戶端啟動起來，就可以手工測試一下了。回調接口不是還沒創建呢嗎，沒關系，我們權當那個地址現在就是為了接收 code 參數的。
1、在瀏覽器訪問 /oauth/authorize 授權接口，接口地址為：

http://localhost:6001/oauth/authorize?client_id=code-client&response_type=code&redirect_uri=http://localhost:6102/client-authcode/login 

注意 response_type 參數設置為 code，redirect_uri 設置為數據庫中插入的回調地址。

2、輸入上面地址后，會自動跳轉到認證服務端的登錄頁面，輸入用戶名、密碼，這里用戶名是 admin，密碼是 123456

3、點擊確定后，來到授權確認頁面，頁面上有 Authorize 和 Deny (授權和拒絕)兩個按鈕。可通過將 autoapprove 字段設置為 0 來取消此頁面的展示，默認直接同意授權。

4、點擊同意授權后，跳轉到了回調地址，雖然是 404 ，但是我們只是為了拿到 code 參數，注意地址后面的 code 參數。

5、拿到這個 code 參數是為了向認證服務器 /oauth/token 接口請求 access_token ，繼續用 REST Client 發送請求，同樣的，你也可以用 postman 等工具測試。

注意 grant_type 參數設置為 authorization_code，code 就是上一步回調地址中加上的，redirect_uri 仍然要帶上，回作為驗證條件，如果不帶或者與前面設置的不一致，會出現錯誤。

請求頭 Authorization ，仍然是 Basic + 空格 + base64(client_id:client_secret)，可以通過 https://www.sojson.com/base64.html 網站在線做 base64 編碼。

code-client:code-secret-8888 通過 base64 編碼后結果為 Y29kZS1jbGllbnQ6Y29kZS1zZWNyZXQtODg4OA==

POST http://localhost:6001/oauth/token?grant_type=authorization_code&client=code-client&code=BbCE34&redirect_uri=http://localhost:6102/client-authcode/login
Accept: */*
Cache-Control: no-cache
Authorization: Basic Y29kZS1jbGllbnQ6Y29kZS1zZWNyZXQtODg4OA==

發送請求后，返回的 json 內容如下：

{
  "access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX25hbWUiOiJhZG1pbiIsImp3dC1leHQiOiJKV1Qg5omp5bGV5L-h5oGvIiwic2NvcGUiOlsiYWxsIl0sImV4cCI6MTU3MjYwMTMzMiwiYXV0aG9yaXRpZXMiOlsiUk9MRV9BRE1JTiJdLCJqdGkiOiI2OWRmY2M4Yy1iZmZiLTRiNDItYTZhZi1hN2IzZWUyZjI1ZTMiLCJjbGllbnRfaWQiOiJjb2RlLWNsaWVudCJ9.WlgGnBkNdg2PwKqjbZWo6QmUmq0QluZLgIWJXaZahSU",
  "token_type": "bearer",
  "refresh_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX25hbWUiOiJhZG1pbiIsImp3dC1leHQiOiJKV1Qg5omp5bGV5L-h5oGvIiwic2NvcGUiOlsiYWxsIl0sImF0aSI6IjY5ZGZjYzhjLWJmZmItNGI0Mi1hNmFmLWE3YjNlZTJmMjVlMyIsImV4cCI6MTU3MjYzMzczMiwiYXV0aG9yaXRpZXMiOlsiUk9MRV9BRE1JTiJdLCJqdGkiOiJkNzk2OWRhMS04NTg4LTQ2YzMtYjdlNS1jMGM5NzcxNTM5Y2YiLCJjbGllbnRfaWQiOiJjb2RlLWNsaWVudCJ9.TEz0pQOhST9-ozdoJWm6cf1SoWvPC6W-5JW9yjZJXek",
  "expires_in": 3599,
  "scope": "all",
  "jwt-ext": "JWT 擴展信息",
  "jti": "69dfcc8c-bffb-4b42-a6af-a7b3ee2f25e3"
}

和上一篇文章 password 模式拿到的 token 內容是一致的，接下來的請求都需要帶上 access_token 。

6、把獲取到的 access_token 代入到下面的請求中 ${access_token} 的位置，就可以請求微服務中的需要授權訪問的接口了。

GET http://localhost:6102/client-authcode/get
Accept: */*
Cache-Control: no-cache
Authorization: bearer ${access_token}

接口內容如下：

@org.springframework.web.bind.annotation.ResponseBody
@GetMapping(value = "get")
@PreAuthorize("hasAnyRole('ROLE_ADMIN')")
public Object get(Authentication authentication)
{
    //Authentication authentication = SecurityContextHolder.getContext().getAuthentication();
    authentication.getCredentials();
    OAuth2AuthenticationDetails details = (OAuth2AuthenticationDetails) authentication.getDetails();
    String token = details.getTokenValue();
    return token;
}

經過以上的手工測試，證明此過程是通的，但是還沒有達到自動化。如果你集成過微信登錄，那你一定知道我們在回調地址中做了什么，拿到返回的 code 參數去 token 接口換取 access_token 對不對，沒錯，思路都是一樣的，我們的回調接口中同樣要拿 code 去換取 access_token。

為此，我做了一個簡單的頁面，並且在回調接口中請求獲取 token 的接口。

創建簡單的登錄頁面

在 resources 目錄下創建 templates 目錄，用來存放 thymeleaf 的模板，不做樣式，只做最簡單的演示，創建 index.html 模板，內容如下：

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>古時的風箏-OAuth2 Client</title>
</head>
<body>
<div>
    <a href="http://localhost:6001/oauth/authorize?client_id=code-client&response_type=code&redirect_uri=http://localhost:6102/client-authcode/login">登錄</a>
    <span th:text="'當前認證用戶：' + ${username}"></span>
    <span th:text="${accessToken}"></span>
</div>
</body>
</html>

回調接口及其他接口

@Slf4j
@Controller
public class CodeClientController {

    /**
     * 用來展示index.html 模板
     * @return
     */  	
    @GetMapping(value = "index")
    public String index(){
        return "index";
    }

    @GetMapping(value = "login")
    public Object login(String code,Model model) {
        String tokenUrl = "http://localhost:6001/oauth/token";
        OkHttpClient httpClient = new OkHttpClient();
        RequestBody body = new FormBody.Builder()
                .add("grant_type", "authorization_code")
                .add("client", "code-client")
                .add("redirect_uri","http://localhost:6102/client-authcode/login")
                .add("code", code)
                .build();

        Request request = new Request.Builder()
                .url(tokenUrl)
                .post(body)
                .addHeader("Authorization", "Basic Y29kZS1jbGllbnQ6Y29kZS1zZWNyZXQtODg4OA==")
                .build();
        try {
            Response response = httpClient.newCall(request).execute();
            String result = response.body().string();
            ObjectMapper objectMapper = new ObjectMapper();
            Map tokenMap = objectMapper.readValue(result,Map.class);
            String accessToken = tokenMap.get("access_token").toString();
            Claims claims = Jwts.parser()
                    .setSigningKey("dev".getBytes(StandardCharsets.UTF_8))
                    .parseClaimsJws(accessToken)
                    .getBody();
            String userName = claims.get("user_name").toString();
            model.addAttribute("username", userName);
            model.addAttribute("accessToken", result);
            return "index";
        } catch (Exception e) {
            e.printStackTrace();
        }
        return null;
    }


    @org.springframework.web.bind.annotation.ResponseBody
    @GetMapping(value = "get")
    @PreAuthorize("hasAnyRole('ROLE_ADMIN')")
    public Object get(Authentication authentication) {
        //Authentication authentication = SecurityContextHolder.getContext().getAuthentication();
        authentication.getCredentials();
        OAuth2AuthenticationDetails details = (OAuth2AuthenticationDetails) authentication.getDetails();
        String token = details.getTokenValue();
        return token;
    }
}

其中 index() 方法是為了展示 thymeleaf 模板，login 方法就是回調接口，這里用了 okhttp3 用作接口請求，請求認證服務端的 /oauth/token 接口來換取 access_token，只是把我們手工測試的步驟自動化了。

訪問 index.html 頁面

我們假設這個頁面就是一個網站的首頁，未登錄的用戶會在網站上看到登錄按鈕，我們訪問這個頁面：http://localhost:6102/client-authcode/index，看到的頁面是這樣的

接下來，點擊登錄按鈕，通過上面的模板代碼看出，點擊后其實就是跳轉到了我們手工測試第一步訪問的那個地址，之后的操作和上面手工測試的是一致的，輸入用戶名密碼、點擊同意授權。

接下來，頁面跳轉回回調地址<http://localhost:6102/client-authcode/login?code=xxx 的時候，login 方法拿到 code 參數，開始構造 post 請求體，並把 Authorization 加入請求頭，然后請求 oauth/token 接口，最后將拿到的 token 和 通過 token 解析后的 username 返回給前端，最后呈現的效果如下：

最后，拿到 token 后的客戶端，就可以將 token 加入到請求頭后，去訪問需要授權的接口了。

結合上一篇文章，我們就實現了 password 和 授權碼兩種模式的 oauth2 認證。

本篇源碼微服務客戶端對應的源碼地址為: 點擊查看 github 源碼

相關閱讀

Spring Cloud OAuth2 實現單點登錄

不要吝惜你的「推薦」呦

歡迎關注，不定期更新本系列和其他文章
古時的風箏 ，進入公眾號可以加入交流群