Spring Boot整合OAuth2實現GitHub第三方登錄

Github OAuth 第三方登錄示例

1、第三方登錄原理

第三方登錄的原理是借助OAuth授權來實現，首先用戶先向客戶端提供第三方網站的數據證明自己的身份獲取授權碼，然后客戶端拿著授權碼與授權服務器建立連接獲得一個Access Token，之后客戶端就可以通過Access Token來與資源服務器進行交互。

使用OAuth的好處是提供給用戶一個特定的密鑰，用戶持有這個密鑰可以訪問應用中的任何信息，而不需要向網站提供用戶名&密碼，可以實現跨系統共享用戶授權協議。

通過控制用戶持有的密鑰，可以很方便的控制用戶可以訪問的資源，以及控制密鑰的過期時間。

以下是來自維基百科對于OAuth的介紹

開放授權（OAuth）是一個開放標準，允許用戶讓第三方應用訪問該用戶在某一網站上存儲的私密的資源（如照片，視頻，聯系人列表），而無需將用戶名和密碼提供給第三方應用。

OAuth允許用戶提供一個令牌，而不是用戶名和密碼來訪問他們存放在特定服務提供者的數據。每一個令牌授權一個特定的網站（例如，視頻編輯網站)在特定的時段（例如，接下來的2小時內）內訪問特定的資源（例如僅僅是某一相冊中的視頻）。這樣，OAuth讓用戶可以授權第三方網站訪問他們存儲在另外服務提供者的某些特定信息，而非所有內容。

OAuth是OpenID的一個補充，但是完全不同的服務。

交互流程如下：

2、GitHub實現第三方登錄

首先需要在github中對應用進行登記，讓Github知道誰在發送請求。

訪問這個網址，填寫登記表

提交成功之后，GitHub會返回Client ID & Client Secrets ，這是應用的身份識別碼

創建一個SpringBoot工程，pom.xml文件內容如下：

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.7.17</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>org.pp</groupId>
    <artifactId>springboot-oauth2-api</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>springboot-oauth2-api</name>
    <description>springboot整合oauth2，實現GitHub第三方登錄</description>
    <properties>
        <java.version>1.8</java.version>
    </properties>
    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <configuration>
                    <excludes>
                        <exclude>
                            <groupId>org.projectlombok</groupId>
                            <artifactId>lombok</artifactId>
                        </exclude>
                    </excludes>
                </configuration>
            </plugin>
        </plugins>
    </build>

</project>

將ID和密鑰添加到配置文件application.yml中：

# 項目端口號
server:
  port: 8080
#  GitHub認證相關參數
github:
    client:
      id: xxx
      secret: xxx

創建一個實體類，用于映射授權成功產生的Token令牌：

import com.fasterxml.jackson.annotation.JsonProperty;
/**
 *
 * Token令牌 - 響應參數
 *
 * @author supanpan
 * @date 2023/10/25
 */
public class AccessTokenResponse {

    @JsonProperty("access_token")
    private String accessToken;

    public String getAccessToken() {
        return accessToken;
    }

    public void setAccessToken(String accessToken) {
        this.accessToken = accessToken;
    }
}

OAuthController如下：

**
 * @author supanpan
 * @date 2023/10/25
 */
@Controller
public class OAuthController {

    @Value("${github.client.id}")
    private String clientId;

    @Value("${github.client.secret}")
    private String clientSecret;

    @GetMapping("/oauth/redirect")
    public String handleRedirect(@RequestParam("code") String requestToken, Model model) {
        // 使用RestTemplate來發送HTTP請求
        RestTemplate restTemplate = new RestTemplate();

        // 獲取Token的Url
        String tokenUrl = "https://github.com/login/oauth/access_token" +
                "?client_id=" + clientId +
                "&client_secret=" + clientSecret +
                "&code=" + requestToken;

        // 使用restTemplate向GitHub發送請求，獲取Token
        AccessTokenResponse tokenResponse = restTemplate.postForObject(tokenUrl, null, AccessTokenResponse.class);

        // 從響應體中獲取Token數據
        String accessToken = tokenResponse.getAccessToken();

        // 攜帶Token向GitHub發送請求
        String apiUrl = "https://api.github.com/user";
        HttpHeaders headers = new HttpHeaders();
        headers.set("Authorization", "token " + accessToken);
        HttpEntity<String> entity = new HttpEntity<>("parameters", headers);
        ResponseEntity<String> response = restTemplate.exchange(apiUrl, HttpMethod.GET, entity, String.class);
        model.addAttribute("userData", response.getBody());

        return "welcome";
    }
}

SpringBoot啟動器

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class SpringbootOauth2ApiApplication {

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

}

還需要編寫兩個html頁面，index.html和welcome.html

index.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>OAuth2 Demo</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body>
<a id="login">Login with GitHub</a>

<script>
    const client_id = 'xxxx';

    const authorize_uri = 'https://github.com/login/oauth/authorize';
    const redirect_uri = 'http://localhost:8080/oauth/redirect';

    const link = document.getElementById('login');
    link.href = `${authorize_uri}?client_id=${client_id}&redirect_uri=${redirect_uri}`;
</script>

</body>

</html>

welcome.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Hello</title>
</head>

<body>
    <h1>Welcome</h1>
    <div th:text="${userData}"></div>
</body>

</html>

啟動項目，瀏覽器訪問localhost:8080，會跳轉到index頁面，點擊鏈接會跳轉到GitHub應用授權頁面

點擊跳轉到GitHub授權之后，GitHub會詢問示例代碼正在請求數據，您是否同意授權。

用戶同意授權， GitHub 就會跳轉到redirect_uri指定的跳轉網址，并且帶上授權碼，跳轉回來的 URL 就是下面的樣子

// code參數就是授權碼
http://localhost:8080/oauth/redirect?code:4ea423f2ec1e04c6376a

如下是服務的響應數據：

access token: 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
{
  login: 'AtwoodPa',
  id: 110728122,
  node_id: 'U_kgDOBpmTug',
  avatar_url: 'https://avatars.githubusercontent.com/u/110728122?v=4',
  gravatar_id: '',
  url: 'https://api.github.com/users/AtwoodPa',
  html_url: 'https://github.com/AtwoodPa',
  followers_url: 'https://api.github.com/users/AtwoodPa/followers',
  following_url: 'https://api.github.com/users/AtwoodPa/following{/other_user}',
  gists_url: 'https://api.github.com/users/AtwoodPa/gists{/gist_id}',
  starred_url: 'https://api.github.com/users/AtwoodPa/starred{/owner}{/repo}',
  subscriptions_url: 'https://api.github.com/users/AtwoodPa/subscriptions',
  organizations_url: 'https://api.github.com/users/AtwoodPa/orgs',
  repos_url: 'https://api.github.com/users/AtwoodPa/repos',
  events_url: 'https://api.github.com/users/AtwoodPa/events{/privacy}',
  received_events_url: 'https://api.github.com/users/AtwoodPa/received_events',
  type: 'User',
  site_admin: false,
  name: null,
  company: null,
  blog: '',
  location: null,
  email: null,
  hireable: null,
  bio: null,
  twitter_username: null,
  public_repos: 6,
  public_gists: 0,
  followers: 0,
  following: 3,
  created_at: '2022-08-06T13:02:16Z',
  updated_at: '2023-09-03T00:15:55Z'
}
authorization code: 4ea423f2ec1e04c6376a

成功執行上述流程，最終展示示例的welcome頁面

到這里，Spring Boot整合GitHub實現第三方登錄的實現就結束了，以此類推其他廠商的第三方登錄實現流程也大概是這樣。

posted on 2023-10-25 18:45 JavaCoderPan 閱讀(1126) 評論(0) 收藏舉報

刷新頁面返回頂部

atwood-pan

Spring Boot整合OAuth2實現GitHub第三方登錄

1、第三方登錄原理

2、GitHub實現第三方登錄

導航

公告