API?

Application Programming Interface

서버와 클라이언트가 상호 작용하기 위한 도구, 네트워크 상에서 데이터를 주고 받으며 개발자가 원하는 기능을 구현하기 위해서 사용된다.

 

API는 웹에서 주로 사용하는데 클라이언트가 서버에 요청을 보낼 때는 HTTP 요청 메서드를 주로 사용한다. 이 중에 가장 자주 사용하는 것이 GET과 POST다.

 

클라이언트의 GET 요청은 서버에서 데이터를 받아오고 POST 요청은 서버의 상태에 변화를 줄 수 있다.

 

API 작성

• 웹 APP(프론트엔드)에서 원하는 기능을 수행하는 URL과 인터페이스를 제공한다는 의미
• 작성 할 API에서 원하는 데이터를 받아 데이터베이스에 데이터를 저장하고, 저장되어 있는 데이터를 읽어서 프론트엔드에 데이터를 제공해서 사용자가 원하는 목적을 이룰 수 있게 해야 합니다.

 

REST API

• REST API를 주로 사용하는데 이는 정해진 기능은 아니고 REST API의 필수 조건을 적은 약속이며 이를 준수하는 API를 RESTful API라고 한다.
• URL, Headers, Method 등 네트워크 표현 수단을 이해하기 쉽게 표현하는 방법을 정의합니다.

• REST API의 구성은 크게 세 가지 입니다.
  • Resource - URL
    • 소프트웨어가 관리하는 모든 자산(모든 데이터, 정보)
  • HTTP method

Create : 생성(POST)
Read : 조회(GET)
Update : 수정(PUT)
Delete : 삭제(DELETE)

• • 표현 - Content-Type
    • 자원을 어떻게(JSON, XML) 표현할지에 대한 설명

---

서버에서 클라이언트에게 jinja2와 같은 템플릿 엔진을 사용해서 API기능으로 사용할 수 도 있으나 이는 서버와 클라이언트가 상호 작용한다고 보기는 어려울 듯 하다. (템플릿 엔진에도 서버 사이드와 클라이언트 사이드가 있으므로 템플릿 엔진의 기능에 따라 가능한 상호작용에 차이가 있을 것)

 

회원가입 기능을 예시로 사용한다. Flask를 사용했다.(RESTful API가 아니다.)

 

<클라이언트>

$.ajax({
    type: "POST",
    url: "/sign_up/save",
    data: {
        //username을 user_give로 전달
        username_give: username,
        //password를 password_give로 전달
        password_give: password
    },
    //회원가입에 성공하면
    success: function (response) {
        alert("회원가입을 축하드립니다!")
        window.location.replace("/login")
    }
});

• 클라이언트는 POST 방식으로 /sign_up/save API에 접근 했으며 username.give,  password.give라는 이름으로 데이터를 서버로 넘겼다.
• 성공적인 반응을 받으면  경고 메세지를 출력하고 /login 페이지로 이동한다.

 

<서버>

@app.route('/sign_up/save', methods=['POST'])
def sign_up():
    # 클라이언트에게 아이디와 패스워드를 받아 저장
    username_receive = request.form['username_give']
    password_receive = request.form['password_give']
    # 패스워드 해쉬 값을 저장
    password_hash = hashlib.sha256(password_receive.encode('utf-8')).hexdigest()
    # 회원 정보 db에 저장
    doc = {
        "username": username_receive,  # 아이디
        "password": password_hash,  # 비밀번호
    }
    db.users.insert_one(doc)
    # 클라이언트에게 가입 성공 전달
    return jsonify({'result': 'success'})

• app.route를 보자 API의 주소는 /sign_up/save 이며 POST 요청에 응답한다.
• 클라이언트가 보낸 데이터를 username.receive, password.receive로 받았으며 이 데이터로 의도한 동작을 수행한 후 결과를 클라이언트에게 돌려준다.