강의

멘토링

커뮤니티

Cộng đồng Hỏi & Đáp của Inflearn

Hình ảnh hồ sơ của ash
ash

câu hỏi đã được viết

지금 당장 데브옵스 AWS

프런트엔드 실행

s3 배포

Viết

·

368

0

안녕하세요 저는 next 로 배포를 하고있는데요.

.next 폴더로 되어있는것을

/** @type {import('next').NextConfig} */
const nextConfig = {
  distDir: 'build',
}

module.exports = nextConfig

이용해서 build 폴더가 생기게 했구요 .

이후

 

스크린샷 2024-01-28 오전 11.11.02.png

이후 s3 에 그대로 전부 올렸습니다.

그리고 s3 에 나와있는 정적 주소로 들어가게 되면 ,

스크린샷 2024-01-28 오전 11.12.15.png

이렇게 나오게 되는데 어디가 문제일까요 ?

aws

Câu trả lời 2

0

kookh09875453님의 프로필 이미지
kookh09875453
Người chia sẻ kiến thức

안녕하세요.

Next.js 는 해당 강의에서 다루지 않아서 설명을 드리기 어렵습니다.

아래내용은 gpt4 에게 질문한 내용인데요. 해당 내용을 먼저 테스트 해보시는 것을 추천드립니다.

감사합니다.


Next.js 애플리케이션 빌드:

  • Next.js 프로젝트의 루트 디렉토리에서 next buildnext export 명령어를 사용하여 정적 파일을 생성합니다.

  • next export 명령은 out 폴더에 정적 파일을 생성합니다.

0

안녕하세요, 인프런 AI 인턴입니다.
SJ님, S3에 정적 파일을 업로드한 후 404 Not Found 에러가 발생하는 상황에 대하여 답변 드리겠습니다.

404 에러는 업로드한 파일의 경로가 웹 서버에 맞지 않거나, 파일 자체가 없을 경우 발생합니다. Next.js의 경우 build 폴더 밑에 생성된 정적 파일들을 S3에 올릴 때 올바른 경로 설정이 필요합니다. 본문 내용으로 보았을 때, 몇 가지 가능한 문제를 점검해볼 수 있겠습니다.

  1. S3 버킷 설정: S3 버킷을 정적 웹사이트 호스팅으로 설정하였는지 확인해보세요. 이 설정을 통해 S3 버킷이 웹 사이트처럼 동작할 수 있습니다.

  2. index 문서 및 에러 문서: S3 버킷의 정적 웹사이트 호스팅 설정에서, 메인 페이지를 나타내는 ‘index 문서’를 설정해야 합니다. 일반적으로 Next.js의 경우 index.html 이 그 역할을 합니다.

  3. 파일 경로: 빌드된 파일들을 S3 버킷의 최상위가 아닌, 올바른 경로에 업로드하였는지 확인하십시오. Next.js는 out 폴더 또는 설정한 대로 build 폴더에 정적 파일을 생성합니다. 이 폴더 전체를 S3로 올리셔야 합니다.

  4. 파일 업로드 방법: 파일을 S3에 올릴 때, 필요한 메타데이터와 함께 업로드가 되었는지도 확인해야 합니다. 예를 들어, HTML, CSS, JS 파일은 올바른 Content-Type으로 설정되어야 하며, 디렉토리 구조가 변경되지 않도록 주의해야 합니다.

  5. 캐싱: S3나 CDN에서 캐싱된 오래된 버전의 사이트로 인해 발생할 수도 있으니, 캐시를 지우고 다시 시도해보시는 것도 한 방법입니다.

문제가 해결되지 않는 경우, build 폴더의 구조와 S3에 어떤 식으로 업로드하였는지, 그리고 사용하고 있는 정적 호스팅 설정을 자세히 살펴볼 필요가 있습니다.

Hình ảnh hồ sơ của ash
ash

câu hỏi đã được viết

Đặt câu hỏi