목차

  1. 스트림릿 과제를 하며 만난 트러블 슈팅

트러블 슈팅

  • st.set_page_config()의 위치: 이 함수는 항상 가장 위 import구문들 아래에 배치 시켜야지 작동이 됩니다.
    • Streamlit의 레이아웃 및 초기 설정이 앱이 처음 로드될 때 결정되기 때문입니다.
  • 카테고리 설정 selectbox에 "설정하지 않음" 추가: 주제를 선택하지 않아도 자동으로 선택 되어 모델이 작동해 사용에 불편감을 없애기 위해서 사용하였습니다.
    • NONE파일을 만들어서 경로 추가 했습니다.
  • 로그인 화면을 어떻게 구상할지, 어디에 위치 시킬지: 로그인 화면으로 넘어가는 버튼을 만들고 싶었지만 구현하지 못해 처음 웹사이트에 접속했을 때 작동 되게 만들었습니다.
  • 로그인 정보를 다른 페이지에 가서도 정보확인 하기: 다른 페이지에서는 설정이 되지 않아 정보가 없어도 작동 되기 때문에 보안을 높이기 위해서 설정하였습니다.
    • json파일에 로드 된 정보를 읽어오고 이전 페이지의 session_state를 읽어와 정보를 확인하게 만들었습니다.
# 사용자 데이터 경로
users_file_path = pathlib.Path("users.json")

# 사용자 데이터 로드 함수
def load_users():
    if users_file_path.exists():
        with open(users_file_path, 'r', encoding='utf-8') as f:
            return json.load(f)
    return {}

# 세션 상태 초기화
if "user_id" not in st.session_state:
    st.session_state["user_id"] = None  # 초기값 설정

# 로그인된 사용자 확인
if not st.session_state["user_id"]:
    st.error("로그인되지 않았습니다. 먼저 로그인해주세요.")
    st.stop()

users = load_users()
user_id = st.session_state["user_id"]

if user_id not in users:
    st.error("사용자 정보를 확인할 수 없습니다. 다시 로그인해주세요.")
    st.stop()

st.success(f"환영합니다, {user_id}님!")
  • 경고 문구를 줄였습니다.
    • 화면에 나오는 인터페이스가 너무 많아 줄였습니다. 줄이는 방법으로는 st.error,st.success, st.waring 등의 문구 중 궅이 필요하지 않은 문구들을 st.write()로 빈 문자열을 주게하여 수정했습니다.
  • 질문 선택만 해도 질문에 대한 답변을 해서 사용자가 입력할 시에 답변을하게 수정하였습니다.
    • 프롬프트 간결화 및 명령 추가('사용자가 답변을 하기전에 대답을 먼저 하지마') => 실패
    • vectorstore 확인 후 초기화 => 질문만 출력 되게 했지만 프롬프트대로 답변을 하지 않음
    • if selected_question:, if user_input: 조건 분리 => 해결 (조건이 겹치는 부분이있어 분리해서 정의했습니다.)
  • 스트림 형식으로 출력해 사용자의 이용에 불편함을 줄일려고했습니다.
    • st.write_stream을 사용했지만 적용 되지않았습니다.
  • 경고 문구 중 너무 딱딱한 경고 문구가있어 수정했습니다.
    • 변경 전: FAISS를 찾을 수 없습니다. 다시 시도하세요.
    • 변경 후: FAISS 인덱스를 찾고 있습니다. 잠시만 기다려 주세요.
  • 색 배치: 컬러 헌터 싸이트를 이용해 팀원들과 회의를 했고 사용할 컬러들의 조합을 맞추어 프론트 팀원과 협의하여 색을 구성했습니다.
    • 텍스트 기반으로 학습을 하는 LLM이기 때문에 차분한 분위기로 설정 하였습니다.
배경 #071952
사이드 바, 셀렉트 박스 #088395
버튼 #37B7C3
텍스트 EBF4F6
  • 배너의 크기를 조절하기 위해서 css스타일을 추가했지만 실패
    • import base64를 통해 toml 파일과 css, html 스타일을 불러와서 적용하였습니다.
    • base64는 이진 데이터를 텍스트 형식으로 변환하는 인코딩 방식으로 안전하게 데이터를 불러 올 수 있습니다.

+ Recent posts