백엔드 서버 구현해보기(flask 실습)

기술과제

• Python Falsk 가 무엇인지

• Axios가 무엇인지 (Fetch함수는 무엇인지)

코딩과제

• 본인 포트폴리오 코드 Github에 올리기

• Varcel에 본인 코드 배포하기

• 본인이 만든 파이썬코드 내용을 Flask에 이동시키기

• localhost:5000/sendMessage API 만들기

• API호출, Next.js에서 사용자가 입력한값을 보내기 (Axios요청)

• 개발자도구 콘솔창에 응답값을 console.log가지고 찍어보기

---

 

코딩과제

 

• 본인 포트폴리오 코드 Github에 올리기

• Varcel에 본인 코드 배포하기

 

WEST_COLD (westcold.vercel.app)

WEST_COLD

 

 

 

---

flask
-백엔드의 전반적인 역활을 해준다
-웹페이지를 인터넷에 띄우고, 사용자들의 접속인 트래픽을 감당하고, 회원들의 정보와 게시판 정보를 관리하는 역활을 도와준다
- API 서버를 만드는 데에 특화 되어있는 Python Web Framework 
-URL을 파이썬 코드의 함수나 메서드에 매핑할 수 있는 라우팅 메커니즘을 제공

 

flask 기본 세팅

pip install Flask

from flask import Flask

app = Flask(__name__)

@app.route('/')
def index():
    return 'he'

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

 

기본세팅 결과물

 

• 본인이 만든 파이썬코드 내용을 Flask에 이동시키기

from flask import Flask, request, jsonify
from flask_cors import CORS
from openai import OpenAI
import requests
import json

app = Flask(__name__)
CORS(app)  # 모든 출처에서의 요청을 허용합니다.

# OpenAI API 키 설정
client = OpenAI(api_key="")

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

    try:
        # OpenAI에 사용자 입력 전달하여 응답 받기
        completion = client.chat.completions.create(
            model="gpt-3.5-turbo",
            messages=[
                {"role": "user", "content": user_input}
            ]
        )
        ai_response = completion.choices[0].message.content.strip()

        return jsonify({"description": ai_response})

    except Exception as e:
        return jsonify({"error": str(e)})


if __name__ == '__main__':
    print("Flask 애플리케이션이 실행되었습니다.")
    app.run(debug=True)

 

• localhost:5000/sendMessage API 만들기

-위 코드는 '/sendMessage' 엔드포인트에 POST 요청을 받으면 요청의 JSON 데이터에서 'message' 값을 읽어와 성공 응답을 반환한다.

 

뒤에서 계속

https://eatitstory.tistory.com/23

프론트와 백 서버 연결(axios)