알토르 3주차 API Endpoint

API Endpoint

가상환경 만드는 방법 (권장)

1. 프로젝트 폴더로 이동

cd C:\Users\somansa\Desktop\VScode\manta\flask-chat-app

1. 가상환경 생성

python -m venv venv

venv 폴더 생성됨

1. 가상환경 활성화

--powershell--
.\venv\Scripts\activate

--linux--
source /venv/bin/activate

활성화되면 터미널에 (venv) 표시

1. 필요한 패키지 설치

pip install flask flask-cors

1. 앱 실행

python app.py

app.py

from flask import Flask, request, jsonify
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route('/sendMessage', methods=['POST'])
def send_message():
    data = request.get_json()
    message = data.get('message')

    if not message:
        return jsonify({'error': 'No message provided'}), 400

    # Here you can add logic to process the message
    response_message = f"Message received: {message}"

    return jsonify({'response': response_message}), 200

if __name__ == '__main__':
    app.run(debug=True)

BackEnd

from flask import Flask, request, jsonify
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route('/sendMessage', methods=['POST'])
def send_message():
    data = request.json  # JSON 데이터 받기
    username = data.get("username")
    message = data.get("message")

    # 서버 터미널에 출력
    print(f"{username} says: {message}")

    # JSON 응답 보내기
    return jsonify({
        "response": f"{username} says: {message}"
    }), 200

if __name__ == '__main__':
    app.run(debug=True)

• username 추가

FrontEnd

try {
      const res = await fetch("http://localhost:5000/sendMessage", {
        method: "POST",
        headers: { "Content-Type": "application/json" },
        body: JSON.stringify({ username: "Ju-hyeok", message: text }),
      });

• username 추가

1️⃣ 기본 Flask 세팅

from flask import Flask, request, jsonify

app = Flask(__name__)

2️⃣ /sendMessage POST API

• 요청 방식: POST
• Content-Type: application/json

데이터 예시:

{
  "username": "Juhyeok",
  "message": "Hello!"
}

Flask 코드:

@app.route('/sendMessage', methods=['POST'])
def send_message():
    # JSON 데이터 가져오기
    data = request.get_json()
    
    if not data or 'username' not in data or 'message' not in data:
        return jsonify({"error": "username과 message 필수"}), 400

    username = data['username']
    message = data['message']

    # 여기서 메시지 처리 로직 가능 (DB 저장, 로그 등)
    print(f"{username} says: {message}")

    # 응답
    return jsonify({"status": "success", "username": username, "message": message}), 200

3️⃣ Flask 실행

if __name__ == "__main__":
    app.run(host="0.0.0.0", port=5000, debug=True)

python app.py

• 서버 실행 후: http://localhost:5000/sendMessage
• Postman, curl 등으로 테스트 가능

from flask import Flask, request, jsonify
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route('/sendMessage', methods=['POST'])
def send_message():
    data = request.get_json()
    
    if not data or 'username' not in data or 'message' not in data:
        return jsonify({"error": "username과 message 필수"}), 400

    username = data['username']
    message = data['message']

    print(f"{username} says: {message}")  # 서버 콘솔에 출력

    return jsonify({"status": "success", "username": username, "message": message}), 200

if __name__ == "__main__":
    app.run(host="0.0.0.0", port=5000, debug=True)

from flask import Flask, request, jsonify

app = Flask(__name__)

@app.route('/sendMessage', methods=['POST'])
def send_message():
    data = request.json  # JSON 데이터 받기
    username = data.get("username")
    message = data.get("message")

    # 서버 터미널에 출력
    print(f"{username} says: {message}")

    # JSON 응답 보내기
    return jsonify({
        "status": "success",
        "username": username,
        "message": message
    }), 200

if __name__ == '__main__':
    app.run(debug=True)

6️⃣ API 테스트

① Postman 사용

1. Postman 열기 → POST 선택
2. URL 입력: http://localhost:5000/sendMessage
3. Body → raw → JSON 선택

{
  "username": "Ju-Hyeok",
  "message": "Hello!"
}

Send 클릭 → JSON 응답 확인

② curl 사용

VS Code 터미널에서

--- git bash/Mac/Linux ---

curl -X POST http://localhost:5000/sendMessage \
  -H "Content-Type: application/json" \
  -d '{"username":"Juhyeok","message":"Hello!"}'

---- Powershell ----
1.
$headers = @{ "Content-Type" = "application/json" }
$body = @{ "username"="Juhyeok"; "message"="Hello1" } | ConvertTo-Json
Invoke-RestMethod -Uri http://127.0.0.1:5000/sendMessage -Method POST -Headers $headers -Body $body



2.
$headers = @{ "Content-Type" = "application/json" }
$body = @{ "username"="Juhyeok"; "message"="Hello1" } | ConvertTo-Json

# POST 요청
$response = Invoke-RestMethod -Uri http://127.0.0.1:5000/sendMessage -Method POST -Headers $headers -Body $body

# key: value 형식으로 출력
$response.PSObject.Properties | ForEach-Object { 
    "{0} : {1}" -f $_.Name, $_.Value
}

응답 예시:

Flask 실행한 터미널 → API 서버 역할

app.py를 실행하면 Flask가 127.0.0.1:5000에서 HTTP 서버로 동작

/sendMessage 같은 엔드포인트를 만들어 클라이언트 요청을 처리

서버 터미널에는 클라이언트가 보낸 데이터가 print로 찍힘

PowerShell → 클라이언트 역할

Invoke-RestMethod로 Flask 서버에 POST 요청을 보냄

서버에서 처리 후 보내준 JSON 응답을 PowerShell에서 받음

$response로 확인 가능

즉, 지금 구조는 백엔드(Flask) ↔ 프론트/클라이언트(PowerShell) 관계입니다.

7️⃣ React/Next.js에서 연결

프론트엔드에서 fetch 요청 시 URL http://localhost:5000/sendMessage

method: "POST", headers: {"Content-Type":"application/json"}, body: JSON.stringify({username, message})

사용자 → 챗봇 UI → /sendMessage (Flask API 서버) → 처리 → JSON 응답 → 챗봇 UI → 사용자에게 보여줌

• /sendMessage = “챗봇 서버의 대화용 URL” 역할
• 챗봇 클라이언트는 PowerShell 대신 JavaScript Fetch, Axios 등으로 요청을 보내면 되고,
• 서버는 Flask가 처리해서 JSON으로 응답하면, 챗봇 화면에서 메시지가 표시됩니다.

Openai API endpoint

1️⃣ 사전 준비

1. Python 패키지 설치

pip install flask openai

OpenAI API Key 준비
환경 변수로 저장하는 것이 안전합니다.

export OPENAI_API_KEY="sk-xxx..."  # Linux/Mac
setx OPENAI_API_KEY "sk-xxx..."    # Windows PowerShell

2️⃣ Flask 서버 코드 예제

from flask import Flask, request, jsonify
import openai
import os

app = Flask(__name__)

# OpenAI API 키 설정
openai.api_key = os.getenv("OPENAI_API_KEY")

@app.route("/sendMessage", methods=["POST"])
def send_message():
    data = request.get_json()
    user_input = data.get("message", "")

    # OpenAI ChatCompletion 호출
    try:
        response = openai.ChatCompletion.create(
            model="gpt-3.5-turbo",
            messages=[
                {"role": "system", "content": "당신은 친절한 챗봇입니다."},
                {"role": "user", "content": user_input}
            ],
            max_tokens=150
        )
        answer = response.choices[0].message.content
    except Exception as e:
        answer = f"Error: {str(e)}"

    return jsonify({"message": answer})

if __name__ == "__main__":
    app.run(debug=True)

3️⃣ 흐름 요약

클라이언트 → POST /sendMessage + { "message": "사용자 메시지" }

Flask 서버 → OpenAI API 호출

OpenAI → 생성한 답변 반환

Flask → JSON으로 클라이언트에 전송

클라이언트 → 화면에 표시