Magritte 기술블로그

벼락치기로 공부했던 SQLD에 대한 생각을 짧게나마 남기려 합니다.

1. 생각보다 몇가지 개념이 반복적으로 나온다. 즉 범위가 넓은 시험이 아니라는 것.

    공부했던것들만 제대로 보면은 합격을 할수가 있을듯하다.(난 해당 사항 아님)

2. 노랭이와 SQL 개발자 과외노트라는 책 두권을 봤는데, 노랭이에는 너무 어려운 문제가 많아서 쫄았는데 실제 시험 난이도는 그정도까지는 아님.(그렇다고 내가 잘했다는 것은 아님)

3. 만약 떨어져서 다시 시험을 보게된다면, 실제로 함수들이나 sql구문들을 mysql로 쳐보면서 해볼듯.

4. 여러가지 DB들에 대한 시험문제가 나오는데...ms-sql , oracle등등... 이것들에 대해서 다 제대로 알아야 되나 싶음

5. 그래도 sql 기본적인 이해를 목표로 진행했던터라 잘했다고 생각이 든다.

6. 만약 sqld 시험을 준비하시는 분들이라면, 전 3일전부터 공부했는데, 노베이스 2주간 하루 3시간씩 공부하면 충분히 합격 가능할듯 합니다.

7. 화이팅!

해당글은 개인적인 공부 리뷰용입니다.

생활코딩의 OAuth강의를 정리했다고 보시는게 가장 정확합니다

=======================

왜 OAuth2.0을 공부해야 하냐고 물어보면은...

소셜로그인을 구현을 하고 싶어서다

내 사이트가 너무나 거대해져서, 나만의 로그인 시스템을 제공해줄수 있는 상황이 아니라면,

아무래도 나의 조그마한 사이트에서는 구글이나 페이스북, 네이버가 제공을 해주는 OAuth 로그인을 사용을 할 것이다.

그렇기 때문에 나에게는  OAuth가 필요하다

전반적인 나의 스펙을 살펴보면은

fastapi+ nextjs로 사이트를 구성을 하고, 거기에다 네이버 로그인을 붙일 예정이다.

해당 여정은 위에 대한 것들을 나타내는 것을 그 골자로 한다.

먼저 OAuth에 대해서 알아보고 가자.

==============================

OAuth는 3자대면 작업이다.

슈퍼K라는 나의 사이트가 있다고 가정하자.

그 사이트에서는 네이버 로그인을 사용을 해서 사용자인증을 진행한다.(federate identity)

그리고 우리 사이트를 이용하는 유저들도 존재한다.

OAuth 에서는

 슈퍼K라는 우리 사이트를 Client라고 (Resource Server 에게 자원을 요구하는 손님이라는 뜻)

네이버 를 Resource Server(or Authorization Server)라고 부른다.

(우리가 사용하고자 하는 자원(로그인자원)을 가지고 있다고 해서)

우리사이트 유저를 Resource Owner라고 한다.(리소스를 소유한 주인이라고 해서)

---------------

등록(register)

맨처음에 우리가 OAuth를 사용하기 위해서는 등록을 진행을 먼저 해야한다.

흔히들 아래와 같은 정보를 얻기 위한 과정인데,

이는 흔히 OAuth를 구현하려는 사이트에서 얻기 쉬운 부분이다

네이버 로그인에서는 아래에 들어가면 등록과정을 진행을 할 수가 있다

https://developers.naver.com/main/

각 항목을 작성을 하고 나면은

네이버에서 Client ID 와 Client Secret를 제공해준다.

ClientID는 외부에 공개가 되어도 괜찮으나,

Client Secret은 외부에 공개가 되면 곤란하다...

그리고 Authorized redirect URIs는 우리가 지정을 해주는 것인데,

네이버가 우리에게 Authorized code를 전달해주는 과정이 있는데,

그 코드를 우리가 지정한 Authorized redirect URI로 전달을 해준다.

이 부분을 기억을 해두고, 추후에 나오는 부분에서 연관되어 생각을 해보자.

====================

Resource Owner의 승인

현재까지 우리가 알고있는 것은 아래의 그림과 같다.

나의 사이트와 네이버는 

Client ID와 Client Secret, 그리고 redirect URL을 알고 있는 상황이다.

우리는 네이버의 로그인기능만 필요하다. 딱 그 기능만 허락을 받으면 되는 상황이다.

우리 우리사이트 이용자(Resource Owner)가 등장하는 차례이다.

등장은 어떻게 하냐???

이렇게는 아니고 ㅋㅋㅋㅋㅋ

우리는 우리나름의 방식으로 등장을 한다

네이버는 네이버 방식으로 등장을 하면된다

버튼으로 등장 그리고 그 버튼에는 링크가 달려있는데,

http://resource.server?client_id=1&scope=B,C&redirect_uri=https://client/callback 

이라는 링크로 가게끔 해주면 된다

링크로 가면은 

네이버(Resource Server)는 우리사이트 사용자(Resource owner)에게 권한을 요청한다.

아래와 같은 화면으로 흔히들 봤겠지요?ㅎㅎㅎㅎ

=====================

Resource Server의 승인

여기까지의 상황은 다음의 그림에서 나타난다.

네이버(Resource Server) 는 우리 사이트에 들어온 유저(Resource Owner)가 권한을 요청하였고,

로그인 권한(여기서는 scope:b,c)를 허락해주었다 라는 것까지가 현재 단계이다.

이제 여기서 네이버는 authorization code라는 것을 발급해서,

그것을 우리사이트 유저(Resource Owner)에게 전달을 해준다...

그런데 그냥 전달해주는것이 아니라,

Location Header에 넣어서 전달을 해주기때문에,

우리 사이트 유저(Resource Owner)는 https://client/callback?code=3이라는 곳으로 

자기도 모르는 사이에 redirect 되게끔 된다......

그렇게 리다이렉트 되는 주소가 어디????

바로 우리가 처음에 authorized redirect uri 라고 써져있는 곳으로

쿼리스트링에 authorization 코드가 들어가진체로 전달이 된다...

그러면 우리(client,슈퍼K 사이트 서버)는 

사이트 이용자(Resource Owner)를 통해서 authorization code를 알게되었다

이렇게되면은

네이버와 우리사이트 사용자 사이에 은밀한하게 전달된 내용인 (Authorization code)를

우리(슈퍼K 사이트 운영서버)도 알게되었다...ㅎㅎㅎ

너네가 알고 있는것을 나도 알게 되었으니,

나도 믿을수 있는 녀석이다!!! 라는 것을 이제 네이버에게 다시 알려줘야 하는데,

그렇게 하기 위해서는 

우리는 다시 네이버 서버로 아래와 같은 요청을 보내면 된다.

https://resource.server/token?grant_type=authorization_code&code=3&redirect_uri=https://client/callback&client_id=1&client_secret=2

여기서 우리가 주의깊게 봐야하는 부분은 

빨간색으로 강조한 code 부분과 client_secret이다.

code가 3이라는 것은 우리 사이트 유저인 resource owner랑 우리사이트(슈퍼k)가 제대로 믿을수 있는 사이라는 것이고,

client_secret은 우리가 제일처음에 네이버 사이트에 등록하고 받은 비밀서약인데,

그 두개의 정보와 redirect_uri를 통해서, 

우리사이트 + 네이버 + 우리사이트 유저 , 이렇게 3자간은 믿을수 있는 동맹관계라는 것을 제대로 알려주는 것이다.

이제 이렇게 신원이 확실하게 되면은 

네이버는 우리에게 액세스 토큰을 발급해주는것이다.

이제 우리도 nextjs에랑  fastapi로 로그인 기능을 구현을 해보자!!!!!!!!!!

nextjs 에는 next-auth.js라는 좋은 라이브러리도 있지만,,,

나같이 서버는 다르게 이용하고자 하는 사람에게는 사용이 가능한지는 알아보지는 않았다.

그런데 next-auth로 구현을 했을때에는 

내가 밑바닥부터 해당 로그인을 구현했다는 느낌이 전혀없었다....

그냥 라이브러리를 사용만 한다는 느낌.

그래서 한번은 밑에서부터 만들어봐야 된다는 생각이었다.

내가 좋아하는 스택으로 만들기를 시작할련다

NextJS에서 로그인 버튼 만들기

먼저 새로운 nextjs 프로젝트를 생성을 해보자.

초기세팅값은 아래와 같이 선택을 하였다.

아래가 무슨 말인지 모르겠으면,,,,nextjs 기초부터 공부하고 오시길 바랍니다.

npx create-next-app@latest --experimental-app

global.css,page.module.css 전부 깨끗하게 지우고 시작을 합니다.

page.js는 div박스와 버튼을 만들어 놔두었습니다.

그리고 버튼을 눌렀을때에 필요한 링크를 적용해줍니다.

아래와 같이 적용을 해보았습니다.

'use client'

import React from "react";
export default function Naver() {
  let request_url = "https://nid.naver.com/oauth2.0/authorize?response_type=code&client_id={네이버에서 발급받은 클라이언트id}&redirect_uri=http://localhost:3000/callback"

  return (
    <div>
      <h1>My Page</h1>
      <button>
        <a href={request_url}>네이버 로그인</a>
      </button>
    </div>
  );
}

딱 아래와 같은 상황입니다. 버튼을 누르면 https://resource.server?client_id=1&scope=B,C&redirect_uri=https://client/callback 이라는 곳으로 보내주는것을 위에서는 request_url안에 담아 보았습니다.

아래와 같은 next.js로 만든 페이지에서

버튼을 눌러봅니다.

callback페이지도 next.js에다 만들어줬습니다...

localhost:3000/callback 으로 요청하면, 해당 페이지가 나오게 만들어주시면 됩니다.

이정도는 할 줄 아시져??

그랬더니 해당 url에 쿼리스티링으로 code가 같이 딸려옵니다!!!!!

어때요??ㅎㅎ

차근차근 딱딱 되어가는것이 느껴집니다

그리고 이렇게 callback받은 code를 포함하여,

다시 access_token을 요청을 하는 url을 만들어서 네이버서버로 보내주면, 딱 완성이 되겠지요?

자..

이제 fastapi 서버를 이용해서 한번 진행을 해보도록 합시다!

callback서버를 http://localhost:8080/callback으로 진행을 하고 우리가 원하는 정보를 가져와봅도록 합시다

fast api로 다음과 같이 api를 만들었습니다.

@app.get("/callback")
async def callback(code):

    client_id = "발급받은 client_id"
    client_secret = "발급받은 client_secret"
    redirect_uri = "http://localhost:8080/callback"

    token_request = requests.get(f"https://nid.naver.com/oauth2.0/token?grant_type=authorization_code&client_id={client_id}&client_secret={client_secret}&code={code}")
    token_json = token_request.json()
    print(token_json)

    access_token = token_json.get("access_token")
    profile_request = requests.get("https://openapi.naver.com/v1/nid/me", headers={"Authorization" : f"Bearer {access_token}"},)
    profile_data = profile_request.json()

    print(profile_data)
    return RedirectResponse('http://localhost:3000/callback')

그리고 나서 우리가 처음에 만들었던 네이버로그인 버튼의 callback uri를 fastapi의 callback 앤드포인트로 바꿔줍니다.

fastapi서버에서 로그인된 아이디의 profile 데이터를 가지고 와준다.

이것으로 데이터 가져오기 끝!!!!

로그인 세부적인 사항들은 각 프로젝트에 따라 구현을 해보면되겠다

아래는 네이버 로그인 SDK에 관한 내용들이다.

필요하신 분들은 한번 참고하시면 좋겠다.

네이버 로그인 SDK를 사용하기

네이버 로그인 개발문서는 다음의 링크에 있습니다.

https://developers.naver.com/docs/login/devguide/devguide.md#1--개요

네이버 로그인 버튼을 넣고싶은 페이지에 아래와 같이 코드를 작성을 해준다.

무슨 이유에서인지 layout.js에 head에 스크립트를 추가하려고 하니깐,

window.naver객체를 읽어들이지 못하더라....

그런데 해당 페이지에 진행을 하니깐 제대로 되네.... 왜 그런걸까???

'use client'


import React, { useState, useEffect } from "react";

export default function Home() {

  useEffect(() => {
    initNaverLogin();
    getData();
  }, []);
  // console.log(window);
  const getData = (r) => {
    console.log(r);
    if (window.location.href.includes("access_token")) {
      console.log("We got AccessToken");
    }
  };
  const initNaverLogin = () => {

    const naverLogin = new window.naver.LoginWithNaverId({
      clientId: "네이버에서 발급해준 Client Id",
      callbackUrl: "http://localhost:8080/callback",
      isPopup: false,
      loginButton: { color: "green", type: 3, height: 60 },
      callbackHandle: true,
    });

    naverLogin.init();
    getData();
  }

  return (
    <div>
      <script
        defer
        type="text/javascript"
        src="https://static.nid.naver.com/js/naveridlogin_js_sdk_2.0.2.js"
      />
      <div id="naverIdLogin" />
    </div>
  );
}

이터레이터(Iterator)가 무엇인가?

파이썬을 사용하다보면은 흔히 만나는 예제가 있다

for i in range(0,10):
	print(i)

위와 같이 range 를 사용해서 값을 하나씩 가져다 오는 구문인데,

이는 파이썬 내부적으로 iterator를 만들어서 하나씩 호출하는 구조를 가진다

그렇기에 파이썬을 조금 더 파이썬 답게 사용하기 위해서는 이터레이터에 대해서 알아두면

간지가 조금 더 있어보일것이다 (pythonic하게)

이터레이터(Iterator)의 구조 

일단은 iterator (이터레이터)의 구조를 살펴보자

list1 = ["안녕","Hello","니하오"]

이러한 리스트가 있고,

for x in list1 :

    print(x)

이 리스타가 for문에서 어떻게 작동하냐면 내부적으로는 next(list1) 이라는 함수로 계속 다음번의 원소를 호출하는 구조를 가진다. 그리고 다음번 원소가 없을때에는 StopIteration이라는 예외가 발생하면서 for문이 종료를 시켜준다.

클래스로 이터레이터(Iterator) 만들기 

내가 직접 이터레이터를 만들기 위해서는 클래스로 구현을 하여야 한다

클래스에다 __init__()메서드 구현, __iter__() 메서드 구현, __next__()구현 을 하면 해당 클래스를 이터레이터로 사용을 할수가 있다

우리가 자주쓰는 Range 함수를 직접 클래스로 만들어서 사용을 해보자

아래와 같이 구현을 하게되면 Range를 사용하지 않아도 우리가 만든 MyRange 클래스로 사용이 가능하다

class MyRange():
    def __init__(self, begin, stop):
        self.current = begin
        self.stop = stop

    def __iter__(self):
        return self

    def __next__(self):
        if self.current < self.stop:
            temp = self.current
            self.current += 1
            return temp
        else:
            raise StopIteration
        

for i in MyRange(1, 5):
    print(i, end=" ")

기존 클래스를 구현하는데에다

__iter__메서드와 __next__메서드를 추가적으로 구현한다고 생각하면 간단하다

프로그래머는 하드웨어를 도구로 프로그래밍을 하는 직업이다

그렇기에 코드와 하드웨어와의 대화를 잘 하게끔 코드를 짜야한다

구체적으로 하드웨어라는 것은 CPU, 메모리, 보조디스크, 다른 PC 등으로 나눠질수 있다

이것을 자료구조와 알고리즘이라는 단어로 설명을 하고

전문적으로는 성능 측정등을 하는 이유가 이것에 있다

또한 프로그래머는 혼자서 산출해내는 아웃풋이 한계가 있기에

다른 프로그래머와 협업을 한다

그러면 다른 사람이 쓴 코드를 잘 해석하고, 잘 조합하는 것도 능력이고

내가 쓴 코드가 다른 사람에게 어떻게 보여지는지도 무척이나 중요하다

그리고 프로그래밍 분야의 발전속도는 기하급수적이다

한달, 한달 새로운 지식이 생겨나가고 있다. 

과거의 나와 미래의 나 자신에게 코드로 대화를 해야되기 때문에

문서화에 대한 이슈도 중요하다

async io의 단어적 뜻은 Asynchronous IO 라는 단어적 뜻을 가지고 있다

동시성으로 여러개의  비동기 IO-Bound 작업들을 관리하는 것을 그 목적으로 가진다

AsyncIO를 사용하기 위해서는 기본적인 키워드 2개에 대해서 알고 있어야 한다

async, await 가 바로 그 두개의 키워디 인데,

함수 앞에 async 를 붙이게 되면, 해당 함수가 코루틴 객체로 바뀌면서 async io에서 사용이 가능하다

그리고 await 키워드는 뒤에 특정 작업 ( awaitable 속성을 가진 객체) 을 넣어주면 실행이 가능한 상황이다.

import asyncio

async def test_task():
    print("Hello World!")
    await asyncio.sleep(2)
    
    print("end")
    return "OKAY"
    


async def main():
    task1 = asyncio.create_task(test_task())
    task2 = asyncio.create_task(test_task())
    
    result = await asyncio.gather(task1, task2)


if __name__ == "__main__":
	await main()

async 키워드가 붙지 않는 함수에서도 asyncio를 사용하고 싶을 순간이 있을것이다.

그럴때는 쓰레드를 이용해서 asyncio를 구현을 하면 가능해진다

import asyncio
import time
import threading

lock = threading.Lock()


def block_task(task):
    with Lock:
        print(task, "Hello")
    
    time.sleep(1)
    
    with Lock:
        print(task,"World")
    return "OK"


async def main():
    loop = asyncio.get_running_loop()
    
    r1 = loop.run_in_executor(None, blocked_task, "Task1")
    r2 = loop.run_in_executor(None, blocked_task, "Task2")
    
    
    result = await asyncio.gather(r1,r2)
    
    print(result)


if __name__ =="__main__":
    await main()

일반적으로 파이썬에서 http 통신을 위해서는 request 패키지를 임포트해서 사용을 하는데, 이 패키지를 사용하면서 asyncio를 사용하기 위해서는 쓰레드를 위한 코드도 생성해야지 사용이 가능하다. 따라서 번거로움이 많아지는데,

aiohttp라는 패키지를 사용을 하면 번거로움이 사라진다.

파이썬을 사용하다보면은 성능에 대한 생각을 자주 하게된다. 느린 언어이지만 개발의 편의성 때문에 파이썬을 버릴수도 없기에 계속 사용을 하게 되는 뫼비우스의 띠를 직접 몸으로 겪는다. 이에 대한 여러가지 나름의 해결책들이 있기에 그것들에 대한 정리의 필요성을 느끼게 되었다.

동시성과 병렬성이라는 단어의 뜻부터 알아보자.

동시성이라는 것은 여러개의 일들을 동시에 진행되는 것처럼 하는 것이다. 예를들어 우리가 한꺼번에 일을 처리를 하는것을 들수가 있다. n잡러들에게는 여러개의 일을 같이 진행을 하는데, 이것이 현실상의 동시성을 얘기를 하는것이라고 생각이 든다. 프로그래밍에서는 io-bound의 문제들을 일컫는다.

병렬성이라는 것은 동시성과는 다르게 하나일을 여러가지 코어가 나누어서 집중적으로 진행한다는 것이다. 하나의 큰 작업 ( ex: 고시공부) 를 공부할때에, 오전에는 A과목을, 오후에는 B과목을.. 등등 하나의 큰 목표를 위해 그 작업을 잘게 쪼개서 진행을 한다.  이것을 병렬성이라고 생각할수 있음. 프로그래밍에서는 cpu-bound의 문제를 말한다.

여기서 잠깐 동기식(synchronous)과 비동기식(asynchronous)라는 단어도 자주 나오는데, 개념을 알고가야지 해당부분에 대한 헷갈림이 덜해진다

비동기식은 : 완전히 독립적으로 진행이 되고, 대기하지 않아도 되는 작업들을 말한다.

동기식은 서로 데이터들을 주기적으로 모아주고, 공유하는 작업을 진행을 할때에 말한다.

동시성이나 병렬성을 구현을 할때에 비동기식과 동기식으로 둘다 구현이 가능하지만, 당연히 비동기식으로 구현하는게 효율이 더 좋다. 하지만 풀려는 문제에 따라서 알고리즘을 동기식으로 구현을 해야할수도 있다는 것을 알아두어야 한다.

결국에는 단어가 가지고 있는 뜻이 헷갈려서 어렵다고 생각을 하는 것인데,

다음의 단어의 뜻을 정확히 알고 있으면 해결이 된다

1) 동기식 vs 비동기식 (synchronous vs asynchronous)

2) IO-BOUND vs CPU-BOUND

3) 동시성 vs 병렬성

4) 멀티쓰레딩 vs 멀티프로세싱 vs Async io

카페24와 아임웹에서 iframe을 사용하려 했더니,

보안 문제상으로 https로 접근을 해야된다고 함.

그래서 ec2에서 로드밸런스 붙이고, 거기다가 https로 접근해서 진행하는 순서를 함.

https로만 접근을 하는것이여서,

로드밸런스 리스너에 HTTPS:443 만 열어서 설정을 함

로드밸런스에 타겟을 설정을 하는데, 타겟은 포트 80번을 열어서 진행을 함. (아마도 ec2랑 포트 80으로 연결이 되는듯함) ec2에서는 gunicorn의 포트를 80으로 열어놔야함

sudo gunicorn -k uvicorn.workers.UvicornWorker --access-logfile ./gunicorn-access.log testserver:app --bind 0.0.0.0:80 --workers 2 --daemon

서비스를 배포하기 위해서는 도메인이 필수입니다

도메인을 통해 IP로는 나타낼 수 없는 자신의 서비스에 대한 아이덴티티를 도메인을 통해 나타내는 것은 물론

사용자들도 편하게 서비스에 접근할 수 있습니다

이 글에서는 AWS의 EC2인스턴스와 도메인을 연결하여 보겠습니다

순서는 다음과 같습니다

1. 도메인 취득

2. Route53을 이용하여 도메인과 EC2 인스턴스 연결

도메인 취득하기

도메인은 기본적으로 비용이 들어갑니다

다만 무료로 도메인을 취득할 수 있는 곳들도 있으나 해당 도메인들은 불안정하므로

toy-project가 아닌 실비스를 생각중이시라면 유료 도메인을 사용하시기를 권장드립니다

유료 도메인은 가비아, 카페24, 고대디 등 유명한 도메인 구매 사이트에서 손쉽게 구매하실 수 있습니다

또한 AWS에서도 도메인 취득을 지원하지만 국내 도메인 판매업체에서 구입하는 것이 좀 더 쉽습니다

AWS에서 취득하는 방법은 아래에 자세하게 나와있습니다

https://aws.amazon.com/ko/getting-started/tutorials/get-a-domain/

마음에 드는 업체를 선정하셔서 회원가입 및 도메인 검색을 통해 해당 도메인 사용이 가능한지 체크를 하고

구입 절차를 밟으시면 됩니다

단, 구입시 소유자 정보를 작성할 때  실수가 없도록 주의하셔야 합니다

특히 이메일은 도메인 소유를 증명할 때 자주 사용되니 반드시 구매자가 실제로 사용중인 이메일을 작성하셔야 합니다

또한 네임서버를 입력하는 부분은 우선 해당 도메인업체의 네임서버를 이용한다고 표시해놓고

이후에 AWS에서 네임서버를 받아 다시 수정해주면 됩니다

Route53을 도메인-EC2 연결

도메인 구입을 한 후에 해당 도메인과 AWS의 EC2 인스턴스를 Route53 서비스를 통해 연결해 보겠습니다

- Route53 : 도메인 등록(구입) / DNS 라우팅(IP를 Domain과 연결) / 상태 및 트래픽 확인을 제공하는 AWS 서비스입니다

AWS에 로그인을 한 후 [Route 53] 서비스를 선택합니다

왼쪽 사이드바의 [호스팅 영역]을 선택한 후 [호스팅 영역 생성]을 클릭합니다

오른쪽에 다음과 같은 화면이 뜨면 구입한 도메인 이름을 입력합니다

생성을 누르면 다음과 같이 레코드세트가 만들어 지는 것을 확인하실 수 있습니다

생성된 레코드 세트 중 NS 유형을 선택하고 해당 값들을 복사합니다

도메인을 구입한 업체에 다시 들어가 해당 도메인관리에서 네임서버(NS)를 앞서 복사한 값으로 변경하여 줍니다

위의 과정을 마치면 도메인과 Route53의 연결이 완료된 것입니다

잘 연결되었는지 확인하시려면 다음 사이트에 방문하셔서 연결하신 도메인을 검색하면 NS 항목에

Route53에서 복사한 값들이 입력된 것을 확인하실 수 있습니다

https://www.ultratools.com/tools/dnsLookup

혹은 cmd에서 다음과 명령어를 사용하셔도 됩니다

nslookup domainname.com

이제 EC2 인스턴스와 해당 도메인을 연결해 보도록 하겠습니다

[Route 53]으로 돌아와 [레코드 세트 생성]을 통해 [A 유형]을 생성해줍니다

A유형의 레코드를 통해 EC2의 IP와 도메인을 연결할 것입니다

그림과 같이 설정한 후에 값에는 EC2의 탄력적 IP를 입력합니다

(탄력적IP IP만들기)

만약 도메인앞에 www. 를 붙여서 접속되기를 원한다면 다음과 같이 레코드세트를 하나 더 생성해주시면 됩니다

[레코드 세트 생성] 클릭 후 [이름]에 www 입력, [값]에 www를 제외한 해당 도메인 입력

만약 등록하고자 하는 도메인이 www.example.com 이라면

이름 칸에는 www를, 밑의 값에는 example.com 만 입력해주시면 됩니다

이제 도메인-EC2 인스턴스의 연결이 모두 끝났습니다

잘 등록이 되었는지 다시 아래 사이트 방문 혹은 cmd를 이용하여 도메인을 검색한 후 결과를 확인합니다

https://www.ultratools.com/tools/dnsLookup

등록한 도메인 연결정보 확인

개인정보 처리방침

스위츠랩 (이하 회사)는 「개인정보 보호법」 제30조에 따라 이용자의 개인정보를 보호하고 이와 관련한 고충을 신속하고 원활하게 처리할 수 있도록 하기 위하여 다음과 같이 개인정보 처리방침을 수립 및 공개합니다.

제1조 (개인정보의 처리목적)

회사는 다음의 목적을 위하여 개인정보를 처리하며, 처리하고 있는 개인정보는 다음의 목적 이외의 용도로는 이용되지 않습니다. 이용 목적이 변경되는 경우에는 「개인정보 보호법」 제18조에 따라 별도의 동의를 받는 등 필요한 조치를 이행할 예정입니다.

또한 회사는 만 14세 이상의 이용자를 대상으로 서비스를 제공하며, 만 14세 미만 아동의 개인정보가 수집된 사실을 인지하는 경우 해당 정보를 지체없이 삭제하겠습니다

1. 회원 가입 및 관리

회원 가입의사 확인과 회원제 서비스 제공에 따른 회원자격 유지 및 관리, 서비스 부정이용 방지, 각종 고지와 통지, 고충처리 목적으로 개인정보를 처리합니다.

1. 서비스 제공

서비스 및 콘텐츠, 광고를 포함한 맞춤형 서비스 제공을 목적으로 개인정보를 처리합니다.

1. 고충처리

이용자의 신원 확인, 문의사항 확인, 사실조사를 위한 연락, 통지, 처리결과 통보의 목적으로 개인정보를 처리합니다.

1. 개인정보 (TrueDepth API)

TrueDepth API를 이용한 사용자 얼굴인식 정보를 이용해 사용자들의 더욱 원활한 서비스 이용을 하도록 처리합니다

제2조 (개인정보의 처리 및 보유기간)

① 회사는 법령에 명시되어 있거나 이용자로부터 개인정보 수집 시 동의 받은 개인정보의 보유 및 이용기간 내에서 개인정보를 처리 및 보유합니다.

② 각각의 개인정보 처리 및 보유 기간은 다음과 같습니다.

1. 회원 가입 및 관리 : 회원 탈퇴 시까지
2. TrueDepthAPI :  별도의 저장없이 데이터 정보만 처리. 즉시 폐기.

다만, 다음의 사유에 해당하는 경우에는 해당 사유 종료 시까지

1) 관계 법령 위반에 따른 수사, 조사 등이 진행 중인 경우에는 해당 수사, 조사 종료 시까지

2) 서비스 이용에 따른 채권, 채무관계 잔존 시에는 해당 채권, 채무관계 정산 시까지

1. 서비스 제공 : 서비스 공급 완료 또는 서비스 이용 종료 시까지
2. 고충처리 : 고충 처리 완료 시까지

다만, 다음의 사유에 해당하는 경우에는 해당 기간 종료 시까지

제3조 (개인정보의 제3자 제공)

① 회사는 이용자의 개인정보를 제1조(개인정보의 처리 목적)에서 명시한 범위 내에서만 처리하며, 정보주체의 동의, 법률의 특별한 규정 등 「개인정보 보호법」 제17 조 및 제18조에 해당하는 경우에만 개인정보를 제3자에게 제공합니다.

② 회사는 제3자에게 개인정보를 제공하지 않으며, 제공하게 될 경우 이용자에게 동의를 받겠습니다 .

제4조 (개인정보처리의 위탁)

① 회사는 개인정보 관리를 위탁하지 않습니다

제5조 (이용자와 법정대리인의 권리•의무 및 행사방법)

① 이용자는 회사에 대해 언제든지 개인정보 열람, 정정, 삭제, 처리정지 요구 등의 권리를 행사할 수 있습니다.

② 개인정보 열람 및 처리정지 요구는 개인정보보호법 제35조 제4항, 제37조 제2항에 의하여 이용자의 권리가 제한될 수 있습니다.

③ 개인정보의 정정 및 삭제 요구는 다른 법령에서 그 개인정보가 수집 대상으로 명시되어 있는 경우에는 그 삭제를 요구할 수 없습니다.

④ 회사는 이용자 권리에 따른 열람의 요구, 정정·삭제의 요구, 처리정지의 요구 시 열람 등 요구를 한 자가 본인이거나 정당한 대리인인지를 확인할 수 있습니다.

⑤ 제4항에 따른 권리행사 주체가 대리인(이용자의 법정대리인이나 위임을 받은 자)인 경우 “개인정보 처리 방법에 관한 고시(제2020-7호)” 별지 제11호 서식에 따른 위임장을 제출하셔야 합니다.

제6조 (처리하는 개인정보 항목)

① 회사는 다음의 개인정보 항목을 처리하고 있습니다. 

② 서비스 이용과정에서 아래 개인정보 항목이 자동으로 생성되어 수집될 수 있습니다.

IP주소, 쿠키, 서비스 이용기록, 광고식별자, 방문기록, 기기 정보(유형, 모델명, OS 버전, APP 버전, 기기 식별자, 언어 및 국가) 

③ 회사의 서비스를 이용하여 사진을 찍거나 사진을 편집하는 경우 이용자의 사진(또는 갤러리)에 접근할 수는 있지만 이용자의 사진을 복사하거나 회사의 서버로 전송하지 않습니다.

제7조 (개인정보의 파기)

① 회사는 이용자로부터 동의 받은 개인정보의 보유기간이 경과하거나 처리목적을 달성하여 더 이상 개인정보가 필요하지 않게 된 경우 지체없이 해당 개인정보를 파기합니다.

② 제1항 해당됨에도 불구하고 다른 법령에 따라 개인정보를 계속 보존하여야 하는 경우에는, 해당 개인정보를 별도의 데이터베이스(DB)로 옮기거나 보관장소를 달리하여 보존합니다. (법령에 따른 보관 기간은 제2조를 참조하시기 바랍니다)

③ 개인정보 파기의 절차 및 방법은 다음과 같습니다.

1. 파기절차

1) 개인정보 도용 등으로 인한 피해 발생 시 복구와 피해자 보호 등을 위하여 회원가입 시 수집한 개인정보를 14일 동안 임시로 보관할 수 있습니다.

2) 회사는 파기 사유가 발생한 개인정보를 선정하고, 회사의 개인정보 보호책임자의 승인을 받아 개인정보를 파기합니다.

1. 파기방법

1) 전자적 파일의 형태 : 복구 및 재생이 되지 않도록 기술적인 방법 이용

2) 종이 문서 : 분쇄기로 분쇄하거나 소각

제8조 (개인정보의 안전성 확보조치)

회사는 개인정보의 안전성 확보를 위해 다음과 같은 조치를 취하고 있습니다.

1. 관리적 조치

내부관리계획 수립 및 시행, 정기적 임직원 교육, 정기적인 접속기록 점검, 수탁사 점검 등

1. 기술적 조치

개인정보처리시스템 등의 접근권한 관리, 접근통제시스템 설치, 내부 관리계획에 따른 암호화 (전송구간 및 저장 시), 보안프로그램 설치

1. 물리적 조치

데이터센터, 자료보관실 등의 접근통제

제9조 (개인정보 자동 수집 장치의 설치∙운영 및 거부에 관한 사항) 

회사는 이용자들에게 적합하고 보다 유용한 서비스와 광고 서비스(맞춤형 광고 포함)를 제공하기 위해서 이용자의 광고 식별자와 분석 소프트웨어를 사용하고 있습

제10조 (개인정보 보호책임자) 

① 회사는 개인정보 처리에 관한 업무를 총괄하고 개인정보 처리와 관련한 이용자의 불만처리 및 피해구제 등을 위하여 아래와 같이 개인정보 보호책임자를 지정하고 있습니다.

② 이용자께서는 회사의 서비스를 이용하시면서 발생한 개인정보 보호 관련 문의, 불만처리, 피해구제 등에 관한 사항에 대하여 개인정보 보호책임자에게 문의하실 수 있으며, 문의하신 내용은 빠른 시일 내에 답변 및 처리해드릴 예정입니다. 다만, 부득이한 사유로 지연이 될 경우 이용자께 다시 안내 드리겠습니다.

제11조 (권익침해 구제방법)

이용자는 개인정보 침해에 대한 피해구제나 상담 등이 필요하신 경우에 아래의 기관에 문의하실 수 있습니다

제12조 본 개인정보처리방침의 적용 범위

① 본 개인정보처리방침은 회사가 제공하는 모든 서비스(웹사이트 및 APP 포함)에 적용되지만, 서비스의 특성이 상이한 경우, 서비스별로 특화된 개인정보처리방침이 적용될 수 있습니다.

② 회사 서비스에 링크되어 있는 다른 회사의 웹사이트를 방문하거나, 방문하신 웹사이트에서 개인정보를 수집하는 경우 본 개인정보처리방침이 적용되지 않습니다.

제13조 (개인정보 처리방침의 변경 및 고지)

① 본 개인정보처리방침의 내용 추가, 삭제 및 수정이 있을 경우 개정 최소 7일 전에 ‘공지사항’을 통해 사전 공지를 하겠습니다. 다만, 수집하는 개인정보의 항목, 이용목적의 변경 등과 같이 이용자 권리의 중대한 변경이 발생할 때에는 최소 14일 전에 공지하며, 필요 시 이용자 동의를 다시 받을 수도 있습니다

② 이 개인정보 처리방침은 2021.11.11부터 적용됩니다

**들어가기

- 해당 문서는 qiita.com/shu223/items/722077b4bbe868f58ddc 의 번역 글입니다

- 더 자세한 내용은 추가적으로 찾아보길 바랍니다

** 번역시작

제목 : ARKit 4 LiDAR Depth API 

iOS 기기에서 처음 LiDAR 스캐너를 탑재 한 iPad Pro의 발매와 동시에 출시 된 ARKit 3.5에서는 LiDAR를 이용하여 reconstraction 한 3D 메쉬는 얻을 수 있었지만, 그 계산에 이용되고있는 것 뎁스 (깊이) 데이터에 액세스 할 수 없었다.

이후 발표 된 ARKit 4 / iOS 14 (/ iPadOS 14)에서 드디어 LiDAR에서 측정 한 깊이를 얻을 수있게되었다. 기존의 깊이와 구별하기 위해 "장면 깊이 (Scene Depth) '이라고도하는 것 같다.

LiDAR 깊이의 취득 방법

LiDAR 유래의 깊이 데이터는 ARWorldTrackingConfiguration 이용시 frameSemantics 속성에 .sceneDepth 옵션을 지정하여 검색 가능하게된다.

let session = ARSession()
let configuration = ARWorldTrackingConfiguration()

// sceneDepth 옵션을 사용할 수 있는지 확인
if type(of: configuration).supportsFrameSemantics(.sceneDepth) {
   // Activate sceneDepth
   configuration.frameSemantics = .sceneDepth
}
session.run(configuration)

ARFrame에 새롭게 추가 된 sceneDepth 속성보다 LiDAR에서 측정 한 깊이 데이터를 얻을 수있다.

func session(_ session: ARSession, didUpdate frame: ARFrame) {
   guard let depthData = frame.sceneDepth else { return }
   // Use depth data
}

사용 가능한 구성

ARConfiguration 프로토콜에 정의 된 frameSemantics 속성에 sceneDepth을 설정하기 때문에 API으로 사용할 수는 있지만, API 레퍼런스의 sceneDepth 절에 설명보기 한 월드 추적 이외의 구성에서 사용할 수없는스러운

developer.apple.com/documentation/arkit/arconfiguration/framesemantics/3516902-scenedepth

If you enable this option on a world-tracking configuration's frameSemantics,  ARKit includes depth information for regions of the current frame's capturedImage. The world-tracking configuration exposes depth information in the sceneDepth property that it updates every frame.

하드웨어적인 제약

마찬가지로 sceneDepth 참조 페이지를 보자.

ARKit supports scene depth only on LiDAR-capable devices

칩이 A12 이상이나 조건은 아닌 것 같다. (LiDAR이 실리 → 필연적으로 고성능 칩이기 때문 일까)

<종래의 깊이 데이터와의 차이>

지금까지도 (특정 조건에서) ARKit 이용시 깊이 데이터에 액세스하는 것은 가능했다. ARFrame의capturedDepthData 속성 estimatedDepth이 종래부터 있던 깊이 API입니다. 이번에 추가 된 깊이 API와 무엇이 다른가.

깊이 데이터의 종류와 취득 조건

우선 물론 깊이 데이터의 종류가 다르다. 그리고 이에 따라 얻을 수있는 조건도 다르다. capturedDepthData는 True-Depth 카메라 유래의 깊이 데이터에서 페이스 트래킹 이용시에만 얻을 수있다.

estimatedDepth는 frameSemantics에 personSegmentationWithDepth 옵션을 지정한 경우에 얻을 수있는 것으로, 듀얼 카메라와 True-Depth 카메라 유래의 깊이가 아니라 그 속성 이름에서 알 수 있듯이 추정 깊이 데이터이다. 요 A12 칩 이상.

sceneDepth는 상술 한 바와 같이 frameSemantics에 sceneDepth를 지정한 경우에 취득 할 수있어 AR 구성으로는 월드 추적에만 장치로 LiDAR를 탑재하고있을 필요가있다

프레임 레이트 / 생성 알고리즘의 차이

capturedDepthData는 True-Depth 카메라 유래의 깊이 데이터이기 때문에 ARFrame 컬러 데이터 (capturedImage 속성)보다 업데이트 빈도가 낮고, 깊이를 이용한 효과 등을 걸고있는 피사체 (페이스 트래킹이므로 자신)이 빨리 움직일 경우에 추종 할 수없는 것이 있었다.
한편 estimatedDepth은 기계 학습 기반으로 추정되며, A12 이후의 고성능 칩을 조건으로하고 있기 때문에 카메라 프레임과 동일한 프레임 속도로 업데이트된다.
sceneDepth도 LiDAR로 취득한 깊이 데이터와 광각 카메라에서 가져온 컬러 데이터를 기반으로 기계 학습 알고리즘을 이용하여 생성된다. 60fps로 동작하는, 즉 이쪽도 ARFrame를 얻을 때마다 업데이트되고있다.
(WWDC 2020의 "Explore ARKit 4"세션에서)

The colored RGB image from the wide-angle camera and the depth ratings from the LiDAR scanner are fused together using advanced machine learning algorithms to create a dense depth map that is exposed through the API.
(광각 카메라의 컬러 RGB 이미지와 LiDAR 스캐너에서 심도 정격이 고급 기계 학습 알고리즘을 사용하여 융합 된 API를 통해 공개되는 고밀도의 깊이 맵이 생성됩니다.)

This operation runs at 60 times per second with the depth map available on every AR frame. 
(이 작업은 초당 60 번 실행되며 AR 프레임마다 깊이 맵을 사용할 수 있습니다.)

형식의 차이

capturedDepthData는 AVDepthData 형, 

estimatedDepth는 CVPixelBuffer 형, 

그리고 sceneDepth는 ARDepthData 형얻을 수있다.

<ARDepthData>

상술 한 바와 같이 sceneDepth 속성에서 얻을 수 LiDAR 유래의 깊이 데이터는 ARDepthData 형 얻을 수있다. 이곳은 iOS 14에 추가 된 새로운 클래스.

developer.apple.com/documentation/arkit/arconfiguration/framesemantics/3516902-scenedepth

이것을 잘 이용한 공식 샘플이 나와 있으므로 자세한 설명은 샘플을 읽으면서 다른 기사에 쓴다.

LiDAR의 정확도 / 측정 가능한 거리는?

WWDC 2020은 아니지만, ARKit 3.5 릴리스되었을 때 "Advanced Scene Understanding in AR"라는 Tech Talk가 공개되어 있으며, 그 중 LiDAR의 정확성에 대해 언급했다.

The new iPad Pro comes equipped with a LiDAR Scanner. This is used to determine distance by measuring at nanosecond speeds how long it takes for light to reach an object in front of you and reflect back. This is effective up to five meters away and operates both indoors and outdoors. 

(새로운 iPad Pro는 LiDAR 스캐너가 탑재되어 있습니다. 이것은 눈앞의 물체에 빛이 도달하여 반사되어 돌아올 때까지의 시간을 나노초의 속도로 측정하여 거리를 판단 하는 데 사용됩니다. 이것은 5 미터까지 유효, 실내에서도 야외에서도 사용할 수 있습니다.)

LiDAR에서 몇 미터 앞까지 측정 할 것인가라는 질문을받은 적이 몇 번 있지만, 이런 것은 공식적으로 언급되지 않은 느낌 이었기 때문에, "샘플에서 실제로 시도해 보면 좋아요"라고 답변을했다. 기준해라 귀중한 공식 정보가 있으므로 참고.

personSegmentationWithDepth과 장면 깊이

ARConfiguration의 frameSemantics 속성에 personSegmentationWithDepth 옵션을 지정하는 경우, 씬 깊이를 얻을 수있는 장치라면 자동으로 장면 깊이를 얻을 수있는 것 같다.

let session = ARSession()
let configuration = ARWorldTrackingConfiguration()

// Set required frame semantics
let semantics: ARConfiguration.FrameSemantics = .personSegmentationWithDepth

// Check if configuration and device supports the required semantics
if type(of: configuration).supportsFrameSemantics(semantics) {
   // Activate .personSegmentationWithDepth
   configuration.frameSemantics = semantics
}
session.run(configuration)

게다가 추가 전력 비용도 들지 않는 것.

Additionally if you have an AR app that uses people occlusion feature, and then search the personSegmentationWithDepth frameSemantic, then you will automatically get sceneDepth on devices that support the sceneDepth frameSemantic with no additional power cost to your application.

smoothedSceneDepth

상술 한 sceneDepth은 WWDC 2020 개최 시점 (iOS 14 beta 1 때) 이미 공개되어 있었지만, iOS 14 beta 5에서 갑자기 smoothedSceneDepth되는 API가 추가되었다.

이 때 (2020 년 8 월) 문서를 바로 보러 갔는데 자세한 내용은 아무것도 쓰여지지 않았다.
지금 보러 가면 제대로 설명이 적혀있어 sceneDepth의 차이도 명기되어있다. DeepL 이용의 일본어 번역을 병기하여 여기에 정리해 둔다.

smoothedSceneDepth: ARConfiguration.FrameSemantics

ARConfiguration.FrameSemantics 유형 속성

developer.apple.com/documentation/arkit/arconfiguration/framesemantics/3674208-smoothedscenedepth

An option that provides the distance from the device to real-world objects, averaged across several frames.
(장치에서 실제 객체 사이의 거리를 제공하는 옵션으로 여러 프레임에서 평균화됩니다.)

Declaration

static var smoothedSceneDepth: ARConfiguration.FrameSemantics { get }

Discussion

Enable this option on a world-tracking configuration (ARWorldTrackingConfiguration) to instruct ARKit to provide your app with the distance between the user’s device and the real-world objects pictured in the frame's capturedImage. ARKit samples this distance using the LiDAR scanner and provides the results through the smoothedSceneDepth property on the session’s currentFrame.

(월드 추적 설정 (ARWorldTrackingConfiguration)에서이 옵션을 사용하면 사용자의 장치 및 프레임 캡처 사진에 찍혀있는 실제 객체와의 거리를 응용 프로그램에 제공하도록 ARKit에 지시합니다 .ARKit은 LiDAR 스캐너를 사용하여이 거리를 샘플링 세션 currentFrame의 smoothedSceneDepth 속성을 통해 결과를 제공합니다.)

LiDAR 스캐너를 사용할 수 여기에 명기되어있다.

To minimize the difference in LiDAR readings across frames, ARKit processes the data as an average. The averaged readings reduce flickering to create a smoother motion effect when depicting objects with depth, as demonstrated in Creating a Fog Effect Using Scene Depth. Alternatively, to access a discrete LiDAR reading at the instant the framework creates the current frame, use sceneDepth

(프레임 간의 LiDAR 측정 값의 차이를 최소화하기 위해 ARKit은 데이터를 평균으로 처리합니다. 평균화 된 판독 값은 "장면 깊이를 사용한 안개 효과 만들기"에서 입증 된 같이 깊이있는 개체를 묘사 할 때 깜박임을 줄이고 더 부드러운 모션 효과를 만들어냅니다. 또한 프레임 워크가 현재의 프레임을 만든 순간에 개별 LiDAR 판독 값에 액세스하려면 sceneDepth를 사용합니다.)

여기가 제일 중요하다. sceneDepth의 차이가 명기되어 있으며, 장점과 구분도 적혀있다.

ARKit supports scene depth only on LiDAR-capable devices, so call supportsFrameSemantics(
:) to ensure device support before attempting to enable scene depth.

(ARKit은 LiDAR 지원 장치에서만 장면 심도를 지원하고 있기 때문에, 장면 심도를 사용하기 전에 supportsFrameSemantics (:)을 호출 해 디바이스의 지원을 확인하십시오.)

smoothedSceneDepth: ARDepthData

ARFrame의 smoothedSceneDepth 속성

An average of distance measurements between a device's rear camera and real-world objects that creates smoother visuals in an AR experience.
(장치의 후면 카메라와 실제 객체 사이의 거리 측정의 평균치에서 AR 체험으로 더 부드러운 영상을 만들 수 있습니다.)

Declaration

var smoothedSceneDepth: ARDepthData? { get }

Discussion

his property describes the distance between a device's camera and objects or areas in the real world, including ARKit’s confidence in the estimated distance. This is similar to sceneDepth except that the framework smoothes the depth data over time to lessen its frame-to-frame delta

(이 속성은 장치의 카메라와 실제 객체와 지역과의 거리를 설명합니다. 이것은 sceneDepth와 비슷하지만 프레임 워크는 프레임 간의 차이를 줄이기 위해 심도 데이터를 시간이 지남 부드럽게합니다.)


This property is nil by default. Add the smoothedSceneDepth frame semantic to your configuration’s frameSemantics to instruct the framework to populate this value with ARDepthData captured by the LiDAR scanner.

(이 속성은 기본적으로 nil입니다. 프레임 워크에 LiDAR 스캐너에 의해 캡처 된 ARDepthData에서이 값을 입력하도록 지시하기 위해 설정 frameSemantics에 smoothedSceneDepth 프레임 시맨틱을 추가합니다.)

Call supportsFrameSemantics(:) on your app’s configuration to support smoothed scene depth on select devices and configurations.

(앱 설정에서 supportsFrameSemantics (:)을 호출하여 선택한 장치 설정에서 평활화 된 장면 심도를 지원합니다.)