🔧 ALL AI 수정 가이드

복사 버튼, NEW 배지, 내 정보 로딩 문제 해결

📋 수정이 필요한 문제들

❌ 문제 1: 복사 버튼 SyntaxError

증상: 프롬프트 게시물에서 복사 버튼 클릭 시 오류 발생

오류 메시지: Uncaught SyntaxError: Invalid or unexpected token

원인: 게시물 제목에 특수문자(따옴표, 백슬래시 등)가 포함되면 onclick 속성이 깨짐

❌ 문제 2: NEW 배지 캐시 문제

증상: 기존 브라우저에서는 NEW 배지가 안 보이고, 새 브라우저에서만 보임

원인: Service Worker가 오래된 HTML/JavaScript를 캐시하고 있음

❌ 문제 3: 내 정보 로딩 속도

증상: "내 정보" 화면이 10초 이상 걸림

원인: 모든 게시물을 하나씩 순회하며 댓글을 찾는 비효율적인 쿼리

✅ 해결 방법

1 파일 다운로드

다음 파일들을 다운로드하세요:

📄
sw.js - 새로운 Service Worker (v1.1)
📄
PATCH_INSTRUCTIONS.html - index.html 수정 가이드
📄
firestore.indexes.json - Firebase 인덱스 설정

2 sw.js 교체

  1. 웹사이트 루트 폴더의 기존 sw.js 파일을 백업
  2. 다운로드한 새 sw.js 파일로 교체
  3. 변경 사항을 서버에 업로드
✅ 이 파일은 즉시 교체 가능합니다. 다른 파일과의 호환성 문제가 없습니다.

3 index.html 수정

PATCH_INSTRUCTIONS.html 파일을 열고 다음 순서대로 수정하세요:

  1. escapeHtml 함수 추가 - 특수문자 이스케이프 함수
  2. 복사 함수 개선 - try-catch 블록 추가
  3. 버튼 HTML 수정 - onclick → data 속성으로 변경
  4. 이벤트 리스너 추가 - 이벤트 위임 방식 적용
  5. 내 정보 함수 최적화 - collectionGroup 쿼리 사용
  6. Service Worker 등록 코드 수정 - 강제 업데이트 로직 추가
  7. meta 태그 추가 - 캐시 제어 태그 추가
⚠️ 주의: 각 수정 사항의 위치를 정확히 확인하세요. PATCH_INSTRUCTIONS.html에 상세한 위치가 명시되어 있습니다.

4 Firebase 인덱스 생성

내 정보 로딩 속도를 개선하려면 Firebase에서 복합 인덱스를 생성해야 합니다.

방법 1: Firebase CLI 사용 (권장)

  1. 프로젝트 폴더에 firestore.indexes.json 파일 저장
  2. 터미널에서 실행:
firebase deploy --only firestore:indexes

방법 2: Firebase Console 사용

  1. Firebase Console 접속
  2. Firestore Database → 인덱스 탭
  3. "인덱스 추가" 버튼 클릭
  4. 다음과 같이 설정:
    • Collection: comments (Collection group)
    • 필드 1: authorId (Ascending)
    • 필드 2: createdAt (Descending)
⚠️ 인덱스 생성에는 5-10분 정도 걸릴 수 있습니다.

5 캐시 클리어 안내

기존 사용자들을 위해 캐시를 클리어하는 방법을 안내하세요:

일반 사용자용:

  • Windows: Ctrl + Shift + R
  • Mac: Cmd + Shift + R
  • 또는 브라우저 설정에서 "캐시 및 쿠키 삭제"

개발자용:

브라우저 개발자 도구 콘솔에서 실행:

clearAllCache()
✅ 새로운 Service Worker가 자동으로 캐시를 업데이트하지만, 즉시 적용하려면 강제 새로고침이 필요합니다.

6 테스트

수정 후 다음 항목을 테스트하세요:

✅ 복사 버튼 테스트:

  • 특수문자가 포함된 게시물 제목에서 복사 버튼 클릭
  • AI 도구 링크 복사 테스트
  • 브라우저 콘솔에 오류가 없는지 확인

✅ NEW 배지 테스트:

  • 기존 브라우저에서 강제 새로고침 후 NEW 배지 확인
  • 새 브라우저에서 접속하여 일관성 확인
  • 스마트폰(크롬, 사파리)에서도 테스트

✅ 내 정보 로딩 테스트:

  • Firebase 인덱스 생성 완료 후 테스트
  • 로딩 시간이 3초 이내인지 확인
  • 댓글이 정상적으로 표시되는지 확인

🎉 기대 효과

✅ 복사 버튼

모든 경우에 안전하게 작동하며, 어떤 특수문자가 포함되어도 오류가 발생하지 않습니다.

✅ NEW 배지

모든 브라우저에서 일관되게 표시되며, 캐시 문제가 해결됩니다.

✅ 내 정보 로딩

로딩 시간이 10초 이상에서 2-3초로 단축됩니다.

❓ 문제 해결

NEW 배지가 여전히 안 보이는 경우:

  1. 개발자 도구 콘솔에서 clearAllCache() 실행
  2. 브라우저 캐시 완전 삭제
  3. Service Worker가 v1.1인지 확인: 
    navigator.serviceWorker.getRegistrations().then(regs => console.log(regs))

내 정보 로딩이 여전히 느린 경우:

  1. Firebase Console에서 인덱스 상태 확인 (빌드 중인지 확인)
  2. 브라우저 콘솔에서 "인덱스 필요" 오류 메시지 확인
  3. 오류가 있다면 Firebase가 제공하는 인덱스 생성 링크 클릭

복사 버튼 오류가 계속되는 경우:

  1. 브라우저 콘솔에서 정확한 오류 메시지 확인
  2. 수정 사항이 모두 적용되었는지 확인
  3. 특히 escapeHtml 함수가 추가되었는지 확인

수정 완료 후 Ctrl + Shift + R (강제 새로고침)을 권장합니다.

이 가이드는 ALL AI 사이트의 안정성과 사용자 경험 개선을 위해 제작되었습니다.