2019. 11. 12. 15:30

전 글에서 'IdentityServer'를 이용하여 인증 서버를 만들었습니다.

이 글에서는 인증 서버에서 받은 엑세스키를 이용하여 WebAPI에 접근해 보겠습니다.




코드 프로젝트의 글을 .Net Core 2.2로 포팅한 포스팅입니다.

전 포스팅과 다르게.....이글은 버전이 올라가면서 바뀐 내용이 많아서 사실상 딴 코드가 되었다는게 함정이죠 ㅎㅎㅎㅎ

(참고 : code project - Livio Francescucci님의 글 ASP.NET Core WebAPI secured using OAuth2 Client Credentials )



1. 프로젝트 세팅
새 프로젝트를 만듭니다.

프로젝트는 생성 옵션은

닷넷 코어 2.2

웹 응용프로그램

빈 프로젝트

입니다.


1-1. html 세팅
빈 프로젝트는 아무것도 없기 때문에 html을 읽을 수 있도록 세팅합니다.

참고 : [ASP.NET Core] 빈 프로젝트 세팅 (1) - 'index.html'을 시작페이지로 설정하기


html은 바디에 안내만 넣습니다.

이 서버의 html은 웹서버가 동작하고 있는지 확인하게 됩니다.


여기에 'JQuery'를 추가하여 토큰을 요청하고 사용하는 코드를 추가합니다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
 
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"
            integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
            crossorigin="anonymous"></script>
 
    <script>
        var access_token = "";
 
        /**
         * 토큰 요청
         */
        function CallToken() {
            $.ajax({
                type: "POST"
                , url: "http://localhost:1207/connect/token"
                , dataType: "json"
                , data: {
                    "grant_type""client_credentials"
                    , "client_id""ClientIdThatCanOnlyRead"
                    , "client_secret""secret1"
                    , "scope""scope.readaccess"
                }
                , success: function (result) {
                    console.log(result);
                    access_token = result.access_token;
                }
            });
 
        }
 
        /**
         * API 호출
         */
        function CallValues()
        {
            $.ajax({
                type: "GET"
                
                , url: "https://localhost:44341/api/values"
                , headers: {
                    "authorization""Bearer " + access_token
                }
                , dataType: "json"
                , data: {
                }
                
                , success: function (result) {
                    console.log(result);
                }
            });
        }
    </script>
</head>
<body>
    API 호출만 가능합니다.
</body>
</html>
cs



1-2. 'WebAPI' 설정
'WebAPI'도 설정해 줍니다

참고 : [ASP.NET Core 2] 빈 프로젝트 세팅 (2) - 'WebAPI' 설정



2. 'IdentityServer4.AccessTokenValidation' 설치

누겟에서 'IdentityServer4.AccessTokenValidation' 찾아 설치합니다.

우리는 Core 2.2 가 기준이라 2.x 버전을 설치해야 합니다.




3. 컨트롤러(Controller) 만들기

이 프로젝트는 'WebAPI'역할을 하므로 컨트롤러가 필요합니다.

프로젝트를 'WebAPI'로 설정하였다면 'ValuesController'가 자동으로 생성됩니다.

이번 챕터에서는 이 컨트롤러를 만듭니다.


'Controllers'폴더를 만들고 'ValuesController'를 추가합니다.




코드는 아래와 같습니다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
[Route("api/[controller]")]
[ApiController]
public class ValuesController : ControllerBase
{
    // GET api/values
    [HttpGet]
    public ActionResult<IEnumerable<string>> Get()
    {
        return new string[] { "value1""value2" };
    }
 
    // GET api/values/5
    [HttpGet("{id}")]
    public ActionResult<string> Get(int id)
    {
        return "value";
    }
 
    // POST api/values
    [HttpPost]
    public void Post([FromBody] string value)
    {
    }
 
    // PUT api/values/5
    [HttpPut("{id}")]
    public void Put(int id, [FromBody] string value)
    {
    }
 
    // DELETE api/values/5
    [HttpDelete("{id}")]
    public void Delete(int id)
    {
    }
}
cs



4. 'IdentityServer' 미들웨어 기능 활성화

인증 기능을 미들웨어로 넘기기 위해 'Startup.cs'를 수정해야 합니다.

'ConfigureServices' 함수에 코드를 추가합니다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
//인증 요청 정보
services.AddAuthentication(options =>
{
    options.DefaultAuthenticateScheme = JwtBearerDefaults.AuthenticationScheme;
    options.DefaultChallengeScheme = JwtBearerDefaults.AuthenticationScheme;
}).AddJwtBearer(o => 
{
    o.Audience = "apiApp";
 
    //인증서버의 주소
    o.Authority = "http://localhost:1207";
    o.RequireHttpsMetadata = false;
    //인증서버에서 선언한 권한
    o.Audience = "scope.readaccess";
});
cs



여기서 인증서버의 주소는 전 포스팅에서 만든 서버의 주소입니다.

(참고 : [ASP.NET Core 2] OAuth2 인증에서 사용까지 (1) - 'IdentityServer'를 이용하여 'OAuth2' 인증 서버 구현 )


다음 코드를 'Configure'의 맨 앞에 아래 코드를 추가합니다.


1
2
3
4
//인증 요청
app.UseAuthentication();
//에러가 났을때 Http 상태코드를 전달하기위한 설정
app.UseStatusCodePages();
cs



5. 테스트

일단 'ValuesController'가 동작하는지 확인해야 하므로 그냥 실행합니다.

자바스크립트에 함수를 만들어 놨으므로 'CallValues()'를 콜해봅니다.




값이 잘 리턴됩니다.


이제 'ValuesController'로 가서 클래스 위에 '[Authorize]'를 추가하여 필터를 설정합니다.




'CallValues()'를 다시 호출해봅시다.




정상적으로 '401' 에러가 납니다.


'CallToken()'을 호출하여 엑세스 토큰(Access Token)을 받고

'CallValues()'를 호출하면 정상적으로 값을 받을 수 있습니다.




값이 잘 나옵니다.


마무리

완성된 샘플 : Github - OAuth2Sample/OAuth2Sample/ProtectedWebAPI/


이 포스팅에는 리플레시토큰(refresh tokens)을 사용하지 않고 있습니다.

다른 포스팅에서 다루도록 하죠.


댓글 작성

이름
패스워드
홈페이지
비밀글