LM Studio로 Streamlit 채팅 앱 만들기 + 소스코드 제공

LM Studio로 만든 채팅앱 소스 코드 입니다.

 

아래 영상들을 참고해주세요.

 

 

 

https://youtu.be/ecBAvvuNxLc

- YouTube

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

[설치 명령어]

pip install streamlit openai

 

[사용한 Prompt]

 

1번째 프롬프트

아래 코드를 Streamlit에서 Input을 받아서 채팅 앱 만들어줘 :
# Example: reuse your existing OpenAI setup
from openai import OpenAI

# Point to the local server
client = OpenAI(base_url="http://172.29.224.1:5555/v1", api_key="lm-studio")

completion = client.chat.completions.create(
  model="lmstudio-community/Meta-Llama-3.1-8B-Instruct-GGUF",
  messages=[
    {"role": "system", "content": "Always answer in rhymes."},
    {"role": "user", "content": "Introduce yourself."}
  ],
  temperature=0.7,
)

print(completion.choices[0].message)

 

 

2번째 프롬프트

Stream 방식으로 출력되도록 수정해줘.
채팅 입력창은 화면 하단에 위치해야 해

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

[전체 소스코드]

1) Base App Code (app.py)

실행 명령어 : python3 app.py

# Example: reuse your existing OpenAI setup
from openai import OpenAI

# Point to the local server
client = OpenAI(base_url="http://172.29.224.1:5555/v1", api_key="lm-studio")

completion = client.chat.completions.create(
  model="lmstudio-community/Meta-Llama-3.1-8B-Instruct-GGUF",
  messages=[
    {"role": "system", "content": "한글로 대답해줘."},
    {"role": "user", "content": "Introduce yourself."}
  ],
  temperature=0.7,
)

print(completion.choices[0].message)

 

2) 채팅 앱 Code (st_app.py) 

실행 명령어 : streamlit run st_app.py

import streamlit as st
from openai import OpenAI

# OpenAI 클라이언트 설정
@st.cache_resource
def get_openai_client():
    return OpenAI(base_url="http://172.29.224.1:5555/v1", api_key="lm-studio")

client = get_openai_client()

st.title("LM Studio 채팅 앱")

# 세션 상태 초기화
if "messages" not in st.session_state:
    st.session_state.messages = [
        {"role": "system", "content": "한글로 대답해줘."}
    ]

# 사용자 입력
user_input = st.text_input("메시지를 입력하세요:", key="user_input")

if st.button("전송"):
    # 사용자 메시지 추가
    st.session_state.messages.append({"role": "user", "content": user_input})

    # API 호출
    response = client.chat.completions.create(
        model="lmstudio-community/Meta-Llama-3.1-8B-Instruct-GGUF",
        messages=st.session_state.messages,
        temperature=0.7,
    )

    # 응답 메시지 추가
    assistant_message = response.choices[0].message.content
    st.session_state.messages.append({"role": "assistant", "content": assistant_message})

# 대화 내용 표시
for message in st.session_state.messages:
    if message["role"] != "system":
        with st.chat_message(message["role"]):
            st.write(message["content"])

 

 

3) 채팅 앱 Code - Streaming 방식 (st_app2.py) 

 

실행 명령어 : streamlit run st_app2.py

import streamlit as st
from openai import OpenAI

# OpenAI 클라이언트 설정
@st.cache_resource
def get_openai_client():
    return OpenAI(base_url="http://172.29.224.1:5555/v1", api_key="lm-studio")

client = get_openai_client()

st.title("LM Studio 채팅 앱")

# 세션 상태 초기화
if "messages" not in st.session_state:
    st.session_state.messages = [
        {"role": "system", "content": "한글로 대답해줘."}
    ]

# 채팅 메시지를 표시할 컨테이너
chat_container = st.container()

# 입력 필드를 화면 하단에 고정
input_container = st.container()

# 대화 내용 표시
with chat_container:
    for message in st.session_state.messages:
        if message["role"] != "system":
            with st.chat_message(message["role"]):
                st.write(message["content"])

# 사용자 입력 (화면 하단에 위치)
with input_container:
    user_input = st.text_input("메시지를 입력하세요:", key="user_input")
    send_button = st.button("전송")

if send_button and user_input:
    # 사용자 메시지 추가
    st.session_state.messages.append({"role": "user", "content": user_input})
    
    with chat_container:
        with st.chat_message("user"):
            st.write(user_input)
        
        with st.chat_message("assistant"):
            message_placeholder = st.empty()
            full_response = ""
            
            # 스트리밍 응답
            for response in client.chat.completions.create(
                model="lmstudio-community/Meta-Llama-3.1-8B-Instruct-GGUF",
                messages=st.session_state.messages,
                temperature=0.7,
                stream=True
            ):
                full_response += (response.choices[0].delta.content or "")
                message_placeholder.markdown(full_response + "▌")
            
            message_placeholder.markdown(full_response)
    
    # 최종 응답 메시지 추가
    st.session_state.messages.append({"role": "assistant", "content": full_response})
    
    # 입력 필드 초기화 (st.session_state 사용하지 않음)
    st.rerun()

# 스크롤을 항상 최하단으로 이동
st.markdown('<script>window.scrollTo(0, document.body.scrollHeight);</script>', unsafe_allow_html=True)