fastAPI 심화

- Chart.js
- pdf, csv 파일 업로드 후 데이터 정제하여 llm으로 처리 후 결과 도출
- sqlite로 데이터 저장
- ORM - SQLAlchemy

project/rag_app/backend/static/js/index.js

@@ -17,28 +17,58 @@ async function ask() {
 }
 
 // 파일 업로드
-document.querySelector("#uploadBtn").addEventListener("click", uploadFile)
-async function uploadFile()
-{
-    const fileInput = document.querySelector("#file");
+document.querySelector("#uploadBtn").addEventListener("click",uploadFile)
+async function uploadFile() {
+    const fileInput = document.querySelector("#file")
     // 첨부파일 정보 가져오기
-    const file = fileInput.files[0];
+    const file = fileInput.files[0]
 
-    if(!file)
-    {
-        alert("파일을 선택해주세요.");
+    if(!file){
+        alert('파일을 선택하세요');
         return;
     }
 
     // form 만들어 전송
-    const formData = new FormData()
-    formData.append("file", file)
+    const formData = new FormData();
+    formData.append("file",file);
 
-    const response = await fetch("/api/reg/question", {
-        method: "POST",
-        body: formData
+    const response = await fetch("/api/rag/upload",{
+        method:"POST",
+        body:formData
     })
     // 전송 후 answer 도착 시 answer 화면에 보여주기
     const answer = await response.json()
-    document.querySelector('#answer').textContent = answer.message
+    document.querySelector('#result').textContent = answer.message
+}
+
+document.querySelector("#askBtn").addEventListener("click", rag_ask)
+async function rag_ask() {
+    // 사용자가 질문 입력 시 질문을 서버로 전송
+    const question = document.querySelector('#question').value
+
+    const response = await fetch("/api/rag/question", {
+        method: "POST",
+        headers: {
+            "Content-Type": "application/json"
+        },
+        body: JSON.stringify({question : question})
+    })
+    // 전송 후 answer 도착 시 answer 화면에 보여주기
+    // const answer = await response.json()
+    // document.querySelector('#answer_result').textContent = answer.message
+
+    // stream 방식
+    const reader = response.body.getReader();
+    const decoder = new TextDecoder();
+    let answer = "";
+
+    while(true){
+        const { value, done } = await reader.read();
+
+        if (done) {
+            break;
+        }
+        answer += decoder.decode(value);
+        document.querySelector('#answer_result').textContent = answer;
+    }
 }