developer tip

.html 확장자가없는 S3 정적 페이지

optionbox 2021. 1. 7. 07:53
반응형

.html 확장자가없는 S3 정적 페이지


Amazon S3에서 정적 사이트를 제공 할 .html때 각 페이지 파일 확장자를 제거하는 방법이 궁금합니다 .

지금 나는 :

mysite.com/             # works fine, serves index.html
mysite.com/mypage.html  # works fine
mysite.com/mypage       # doesn't work

/mypage의 오류 :

404 Not Found

Code: NoSuchKey
Message: The specified key does not exist.
Key: mypage
RequestId: 1089D7A26EFED9AD
HostId: Ud8cFy8Zl1mJ+oFjFOmU1Xacq9+v70KuaJfOc4nFMEPhd66AkLhr4Pj5u0QH6Gog

나는 설정 시도 Content-Typetext/html따라, 이 게시물을 하지만 나를 위해 문제가 해결되지 않습니다.

S3 /mypage에서 파일을 제공하려면 어떻게해야 /mypage.html합니까?


방금이 문제가 발생했으며 솔루션을 공유하고 싶습니다.

당신은 파일의 메타 데이터 설정해야 Content-type하는을 text/html하고 제거하는 파일의 이름을 바꾸 .html말을.

이렇게하면 파일 확장자없이 모든 페이지에 접근 할 수 있습니다.


일반적으로 Amazon S3에서 깨끗한 URL을 생성하려면 다음을 수행 할 수 있습니다.

  1. 예를 들어 "깨끗한"이름으로 페이지 파일을 업로드 mypage하고 설정을로 Content-Type설정합니다 text/html(링크 한 게시물이 설명 됨). 확장자가 없도록 업로드하기 전에 시스템에서 파일 이름을 바꾸거나 업로드 후 S3에서 확장자없이 이름을 변경 해야합니다. S3의 파일 이름 에는 확장자가 없어야합니다 .

  2. "깨끗한"이름으로 폴더를 만들고 이름이 기본 색인 문서로 설정된 폴더에 페이지 파일을 업로드합니다 ( 예 :) index.html. 기본 색인 문서 이름이 무엇인지 확인해야합니다. 버킷을 웹 사이트로 구성 할 때 설정되지만 나중에 변경할 수 있습니다.

위의 작업을 수행 할 수없는 경우 이름 키를 사용하여 새 0 바이트 개체를 업로드 한 mypage다음 업로드 프로세스 중에 메타 데이터 Website Redirect Location의 값 mypage.html으로 키를 지정하여 페이지 리디렉션을 설정할 수 있습니다. Amazon S3 설명서의 웹 페이지 리디렉션 구성을 참조하십시오.

또한라는 새 객체에 파일을 복사 할 수 mypageContent-Type로 설정 text/html.


일부는 이미 말했듯이 파일 확장자를 삭제하고 다음 단계를 따르십시오.

  1. Amazon S3 버킷으로 이동합니다.
  2. 제대로 연결하려는 파일 옆의 확인란을 선택합니다.
  3. 오른쪽의 "속성"을 클릭하면 새 창이 표시됩니다. "개체 : 파일 이름"이라고 표시됩니다.
  4. 메타 데이터 탭을 클릭하고 기본값에서 "binary / octet-stream"을 변경합니다. 새 값은 "text / html"이어야합니다.
  5. 저장.

사람들이 말했듯이 html의 새 링크에 .html 파일 확장자가 더 이상 포함되지 않도록하십시오. 이것은 나를 위해 일했습니다.


폴더를 /mypage만들고 그 index.html안에 넣는 것이 저에게 효과적이지 않았습니다. 이는 Bucket의 "Index Document"설정이 다음으로 변경 되었기 때문인 것으로 밝혀졌습니다 myindex.html.

Bucket Properties --> Static Website Hosting --> Enable Website Hosting --> Index Document

이것은 실제로 모든 하위 폴더에도 적용되어 경로 /mypage/index.html있을 때 찾지 못했습니다 /mypage. /mypage/myindex.html대신 찾고있었습니다 .

간단히 myindex.html설정을로 다시 변경하면 index.html표준 폴더 구조가 작동합니다. myindex.html해당 설정이있는 모든 곳에서 파일 을 사용하는 것도 똑같이 작동했을 것이지만 실제 이득이없는 것은 혼란스러워 보였습니다.

난 여전히 설정 이유를 알고하지 않습니다 Content-Typetext/html작동하지 않음 - 그것은 그가 여러 곳에서 언급 한 바와 같이해야처럼 보인다.

어쨌든 Bucket Index Document과 모든 하위 폴더를을 사용하도록 변경하면 문제가 해결됩니다 index.html.


AWS CLI 사용 :

파일 이름에서 확장자를 제거하고 계정으로 AWS CLI를 설정했다고 가정하면 콘솔에서 다음 명령을 실행하여 파일의 메타 데이터를 설정할 수 있습니다.

aws s3 cp /path/to/file s3://yourwebsite.com --content-type 'text/html' --acl public-read

매우 간단하고 테스트 된 솔루션. :

  1. 파일 이름을 바꾸고 파일 이름에서 확장명 (.html)을 제거합니다. (예 : gallery.html을 갤러리로 변경).
  2. Edit Properties of File. Add Metadata key (Content type = text/html and content language = html).
  3. Save and test from browser url like websiteurl.com/gallery.

Another possible solution is to use Lambda@edge power, documentation reference here.


For those using collections I was able to prettify the links by adding an extra / character to the end of the

collections:
  my_collection:
   output:true
   permalink: /:collection/:path/

ReferenceURL : https://stackoverflow.com/questions/23463679/s3-static-pages-without-html-extension

반응형