Lambda@Edge Nuxt.js에서 만든 정적 사이트를 S3 + CloudFront에서 호스팅하는 패턴 Nuxt.js에서 SSR을 사용하지 않는 정적 사이트를 생성하고 (nuxt generate) S3에서 저렴하게 호스팅하면 각 페이지에 대해 index.html 파일이 생성되지만 링크 URL은 index입니다. 일반 웹 서버에는 Apache의 경우 DocumentIndex, nginx의 경우 index와 같이 파일 이름이 생략되면 기본 파일 이름을 전달하는 설정이 있지만 상당한 동작이 필요합니... nuxt.jsCloudFrontS3Lambda@EdgeAWS Amazon Web Service 블로그가 버그되어 빠진 건 ~이미지를 리사이즈 한다~ 고마워요. 조속히 본제이지만 CloudFront와 Lambda@Edge를 이용하여 이미지를 크기 조정하는 방법을 채택하고 싶습니다. 이하의 블로그를 참고로, 리사이즈하는 곳까지는 구현할 수 있었습니다만, 가로폭과 세로폭에 null를 설정하고 싶다-라고 수정하고 있었는데, 게재되고 있는 코드에 버그가 있어 빠졌습니다. ↑를 넣어 확인하고 있었는데, 루프의 앞까지 height가 undefined... 람다CloudFrontLambda@EdgeAWS Lambda@Edge 소개 Lambda@Edge를 처음 사용하고 여러가지 당황하는 일이 많았기 때문에 조사한 것을 정리한다. 또, 매번 추가해 간다. Lambda@Edge는 CloudFront의 기능 중 하나로 CloudFront의 에지 서버에서 코드를 실행하는 Lambda 함수입니다. 사용자와 가까운 곳에서 코드를 실행하면 애플리케이션 성능이 향상됩니다. CloudFront 이벤트를 트리거로 코드를 실행합니다. 전술... 람다CloudFrontLambda@EdgeAWS Cloud Front에서 HSTS Preload 지원 이번에는 Lambda@Edge를 사용하여 CloudFront에 HSTS Preload를 도입해 보겠습니다. HSTS(Hypertext Strict Transport Security)는, 웹 서버가 가지는 응답 헤더의 일종으로, 「이 서버로 접속할 때는 반드시 HTTPS로 액세스 해 주세요」라고 하는 메세지를 Web 브라우저에 전하는 기능을 가지고 있습니다. 구체적으로는 Strict-Trans... hstsCloudFrontLambda@Edge Platform마다 응답이 다른 경우 CloudFront를 효율적으로 캐시 HIT시키는 방법 이번 Platform마다 응답이 다르다는 것은, iPhone, Android, (PC)마다 어플리케이션 서버가 다른 응답 돌려주는 경우를 상정한다. 애플리케이션 서버 측에서 UA를 판정하여 응답을 생성하고 있기 때문에 CloudFront에서 준비되어 있는 아래의 플래그만으로는 판정이 어렵다. 1. Lambda@Edge를 사용하여 UA를 다시 씁니다. 2. CloudFront Whitelist... CloudFrontLambda@Edge Serverless multi region 설정 (lambda@Edge region) 기존에 미리 서울 리전에 배포된 함수가 있어서, 처음에는 serverless.yml에 두 개의 리전을 설정할 수 있는 법을 찾아봤다. 하지만 cloudFormation없이 미리 만들어진 cloudFront를 이용해야 됐으므로 다른 방법을 찾아 떠났다.. 하지만 2-3일째 마땅한 방법을 찾지 못하였고 설상가상 배포를 위해선 sls deploy를 해야 되는데 그럼 미리 등록된 함수에 영향이 미쳤... lambdaLambda@EdgeserverlessLambda@Edge WebP를 보급시키려고 도입 시뮬레이터를 만들었는데 역시 WebP는 대단해 따라서 기존 웹 이미지를 WebP로 간단하게 시뮬레이션할 수 있는 도구를 만들었습니다. URL을 입력하면 이 느낌으로 보고서 페이지가 생성됩니다. 데이터의 경량화가 얼마나 충격적인지, 각 이미지의 화질이 어떻게 나올지 조사할 수 있다. 실제 보고는 다음과 같다. 확실히 자세히 보면 화질이 좀 떨어진다고 할 수 있다. 다만, 이 정도 화질을 낮추면 -7.58MB를 줄일 수 있다면 좋지 않을까요... Lambda@Edge고속화WebPVue.js AWS Lambda@Edge향천현으로부터의 방문을 차단하다 라고 답한 뒤 만일 이 조례가 통과된다면 경영자 자율행동의 일환으로 향천현에서 온 방문 블록을 진행할 가능성을 부정할 수 없다. 조례가 통과된 후 향천현의 방문이 기술적으로 가능한지 검증하기 위해 나는 이 글을 썼다. AWSLambda@EdgeIPinfoDB에 IP 주소를 묻고 RegionCode가 향천현을 차단하는 방법을 소개한다.AWS 자원의 조작은terraform,aws cli,Lamd... Lambda@Edge향천 현AWS Amazon CloudFront & Lambda@Edge응답 바디 변경 Amazon CloudFront의Lambda@EdgeHTTP 요청/응답에 임의의 시간에 Lambda를 추가하는 기능입니다. 그럼 이번에는 반응하는 HTML을 살짝 가공하려고 조사를 해봤어요. 예시적으로 실현된 문서는 여기에 있다. 추기: 이미 바디한테 맞았어.다음은 outdated 이에 따라 다음과 같은 제한이 있다. HTTP 응답 사용 시Lambda@Edge오리지널-response 트리거에... Lambda@EdgeAWS
Nuxt.js에서 만든 정적 사이트를 S3 + CloudFront에서 호스팅하는 패턴 Nuxt.js에서 SSR을 사용하지 않는 정적 사이트를 생성하고 (nuxt generate) S3에서 저렴하게 호스팅하면 각 페이지에 대해 index.html 파일이 생성되지만 링크 URL은 index입니다. 일반 웹 서버에는 Apache의 경우 DocumentIndex, nginx의 경우 index와 같이 파일 이름이 생략되면 기본 파일 이름을 전달하는 설정이 있지만 상당한 동작이 필요합니... nuxt.jsCloudFrontS3Lambda@EdgeAWS Amazon Web Service 블로그가 버그되어 빠진 건 ~이미지를 리사이즈 한다~ 고마워요. 조속히 본제이지만 CloudFront와 Lambda@Edge를 이용하여 이미지를 크기 조정하는 방법을 채택하고 싶습니다. 이하의 블로그를 참고로, 리사이즈하는 곳까지는 구현할 수 있었습니다만, 가로폭과 세로폭에 null를 설정하고 싶다-라고 수정하고 있었는데, 게재되고 있는 코드에 버그가 있어 빠졌습니다. ↑를 넣어 확인하고 있었는데, 루프의 앞까지 height가 undefined... 람다CloudFrontLambda@EdgeAWS Lambda@Edge 소개 Lambda@Edge를 처음 사용하고 여러가지 당황하는 일이 많았기 때문에 조사한 것을 정리한다. 또, 매번 추가해 간다. Lambda@Edge는 CloudFront의 기능 중 하나로 CloudFront의 에지 서버에서 코드를 실행하는 Lambda 함수입니다. 사용자와 가까운 곳에서 코드를 실행하면 애플리케이션 성능이 향상됩니다. CloudFront 이벤트를 트리거로 코드를 실행합니다. 전술... 람다CloudFrontLambda@EdgeAWS Cloud Front에서 HSTS Preload 지원 이번에는 Lambda@Edge를 사용하여 CloudFront에 HSTS Preload를 도입해 보겠습니다. HSTS(Hypertext Strict Transport Security)는, 웹 서버가 가지는 응답 헤더의 일종으로, 「이 서버로 접속할 때는 반드시 HTTPS로 액세스 해 주세요」라고 하는 메세지를 Web 브라우저에 전하는 기능을 가지고 있습니다. 구체적으로는 Strict-Trans... hstsCloudFrontLambda@Edge Platform마다 응답이 다른 경우 CloudFront를 효율적으로 캐시 HIT시키는 방법 이번 Platform마다 응답이 다르다는 것은, iPhone, Android, (PC)마다 어플리케이션 서버가 다른 응답 돌려주는 경우를 상정한다. 애플리케이션 서버 측에서 UA를 판정하여 응답을 생성하고 있기 때문에 CloudFront에서 준비되어 있는 아래의 플래그만으로는 판정이 어렵다. 1. Lambda@Edge를 사용하여 UA를 다시 씁니다. 2. CloudFront Whitelist... CloudFrontLambda@Edge Serverless multi region 설정 (lambda@Edge region) 기존에 미리 서울 리전에 배포된 함수가 있어서, 처음에는 serverless.yml에 두 개의 리전을 설정할 수 있는 법을 찾아봤다. 하지만 cloudFormation없이 미리 만들어진 cloudFront를 이용해야 됐으므로 다른 방법을 찾아 떠났다.. 하지만 2-3일째 마땅한 방법을 찾지 못하였고 설상가상 배포를 위해선 sls deploy를 해야 되는데 그럼 미리 등록된 함수에 영향이 미쳤... lambdaLambda@EdgeserverlessLambda@Edge WebP를 보급시키려고 도입 시뮬레이터를 만들었는데 역시 WebP는 대단해 따라서 기존 웹 이미지를 WebP로 간단하게 시뮬레이션할 수 있는 도구를 만들었습니다. URL을 입력하면 이 느낌으로 보고서 페이지가 생성됩니다. 데이터의 경량화가 얼마나 충격적인지, 각 이미지의 화질이 어떻게 나올지 조사할 수 있다. 실제 보고는 다음과 같다. 확실히 자세히 보면 화질이 좀 떨어진다고 할 수 있다. 다만, 이 정도 화질을 낮추면 -7.58MB를 줄일 수 있다면 좋지 않을까요... Lambda@Edge고속화WebPVue.js AWS Lambda@Edge향천현으로부터의 방문을 차단하다 라고 답한 뒤 만일 이 조례가 통과된다면 경영자 자율행동의 일환으로 향천현에서 온 방문 블록을 진행할 가능성을 부정할 수 없다. 조례가 통과된 후 향천현의 방문이 기술적으로 가능한지 검증하기 위해 나는 이 글을 썼다. AWSLambda@EdgeIPinfoDB에 IP 주소를 묻고 RegionCode가 향천현을 차단하는 방법을 소개한다.AWS 자원의 조작은terraform,aws cli,Lamd... Lambda@Edge향천 현AWS Amazon CloudFront & Lambda@Edge응답 바디 변경 Amazon CloudFront의Lambda@EdgeHTTP 요청/응답에 임의의 시간에 Lambda를 추가하는 기능입니다. 그럼 이번에는 반응하는 HTML을 살짝 가공하려고 조사를 해봤어요. 예시적으로 실현된 문서는 여기에 있다. 추기: 이미 바디한테 맞았어.다음은 outdated 이에 따라 다음과 같은 제한이 있다. HTTP 응답 사용 시Lambda@Edge오리지널-response 트리거에... Lambda@EdgeAWS