{"id":339760,"date":"2022-10-15T15:00:06","date_gmt":"2022-10-15T15:00:06","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=339760"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=339760","title":{"rendered":"<span>\u041a\u0430\u043a \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442\u044c React \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e AWS S3 \u0438 CloudFront<\/span>"},"content":{"rendered":"<div><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<p>\u042d\u0442\u043e \u043f\u0435\u0440\u0432\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0441\u0442\u0430\u0442\u044c\u0438, \u0433\u0434\u0435 \u043c\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u0441\u0435\u0440\u0432\u0438\u0441\u044b AWS \u0438 \u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043c \u0440\u0443\u0447\u043d\u043e\u0435 \u0440\u0430\u0437\u0432\u0435\u0440\u0442\u044b\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u0412\u043e \u0432\u0442\u043e\u0440\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0432\u043e\u043f\u0440\u043e\u0441 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0437\u0430\u0446\u0438\u0438 \u0441\u0431\u043e\u0440\u043a\u0438 \u0438 \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u0438.<\/p>\n<p><strong>\u0412\u0430\u0436\u043d\u043e\u0435 \u0437\u0430\u043c\u0435\u0447\u0430\u043d\u0438\u0435:<\/strong>\u00a0\u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u043d\u0430\u0448\u0435\u0433\u043e \u0441\u0430\u0439\u0442\u0430 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0438\u0437 \u0441\u0435\u0431\u044f \u043d\u0430\u0431\u043e\u0440 \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0444\u0430\u0439\u043b\u043e\u0432, \u0442\u043e \u0435\u0441\u0442\u044c \u0443 \u043d\u0430\u0441 \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430 \u0432\u043e Frontend \u0447\u0430\u0441\u0442\u0438.<\/p>\n<p>\u0412\u0430\u043c \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u043b\u0435\u0437\u043d\u0430 \u044d\u0442\u0430 \u0441\u0442\u0430\u0442\u044c\u044f \u0435\u0441\u043b\u0438 \u0432\u044b \u043f\u0438\u0448\u0438\u0442\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u0431\u0430\u0437\u0435 Create React App \u0438\u043b\u0438 Next.js \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 Static Export.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 Server Side Rendering (SSR) \u0438\u043b\u0438 Incremental Static Regeneration (ISR) \u2013 \u0432 \u0432\u0430\u0448\u0435\u0439 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043d\u0430\u043b\u0438\u0447\u0438\u0435 \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u0438 \u043a\u0430\u043a \u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0435 \u0434\u0430\u043d\u043d\u0430\u044f \u0441\u0442\u0430\u0442\u044c\u044f \u0432\u0430\u043c \u043d\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442.<\/p>\n<h3>\u0427\u0442\u043e \u043c\u044b \u0441\u0434\u0435\u043b\u0430\u0435\u043c<\/h3>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435-\u043f\u0440\u0438\u043c\u0435\u0440 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 Next.js, \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u043e\u0431\u043b\u0430\u0447\u043d\u044b\u0435 \u0441\u0435\u0440\u0432\u0438\u0441\u044b Amazon (AWS), \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u0438\u0437\u0430\u0446\u0438\u044e \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u043c\u0435\u043d\u0438.<\/p>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0440\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u0435 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0438 \u0438 \u0441\u0435\u0440\u0432\u0438\u0441\u044b:<\/p>\n<ul>\n<li>\n<p><strong>Next.js<\/strong>\u00a0\u2013 \u043c\u0435\u0442\u0430-\u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043d\u0430 \u0431\u0430\u0437\u0435\u00a0React.js\u00a0<a href=\"https:\/\/nextjs.org\/\" rel=\"noopener noreferrer nofollow\"><u>https:\/\/nextjs.org<\/u><\/a>, \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p><strong>Amazon S3<\/strong>\u00a0\u2013 \u043e\u0431\u043b\u0430\u0447\u043d\u043e\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u043e\u0435 \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435\u00a0<a href=\"https:\/\/aws.amazon.com\/s3\/\" rel=\"noopener noreferrer nofollow\"><u>https:\/\/aws.amazon.com\/s3<\/u><\/a>, \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0432\u0435\u0431 \u0445\u043e\u0441\u0442\u0438\u043d\u0433\u0430.<\/p>\n<\/li>\n<li>\n<p><strong>Amazon CloudFront<\/strong>\u00a0\u2013\u00a0\u0432\u0435\u0431-\u0441\u0435\u0440\u0432\u0438\u0441 \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u0438 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430\u00a0<a href=\"https:\/\/aws.amazon.com\/cloudfront\/\" rel=\"noopener noreferrer nofollow\"><u>https:\/\/aws.amazon.com\/cloudfront<\/u><\/a>, \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0432\u0435\u0431 \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u0438 CDN.<\/p>\n<\/li>\n<li>\n<p><strong>AWS Lambda@Edge<\/strong>\u00a0\u2013 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0431\u0435\u0441\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0439 \u0432\u044b\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0439\u00a0<a href=\"https:\/\/aws.amazon.com\/lambda\/edge\/\" rel=\"noopener noreferrer nofollow\"><u>https:\/\/aws.amazon.com\/lambda\/edge<\/u><\/a>, \u0434\u043b\u044f \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0435\u043d\u0438\u044f \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u0438\u0437\u0430\u0446\u0438\u0438 \u0432 \u043c\u043d\u043e\u0433\u043e\u0441\u0442\u0440\u0430\u043d\u0438\u0447\u043d\u043e\u043c Next.js \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438.<\/p>\n<\/li>\n<li>\n<p><strong>Amazon Route 53<\/strong>\u00a0\u2013 \u0441\u043b\u0443\u0436\u0431\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0434\u043e\u043c\u0435\u043d\u043d\u044b\u0445 \u0438\u043c\u0435\u043d\u00a0<a href=\"https:\/\/aws.amazon.com\/route53\/\" rel=\"noopener noreferrer nofollow\"><u>https:\/\/aws.amazon.com\/route53<\/u><\/a>, \u0434\u043b\u044f \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0434\u043e\u043c\u0435\u043d\u043d\u044b\u043c \u0438\u043c\u0435\u043d\u0435\u043c.<\/p>\n<\/li>\n<\/ul>\n<h4>\u041a\u0430\u043a \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0438\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/h4>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/a3f\/39b\/85e\/a3f39b85e5bba71e94ed7fbfd4b2020b.webp\" width=\"2702\" height=\"1390\"\/><figcaption><\/figcaption><\/figure>\n<ol>\n<li>\n<p>\u0417\u0430\u043f\u0440\u043e\u0441 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043f\u043e\u043f\u0430\u0434\u0430\u0435\u0442 \u0432 CloudFront (CDN).<\/p>\n<ul>\n<li>\n<p>\u0415\u0441\u043b\u0438 \u043e\u0442\u0432\u0435\u0442 \u043d\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u0437\u0430\u043f\u0440\u043e\u0441 \u0443\u0436\u0435 \u0437\u0430\u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d \u0432 CloudFront, \u0442\u043e\u00a0CloudFront \u0441\u0440\u0430\u0437\u0443 \u0432\u0435\u0440\u043d\u0435\u0442 \u043e\u0442\u0432\u0435\u0442 \u0438 \u0437\u0430\u043f\u0440\u043e\u0441 \u043d\u0435 \u043f\u043e\u0439\u0434\u0435\u0442 \u0434\u0430\u043b\u044c\u0448\u0435 \u043f\u043e \u0441\u0445\u0435\u043c\u0435.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>(\u0448\u0430\u0433 \u0434\u043b\u044f Next.js)<\/strong>\u00a0\u0417\u0430\u043f\u0440\u043e\u0441 \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432 Lambda@Edge (\u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0442\u0430\u043a\u0436\u0435 \u043a\u0430\u043a \u0438 CloudFront \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f Edge \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u043c, \u0442.\u0435. \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u044f\u0435\u0442\u0441\u044f \u043d\u0430 \u0432\u0441\u0435 \u0442\u043e\u0447\u043a\u0438 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u044f \u0441\u0435\u0442\u0438 \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u0438). \u0412 \u044d\u0442\u043e\u043c \u0441\u0435\u0440\u0432\u0438\u0441\u0435 \u043c\u044b \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c \u043a\u0430\u043a\u043e\u0439 \u0444\u0430\u0439\u043b \u0438\u0437 S3 bucket \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0432\u0435\u0440\u043d\u0443\u0442\u044c \u0432 \u043e\u0442\u0432\u0435\u0442 \u043d\u0430 \u0437\u0430\u043f\u0440\u043e\u0441.<\/p>\n<\/li>\n<li>\n<p>\u041c\u043e\u0434\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0438\u043b\u0438 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b\u044c\u043d\u044b\u0439 (\u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0435\u0433\u043e \u0448\u0430\u0433\u0430) URL \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432 S3 bucket. \u0413\u0434\u0435 \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u043b\u0438\u0431\u043e \u0444\u0430\u0439\u043b \u043b\u0438\u0431\u043e \u043e\u0448\u0438\u0431\u043a\u0443 \u043e \u0442\u043e\u043c \u0447\u0442\u043e \u0442\u0430\u043a\u043e\u0433\u043e \u0444\u0430\u0439\u043b\u0430 \u043d\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442.<\/p>\n<\/li>\n<li>\n<p>\u0424\u0430\u0439\u043b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 CloudFront, \u0433\u0434\u0435 \u043a\u044d\u0448\u0438\u0440\u0443\u0435\u0442\u0441\u044f. \u041e\u0448\u0438\u0431\u043a\u0438 \u043d\u0435 \u043a\u044d\u0448\u0438\u0440\u0443\u044e\u0442\u0441\u044f.<\/p>\n<\/li>\n<li>\n<p>CloudFront \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043e\u0442\u0432\u0435\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e. \u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 CloudFront \u0434\u0435\u043b\u0430\u0435\u0442 \u0437\u0430\u043f\u0440\u043e\u0441 \u043a S3 bucket \u043d\u0430 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0435 \u0437\u0430\u0440\u0430\u043d\u0435\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0433\u043e \u0444\u0430\u0439\u043b\u0430, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u043a \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 404.html.<\/p>\n<\/li>\n<\/ol>\n<h3>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 Next.js \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/h3>\n<p>\u041f\u0440\u0435\u0434\u0432\u0430\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0443 \u0432\u0430\u0441 \u0443\u0436\u0435 \u0434\u043e\u043b\u0436\u043d\u0430 \u0431\u044b\u0442\u044c \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u0430\u00a0<a href=\"https:\/\/nodejs.org\/en\/\" rel=\"noopener noreferrer nofollow\"><u>Node.js<\/u><\/a><\/p>\n<p>\u041c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a Next.js \u0441 Typescript \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0435\u0439. \u0427\u0442\u043e\u0431\u044b \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430\u0431\u0435\u0440\u0438\u0442\u0435 \u0432 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b\u0435:<\/p>\n<pre><code class=\"bash\">npx create-next-app@latest --typescript # \u0438\u043b\u0438 \u0435\u0441\u043b\u0438 \u0432\u044b \u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435\u0441\u044c yarn yarn create next-app --typescript  ? What is your project named? \u203a my-awesome-app cd my-awesome-app<\/code><\/pre>\n<p>\u0427\u0442\u043e\u0431\u044b \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c dev \u0441\u0435\u0440\u0432\u0435\u0440 \u0441 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c:<\/p>\n<pre><code class=\"bash\">npm run dev # \u0438\u043b\u0438 \u0435\u0441\u043b\u0438 \u0432\u044b \u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435\u0441\u044c yarn yarn dev<\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u043f\u0435\u0440\u0435\u0439\u0434\u0435\u0442\u0435 \u043f\u043e \u0430\u0434\u0440\u0435\u0441\u0443\u00a0<a href=\"http:\/\/localhost:3000\/\" rel=\"noopener noreferrer nofollow\"><u>http:\/\/localhost:3000<\/u><\/a>\u00a0\u0432\u044b \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0432\u0430\u0448\u0435 \u043d\u043e\u0432\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/0e2\/354\/a89\/0e2354a895b50266944060303397deac.webp\" width=\"2316\" height=\"2040\"\/><figcaption><\/figcaption><\/figure>\n<h4>\u0414\u043e\u0431\u0430\u0432\u0438\u043c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/h4>\n<p>\u0414\u043b\u044f \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0443\u0431\u0435\u0434\u0438\u0442\u044c\u0441\u044f \u0447\u0442\u043e \u0440\u043e\u0443\u0442\u0438\u043d\u0433 \u0432 \u043d\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043a\u0430\u043a \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u043e\u0434\u043d\u0443 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0443\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043d\u043e\u0432\u044b\u0439 \u0444\u0430\u0439\u043b \u00a0<code>pages\/about.tsx<\/code>, \u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043a\u043e\u0434:<\/p>\n<pre><code class=\"javascript\">\/\/ \u043f\u0440\u043e\u0441\u0442\u043e \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u0435\u0441\u044f \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u043c\u0438 \u0441\u0442\u0438\u043b\u044f\u043c\u0438 \u0438\u0437 \u0448\u0430\u0431\u043b\u043e\u043d\u0430 import styles from '..\/styles\/Home.module.css';  const About = () => {   return (     &lt;div className={styles.container}>       &lt;main className={styles.main}>         &lt;h1 className={styles.title}>\u041e \u043f\u0440\u043e\u0435\u043a\u0442\u0435&lt;\/h1>       &lt;\/main>     &lt;\/div>   ); };  export default About;<\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u043f\u043e \u0430\u0434\u0440\u0435\u0441\u0443\u00a0<a href=\"http:\/\/localhost:3000\/about\" rel=\"noopener noreferrer nofollow\"><u>http:\/\/localhost:3000\/about<\/u><\/a>\u00a0\u0443 \u0432\u0430\u0441 \u0431\u0443\u0434\u0435\u0442 \u043d\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/74e\/2e9\/4ad\/74e2e94ad406b7c7d46f2af4e582385e.webp\" width=\"2316\" height=\"2040\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041c\u044b \u0442\u0430\u043a\u0436\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u043c \u043d\u0430\u0448\u0443 \u0434\u043e\u043c\u0430\u0448\u043d\u044e\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443, \u0443\u043f\u0440\u043e\u0441\u0442\u0438\u0432 \u0435\u0435 \u0438 \u0434\u043e\u0431\u0430\u0432\u0438\u0432 \u0441\u0441\u044b\u043b\u043a\u0443 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443\u00a0<code>\/about<\/code>.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u043c \u043a\u043e\u0434 \u0432 \u0444\u0430\u0439\u043b\u0435\u00a0<code>pages\/index.tsx<\/code>\u00a0, \u043f\u043e\u043f\u0443\u0442\u043d\u043e \u0443\u0431\u0435\u0440\u0435\u043c \u043b\u0438\u0448\u043d\u0435\u0435.<\/p>\n<pre><code class=\"typescript\">\/\/ ... const Home: NextPage = () => {   return (     \/\/ ...     &lt;p className={styles.description}>       &lt;Link href=\"\/about\">         &lt;a>\u041e \u043f\u0440\u043e\u0435\u043a\u0442\u0435 &amp;rarr;&lt;\/a>       &lt;\/Link>     &lt;\/p>     \/\/ ...   ); }; \/\/ ...<\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/397\/f31\/f15\/397f31f1584af550a8d14afe9884133d.webp\" width=\"2388\" height=\"2224\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0414\u0430\u043b\u044c\u0448\u0435 \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0441\u043e\u0431\u0440\u0430\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u043a\u0441\u043f\u043e\u0440\u0442 \u0432 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u0445 Next.js \u0438\u043b\u0438 \u0432 \u0431\u043e\u043b\u0435\u0435 \u043e\u0431\u0449\u0435\u0439 \u0444\u043e\u0440\u043c\u0443\u043b\u0438\u0440\u043e\u0432\u043a\u0435: \u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0441\u0442\u0438 Static Site Generation.<\/p>\n<pre><code class=\"bash\">npm run build # \u0438\u043b\u0438 \u0435\u0441\u043b\u0438 \u0432\u044b \u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435\u0441\u044c yarn yarn build # \u044d\u043a\u0441\u043f\u043e\u0440\u0442 \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0444\u0430\u0439\u043b\u043e\u0432 npx next export<\/code><\/pre>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0447\u0435\u0433\u043e \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>out<\/code>\u00a0\u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442\u043e\u0432 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u043c\u0435\u0442\u044c \u0444\u0430\u0439\u043b\u044b \u0434\u043b\u044f \u043d\u0430\u0448\u0435\u0433\u043e \u043c\u043d\u043e\u0433\u043e\u0441\u0442\u0440\u0430\u043d\u0438\u0447\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/440\/4b4\/ede\/4404b4ede0062322dc6f5011d869edfd.webp\" width=\"590\" height=\"410\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041d\u0430 \u044d\u0442\u043e\u043c \u043c\u044b \u0437\u0430\u043a\u0430\u043d\u0447\u0438\u0432\u0430\u0435\u043c \u0440\u0430\u0431\u043e\u0442\u0443 \u043d\u0430\u0434 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c.<\/p>\n<h3>\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u00a0AWS S3<\/h3>\n<p>\u041a\u0430\u043a \u0443\u0436\u0435 \u0431\u044b\u043b\u043e \u0441\u043a\u0430\u0437\u0430\u043d\u043e \u0440\u0430\u043d\u0435\u0435 \u0441\u0435\u0440\u0432\u0438\u0441 AWS S3 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u0444\u0430\u0439\u043b\u043e\u0432 \u043d\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<p>\u0414\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u0440\u0430\u0431\u043e\u0442\u044b \u0437\u0430\u043b\u043e\u0433\u0438\u043d\u044c\u0442\u0435\u0441\u044c \u0432\u00a0<a href=\"https:\/\/console.aws.amazon.com\/console\" rel=\"noopener noreferrer nofollow\"><u>AWS Console<\/u><\/a>\u00a0\u0438 \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b Amazon S3.<\/p>\n<p>\u0414\u0430\u043b\u0435\u0435 \u043d\u0430\u0436\u043c\u0438\u0442\u0435 \u043d\u0430\u00a0<code>Create bucket<\/code>\u00a0\u0438 \u0438 \u0443\u043a\u0430\u0436\u0438\u0442\u0435 \u0438\u043c\u044f (Bucket name)<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/194\/fa3\/e1f\/194fa3e1f5d1fa378499f5a804dd29ec.webp\" width=\"1630\" height=\"710\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412\u0441\u0435 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043c\u043e\u0436\u043d\u043e \u043e\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e.<\/p>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f S3 bucket, \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u0432 \u043d\u0435\u0433\u043e \u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u0435 \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442\u044b \u0441\u0431\u043e\u0440\u043a\u0438 \u0432\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/486\/509\/fe8\/486509fe885b345024f73fd13a293497.webp\" width=\"1788\" height=\"942\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0415\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435 \u0447\u0442\u043e \u043d\u0430\u043c \u043e\u0441\u0442\u0430\u043b\u043e\u0441\u044c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0441 S3 \u044d\u0442\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0444\u0430\u0439\u043b\u0430\u043c \u0438\u0437 \u0434\u0440\u0443\u0433\u0438\u0445 \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u0432, \u043d\u043e \u0434\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0442\u0430\u043a\u043e\u0439 \u0441\u0435\u0440\u0432\u0438\u0441-\u043f\u043e\u0442\u0440\u0435\u0431\u0438\u0442\u0435\u043b\u044c.<\/p>\n<h3>\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u00a0AWS CloudFront<\/h3>\n<p>\u0412\u0441\u0435 \u0442\u0430\u043a\u0436\u0435 \u043e\u0441\u0442\u0430\u0432\u0430\u044f\u0441\u044c \u0432 AWS Console, \u043d\u0430\u0431\u0435\u0440\u0438\u0442\u0435 \u0432 \u043f\u043e\u0438\u0441\u043a\u0435\u00a0<code>CloudFront<\/code>\u00a0, \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u043a \u0441\u0435\u0440\u0432\u0438\u0441\u0443 \u0438 \u0432 \u043f\u043e\u044f\u0432\u0438\u0432\u0448\u0435\u043c\u0441\u044f \u043e\u043a\u043d\u0435 \u043d\u0430\u0436\u043c\u0438\u0442\u0435 \u043a\u043d\u043e\u043f\u043a\u0443\u00a0<code>Create distribution<\/code>.<\/p>\n<ul>\n<li>\n<p>\u0412 \u043f\u043e\u043b\u0435\u00a0<code>Origin domain<\/code>\u00a0\u0432\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0438\u0437 \u0441\u043f\u0438\u0441\u043a\u0430 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0439 \u0440\u0430\u043d\u0435\u0435 S3 bucket.<\/p>\n<\/li>\n<li>\n<p>\u0412 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<code>Origin access<\/code>\u00a0\u0432\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u00a0<code>Origin access control settings<\/code>. \u042d\u0442\u043e\u0442 \u0440\u0435\u0436\u0438\u043c \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u0442 \u043d\u0430\u043c \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u043a \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0443 S3 \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u043e\u0434\u043d\u043e\u0433\u043e \u0441\u0435\u0440\u0432\u0438\u0441\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u043c \u0431\u0443\u0434\u0435\u0442 \u044f\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u043d\u0430\u0448\u0430 CloudFront \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0436\u043c\u0438\u0442\u0435 \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0443\u00a0<code>Create control setting<\/code>\u00a0\u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u0434\u043e\u0441\u0442\u0443\u043f\u0430. \u041a\u0430\u043a \u0443\u043a\u0430\u0437\u0430\u043d\u043e \u0432 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0438\u00a0<code>You must update the S3 bucket policy<\/code>\u00a0\u043c\u044b \u0435\u0449\u0435 \u0432\u0435\u0440\u043d\u0435\u043c\u0441\u044f \u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043d\u0430\u0448\u0435\u0433\u043e CloudFront Distribution, \u043f\u043e\u0441\u043b\u0435 \u0435\u0433\u043e \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f, \u0447\u0442\u043e\u0431\u044b \u0437\u0430\u043a\u043e\u043d\u0447\u0438\u0442\u044c \u0448\u0430\u0433\u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0430.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/0eb\/47e\/088\/0eb47e0886852602e602a4b9b605adb4.webp\" width=\"1622\" height=\"1654\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041d\u0438\u0436\u0435, \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<code>Default cache behavior<\/code>:<\/p>\n<ul>\n<li>\n<p>\u0412\u043a\u043b\u044e\u0447\u0438\u043c \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u0441\u0436\u0430\u0442\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445. CloudFront \u0431\u0443\u0434\u0435\u0442 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0441\u0436\u0438\u043c\u0430\u0442\u044c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b, \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c\u044b\u0435 \u0438\u0437 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u0430 (\u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 S3 bucket), \u043f\u0435\u0440\u0435\u0434 \u0438\u0445 \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u043e\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e. CloudFront \u0441\u0436\u0438\u043c\u0430\u0435\u0442 \u0444\u0430\u0439\u043b\u044b \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0442\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u0435\u0441\u043b\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u044d\u0442\u043e, \u043a\u0430\u043a \u0443\u043a\u0430\u0437\u0430\u043d\u043e \u0432 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0435 Accept-Encoding \u0432 \u0437\u0430\u043f\u0440\u043e\u0441\u0435.<\/p>\n<\/li>\n<li>\n<p>\u0412\u044b\u0431\u0435\u0440\u0435\u043c \u043e\u043f\u0446\u0438\u044e\u00a0<code>Redirect HTTP to HTTPS<\/code>\u00a0\u0434\u043b\u044f \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u043d\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u0443 HTTPS. \u0418 \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441 \u0435\u0441\u043b\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8f1\/e54\/a41\/8f1e54a410dcbe637fccb99a0ade6dd1.webp\" width=\"1624\" height=\"532\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412\u0441\u0435 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043e\u0441\u0442\u0430\u0432\u0438\u043c \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0438 \u043d\u0430\u0436\u043c\u0435\u043c \u043a\u043d\u043e\u043f\u043a\u0443 \u0441\u043e\u0437\u0434\u0430\u0442\u044c.<\/p>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043e\u0442\u0432\u0435\u0442\u0430 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e:<\/p>\n<ul>\n<li>\n<p><strong>Default root object<\/strong>\u00a0\u2013\u00a0\u0431\u0443\u0434\u0435\u043c \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0442\u044c\u00a0<code>index.html<\/code><\/p>\n<\/li>\n<li>\n<p><strong>Error pages<\/strong>\u00a0(\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043e\u0448\u0438\u0431\u043e\u043a) \u2013\u00a0\u0431\u0443\u0434\u0435\u043c \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0442\u044c\u00a0<code>404.html<\/code>\u00a0\u0434\u043b\u044f Next.js \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438\u043b\u0438 \u0432\u0441\u0435 \u0442\u043e\u0442 \u0436\u0435\u00a0<code>index.html<\/code>, \u0435\u0441\u043b\u0438 \u0432\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u043e \u043d\u0430 \u0431\u0430\u0437\u0435 Create React App, \u0438 \u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0438\u043c\u0435\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u0439 \u0440\u043e\u0443\u0442\u0438\u043d\u0433.<\/p>\n<\/li>\n<\/ul>\n<p>\u0414\u043b\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438\u00a0<strong>Default root object<\/strong>\u00a0\u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0432\u0430\u0448\u0435\u0433\u043e CloudFront Distribution \u21d2 General \u0438 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<code>Settings<\/code>\u00a0\u043d\u0430\u0436\u043c\u0438\u0442\u0435 \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0443\u00a0<code>Edit<\/code>. \u0417\u0430\u0442\u0435\u043c \u0443\u043a\u0430\u0436\u0438\u0442\u0435 \u0432 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0435\u043c \u0440\u0430\u0437\u0434\u0435\u043b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u00a0<code>index.html<\/code>\u00a0\u0438 \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/9ad\/52a\/677\/9ad52a6776d736cf0a9e820970dc6e00.webp\" width=\"1628\" height=\"212\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0414\u043b\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446 \u043e\u0448\u0438\u0431\u043e\u043a \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u043d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0443\u00a0<strong>Error pages<\/strong>\u00a0\u0438 \u043d\u0430\u0436\u043c\u0438\u0442\u0435 \u043a\u043d\u043e\u043f\u043a\u0443\u00a0<code>Create error page response<\/code>. \u0421\u043e\u0437\u0434\u0430\u0439\u0442\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438 \u0434\u043b\u044f \u043e\u0448\u0438\u0431\u043e\u043a 404 \u0438 403 \u043a\u0430\u043a \u0443\u043a\u0430\u0437\u0430\u043d\u043e \u043d\u0430 \u0440\u0438\u0441\u0443\u043d\u043a\u0435 \u043d\u0438\u0436\u0435:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/066\/4a2\/014\/0664a2014b721f55400ac6f501937fdd.webp\" width=\"1626\" height=\"1214\"\/><figcaption><\/figcaption><\/figure>\n<hr\/>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0447\u0430\u043d\u0438\u0435 (\u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f CRA):<\/strong>\u00a0\u0415\u0441\u043b\u0438 \u0432\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u043e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e Create React App \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0443\u044e \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u044e (\u0434\u043b\u044f \u043e\u0448\u0438\u0431\u043e\u043a 404 \u0438 403):<\/p>\n<ul>\n<li>\n<p>Response page path:\u00a0<strong>\/index.html<\/strong><\/p>\n<\/li>\n<li>\n<p>HTTP Response code:\u00a0<strong>200: OK<\/strong><\/p>\n<\/li>\n<\/ul>\n<p>\u0412\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u0442 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u0440\u043e\u0443\u0442\u0438\u043d\u0433 \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0432 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u043c \u043a\u043e\u0434\u0435 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435.<\/p>\n<hr\/>\n<p>\u0415\u0441\u043b\u0438 \u043f\u043e\u0441\u043b\u0435 \u0432\u0441\u0435\u0445 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u043f\u043e\u0434\u043e\u0436\u0434\u0430\u0442\u044c \u043a\u043e\u0433\u0434\u0430 CloudFront Distribution \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442, \u0442\u043e \u043f\u0435\u0440\u0435\u0439\u0434\u044f \u043f\u043e \u0441\u0441\u044b\u043b\u043a\u0435\u00a0<strong>Distribution domain name<\/strong>\u00a0\u0432\u044b \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u00ab\u0412 \u0434\u043e\u0441\u0442\u0443\u043f\u0435 \u043e\u0442\u043a\u0430\u0437\u0430\u043d\u043e\u00bb.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d37\/dee\/e83\/d37deee83336126c0632bb8b8837116e.webp\" width=\"1578\" height=\"422\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0427\u0442\u043e\u0431\u044b \u0440\u0430\u0437\u0440\u0435\u0448\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0444\u0430\u0439\u043b\u0430\u043c S3 bucket \u0438\u0437 \u043d\u0430\u0448\u0435\u0433\u043e CloudFront distribution \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0430.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0437\u0430\u0439\u0434\u0435\u043c\u00a0<strong>CloudFront \u21d2 Distributions \u21d2 \u0412\u0430\u0448\u0430 \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u044f<\/strong>, \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0435\u00a0<strong>Origins<\/strong>\u00a0\u0432\u044b\u0431\u0435\u0440\u0435\u043c \u043d\u0430\u0448 S3 origin \u0438 \u043d\u0430\u0436\u043c\u0435\u043c\u00a0<code>Edit<\/code>.<\/p>\n<p>\u0412 \u043e\u0442\u043a\u0440\u044b\u0432\u0448\u0435\u043c\u0441\u044f \u043e\u043a\u043d\u0435 \u0441\u043a\u043e\u043f\u0438\u0440\u0443\u0435\u043c \u043f\u043e\u043b\u0438\u0442\u0438\u043a\u0443 \u0434\u043e\u0441\u0442\u0443\u043f\u0430\u00a0<strong>Origin access \u21d2<\/strong>\u00a0<code>Copy policy<\/code>\u00a0\u0438 \u043f\u0435\u0440\u0435\u0439\u0434\u0435\u043c \u043a \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c S3 bucket\u00a0<code>Go to S3 bucket permissions<\/code>.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2fd\/034\/cff\/2fd034cff17d2fa338d3848c1b35556d.webp\" width=\"1632\" height=\"450\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0414\u0430\u043b\u0435\u0435 \u043e\u0442\u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u0443\u0435\u043c \u043f\u043e\u043b\u0438\u0442\u0438\u043a\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u0434\u043b\u044f S3 bucket\u00a0<strong>Bucket policy \u21d2 Edit<\/strong>. \u0412\u0441\u0442\u0430\u0432\u0438\u043c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0443\u044e \u043f\u043e\u043b\u0438\u0442\u0438\u043a\u0443 (\u0438\u043d\u043e\u0433\u0434\u0430 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0443\u0431\u0440\u0430\u0442\u044c \u043b\u0438\u0448\u043d\u0438\u0435 \u043f\u0440\u043e\u0431\u0435\u043b\u044b \u0432 JSON, \u044d\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0432 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0435 \u043a\u043e\u0434\u0430 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e Prettier).<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/676\/d9d\/0a1\/676d9d0a1a61c425acb5d7953cac93a1.webp\" width=\"2262\" height=\"1674\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0447\u0435\u0433\u043e \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u043c \u043f\u043e\u043b\u0438\u0442\u0438\u043a\u0438 \u0438 \u0441\u043d\u043e\u0432\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0440\u0430\u0431\u043e\u0442\u043e\u0441\u043f\u043e\u0441\u043e\u0431\u043d\u043e\u0441\u0442\u044c \u0441\u0430\u0439\u0442\u0430. \u0412\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u0438\u043c\u0435\u0442\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0443\u0432\u0438\u0434\u0435\u0442\u044c \u0434\u043e\u043c\u0430\u0448\u043d\u044e\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/fc4\/00b\/17a\/fc400b17a32050b0d6ed5a9d5c3a5d28.webp\" width=\"2462\" height=\"2226\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u043f\u0435\u0440\u0435\u0439\u0434\u0435\u0442\u0435 \u043f\u043e \u0441\u0441\u044b\u043b\u043a\u0435\u00a0<strong>\u00abO \u043f\u0440\u043e\u0435\u043a\u0442\u0435\u00bb<\/strong>\u00a0\u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443\u00a0<code>\/about<\/code>\u00a0\u2013\u00a0\u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u0439 \u0440\u043e\u0443\u0442\u0438\u043d\u0433 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443\u00a0<strong>about<\/strong>\u00a0\u0438\u043b\u0438 \u0437\u0430\u0439\u0434\u0435\u0442\u0435 \u043f\u043e \u043f\u0440\u044f\u043c\u043e\u0439 \u0441\u0441\u044b\u043b\u043a\u0435\u00a0<code>\/about<\/code>\u00a0\u2013 \u0442\u043e \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u043e\u0448\u0438\u0431\u043a\u0438\u00a0<strong>404.<\/strong>\u00a0\u041e\u0434\u043d\u0430\u043a\u043e \u0435\u0441\u043b\u0438 \u0437\u0430\u0439\u0434\u0435\u0442\u0435 \u043f\u043e \u0441\u0441\u044b\u043b\u043a\u0435\u00a0<code>\/about.html<\/code>\u00a0\u2013 \u0441\u043d\u043e\u0432\u0430 \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443\u00a0<strong>about<\/strong>.<\/p>\n<p>\u0412\u044b \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0443\u0436\u0435 \u0434\u043e\u0433\u0430\u0434\u0430\u043b\u0438\u0441\u044c \u0447\u0442\u043e \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441\u044b \u0432\u0438\u0434\u0430\u00a0<code>about<\/code>\u00a0\u0432\u00a0<code>\/about.html<\/code>.<\/p>\n<p>\u0412\u044b\u0448\u0435\u0441\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u0435 \u043a\u0430\u0441\u0430\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043c\u043d\u043e\u0433\u043e\u0441\u0442\u0440\u0430\u043d\u0438\u0447\u043d\u044b\u0445 \u0441\u0430\u0439\u0442\u043e\u0432, \u0435\u0441\u043b\u0438 \u0436\u0435 \u0432\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 Create React App \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u0440\u043e\u0434\u0430 Single Page Application (SPA), \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u0440\u0430\u0437\u0434\u0435\u043b \u0432\u0430\u043c \u043d\u0435 \u043d\u0443\u0436\u0435\u043d, \u043f\u0440\u043e\u043f\u0443\u0441\u0442\u0438\u0442\u0435 \u0435\u0433\u043e.<\/p>\n<h3>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435\u00a0AWS\u00a0Lambda@Edge<\/h3>\n<p><strong>(\u0434\u043b\u044f Next.js \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f)<\/strong><\/p>\n<p>\u041a\u0430\u043a \u0443\u0436\u0435 \u0431\u044b\u043b\u043e \u0441\u043a\u0430\u0437\u0430\u043d\u043e, AWS Lambda@Edge \u044d\u0442\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0431\u0435\u0441\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0439 \u0432\u044b\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0439, \u043a\u0430\u043a \u0432\u0438\u0434\u043d\u043e \u0438\u0437 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f, \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f Edge \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u043c.<\/p>\n<p>Lambda@Edge \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d\u044b \u043a CloudFront \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u0438 \u0438 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u044f\u044e\u0442\u0441\u044f \u043d\u0430 \u0432\u0441\u0435 \u0440\u0435\u0433\u0438\u043e\u043d\u044b \u0438 \u0442\u043e\u0447\u043a\u0438 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u044f \u0432\u0430\u0448\u0435\u0433\u043e CloudFront.<\/p>\n<p>\u042d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442 \u0447\u0442\u043e \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c\u043e\u043c\u0443 \u0432 Lambda@Edge \u0437\u0430\u043f\u0440\u043e\u0441\u0443 \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u0445\u043e\u0434\u0438\u0442\u044c \u0432 \u0433\u0435\u043e\u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438 \u0443\u0434\u0430\u043b\u0435\u043d\u043d\u044b\u0439 \u043e\u0442 CDN \u0440\u0435\u0433\u0438\u043e\u043d, \u0438 \u043a\u0430\u043a \u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0435 \u0437\u0430\u043f\u0440\u043e\u0441 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u043d \u043e\u0447\u0435\u043d\u044c \u0431\u044b\u0441\u0442\u0440\u043e.<\/p>\n<h4>\u0421\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u044b<\/h4>\n<p>\u0412 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0435\u043c \u0448\u0430\u0433\u0435 \u043c\u044b \u0432\u044b\u044f\u0441\u043d\u0438\u043b\u0438 \u0447\u0442\u043e \u0434\u043b\u044f web \u0441\u0442\u0440\u0430\u043d\u0438\u0446 Next.js \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u0442\u00a0<strong>html<\/strong>\u00a0\u0444\u0430\u0439\u043b\u044b. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u043a \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u043e\u0434\u043c\u0435\u043d\u0438\u0442\u044c \u0430\u0434\u0440\u0435\u0441 \u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 (URI):<\/p>\n<pre><code>\/about => \/about.html \/posts\/how-to-deploy-react-app => \/posts\/how-to-deploy-react-app.html ... <\/code><\/pre>\n<p>Amazon AWS \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0441\u0440\u0435\u0434\u0443 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f Node.js \u0434\u043b\u044f \u0441\u0432\u043e\u0438\u0445 lambda \u0444\u0443\u043d\u043a\u0446\u0438\u0439, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u0441\u0435 \u0447\u0442\u043e \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e, \u044d\u0442\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043f\u0440\u043e\u0441\u0442\u0443\u044e Javascript \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u043f\u043e\u0434\u043c\u0435\u043d\u044b \u0430\u0434\u0440\u0435\u0441\u0430.<\/p>\n<p><a href=\"https:\/\/docs.aws.amazon.com\/lambda\/latest\/dg\/lambda-edge.html\" rel=\"noopener noreferrer nofollow\"><u>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f \u043f\u043e\u00a0<\/u><strong><u>Lambda@Edge<\/u><\/strong><\/a><\/p>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0443\u044e lambda \u0444\u0443\u043d\u043a\u0446\u0438\u044e:<\/p>\n<pre><code class=\"javascript\">\/\/ \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043c \u043d\u0430\u043b\u0438\u0447\u0438\u0435 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f \u0434\u043b\u044f JS, CSS, IMG \u0444\u0430\u0439\u043b\u043e\u0432 const hasExtension = \/(.+).[a-zA-Z0-9]{2,5}$\/;  \/\/ \u0434\u043b\u044f index \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043d\u0430\u043c \u043d\u0435\u0442 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043f\u043e\u0434\u043c\u0435\u043d\u044f\u0442\u044c uri, \u0442\u0430\u043a \u043a\u0430\u043a \/\/ \u044d\u0442\u043e \u043d\u0430\u0448\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u00ab\u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e\u00bb (\u0441\u043c. Default root object \u0432 \u0441\u0442\u0430\u0442\u044c\u0435 \u0432\u044b\u0448\u0435) const isIndex = (uri) => uri === '\/';  \/\/ lambda \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043e\u0436\u0438\u0434\u0430\u0435\u0442 \u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u044d\u043a\u0441\u043f\u043e\u0440\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 handler exports.handler = function (event, _ctx, callback) {   const request = event.Records[0].cf.request;   const uri = request.uri;    if (uri &amp;&amp; !isIndex(uri) &amp;&amp; !hasExtension.test(uri)) {     \/\/ \u043f\u043e\u0434\u043c\u0435\u043d\u044f\u0435\u043c uri \u0434\u043b\u044f \u0430\u0434\u0440\u0435\u0441\u043e\u0432 \u0441\u0442\u0440\u0430\u043d\u0438\u0446     request.uri = &lt;span class=\"hljs-subst\" style=\"box-sizing: border-box; border: 0px solid rgb(229, 231, 235); --tw-border-spacing-x:0; --tw-border-spacing-y:0; --tw-translate-x:0; --tw-translate-y:0; --tw-rotate:0; --tw-skew-x:0; --tw-skew-y:0; --tw-scale-x:1; --tw-scale-y:1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness:proximity; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width:0px; --tw-ring-offset-color:#fff; --tw-ring-color:rgba(59,130,246,0.5); --tw-ring-offset-shadow:0 0 #0000; --tw-ring-shadow:0 0 #0000; --tw-shadow:0 0 #0000; --tw-shadow-colored:0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; color: rgb(77, 77, 76);\">${uri}&lt;\/span>.html;   }    return callback(null, request); }; <\/code><\/pre>\n<p>Lambda \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 3 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430:<\/p>\n<ul>\n<li>\n<p>\u043f\u0435\u0440\u0432\u044b\u0439 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 &#8212;\u00a0<code>event<\/code>\u00a0&#8212; \u043e\u0431\u044a\u0435\u043a\u0442 \u0441\u043e\u0431\u044b\u0442\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e\u0442 \u0432\u044b\u0437\u044b\u0432\u0430\u044e\u0449\u0435\u0433\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 (\u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 AWS \u0441\u0435\u0440\u0432\u0438\u0441\u0430). \u0412 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u044d\u0442\u043e CloudFront \u0441\u043e\u0431\u044b\u0442\u0438\u0435. \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\u00a0<a href=\"https:\/\/docs.aws.amazon.com\/AmazonCloudFront\/latest\/DeveloperGuide\/lambda-event-structure.html\" rel=\"noopener noreferrer nofollow\"><u>\u0437\u0434\u0435\u0441\u044c<\/u><\/a>.<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"json\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 CloudFront message event {   \"Records\": [     {       \"cf\": {         \"config\": {           \"distributionId\": \"EDFDVBD6EXAMPLE\"         },         \"request\": {           \"clientIp\": \"xxxx:xxxx:xxxx:x:x:xxxx:xxxx:xxxx\",           \"method\": \"GET\",           \"uri\": \"\/about\",           \"headers\": {             \"host\": [               {                 \"key\": \"Host\",                 \"value\": \"xxxx.cloudfront.net\"               }             ],             \"user-agent\": [               {                 \"key\": \"User-Agent\",                 \"value\": \"curl\/7.51.0\"               }             ]           }         }       }     }   ] }  <\/code><\/pre>\n<ul>\n<li>\n<p>\u0432\u0442\u043e\u0440\u043e\u0439 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 &#8212;\u00a0<code>context<\/code>\u00a0&#8212; \u043e\u0431\u044a\u0435\u043a\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e \u0432\u044b\u0437\u043e\u0432\u0435, \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0438 \u0441\u0440\u0435\u0434\u0435 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f. \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435\u00a0<a href=\"https:\/\/docs.aws.amazon.com\/lambda\/latest\/dg\/nodejs-context.html\" rel=\"noopener noreferrer nofollow\"><u>\u0437\u0434\u0435\u0441\u044c<\/u><\/a>.<\/p>\n<\/li>\n<li>\n<p>\u0442\u0440\u0435\u0442\u0438\u0439 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 &#8212;\u00a0<code>callback<\/code>\u00a0&#8212; \u044d\u0442\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u0432 \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u044b\u0445 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u0445 \u0434\u043b\u044f \u043e\u0442\u043f\u0440\u0430\u0432\u043a\u0438 \u043e\u0442\u0432\u0435\u0442\u0430. \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u043e\u0431\u0440\u0430\u0442\u043d\u043e\u0433\u043e \u0432\u044b\u0437\u043e\u0432\u0430 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0434\u0432\u0430 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u0430: \u043e\u0448\u0438\u0431\u043a\u0443 \u0438 \u043e\u0442\u0432\u0435\u0442. \u041a\u043e\u0433\u0434\u0430 \u0432\u044b \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0435\u00a0<code>callback<\/code>, Lambda \u0436\u0434\u0435\u0442, \u043f\u043e\u043a\u0430 \u0446\u0438\u043a\u043b \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0441\u043e\u0431\u044b\u0442\u0438\u0439 \u0441\u0442\u0430\u043d\u0435\u0442 \u043f\u0443\u0441\u0442\u044b\u043c, \u0430 \u0437\u0430\u0442\u0435\u043c \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043e\u0442\u0432\u0435\u0442 \u0438\u043b\u0438 \u043e\u0448\u0438\u0431\u043a\u0443 \u0438\u043d\u0438\u0446\u0438\u0430\u0442\u043e\u0440\u0443. \u041e\u0431\u044a\u0435\u043a\u0442 \u043e\u0442\u0432\u0435\u0442\u0430 \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u043c \u0441\u00a0<code>JSON.stringify<\/code>. \u0414\u043b\u044f \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u044b\u0445 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432, \u0432\u043c\u0435\u0441\u0442\u043e \u0432\u044b\u0437\u043e\u0432\u0430\u00a0<code>callback<\/code>\u00a0\u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u0432\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u0432\u0435\u0440\u043d\u0443\u0442\u044c \u043e\u0442\u0432\u0435\u0442, \u043e\u0448\u0438\u0431\u043a\u0443 \u0438\u043b\u0438\u00a0<code>Promise<\/code>. \u0421\u043c\u043e\u0442\u0440\u0438 \u043f\u0440\u0438\u043c\u0435\u0440\u044b\u00a0<a href=\"https:\/\/docs.aws.amazon.com\/AmazonCloudFront\/latest\/DeveloperGuide\/lambda-examples.html\" rel=\"noopener noreferrer nofollow\"><u>\u0437\u0434\u0435\u0441\u044c<\/u><\/a>.<\/p>\n<\/li>\n<\/ul>\n<h4>\u0414\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u044b<\/h4>\n<p>\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0432 \u0441\u0432\u043e\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0432\u044b \u0437\u0430\u0445\u043e\u0442\u0438\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u044b. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0435\u0449\u0435 \u043e\u0434\u043d\u0443 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0443 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<pre><code class=\"javascript\">\/\/ ... const isPost = (uri) => uri.startsWith('\/posts\/'); const POST_ROUTE = '\/posts\/[slug].html';  exports.handler = function (event, _ctx, callback) {   \/\/ ...   if (uri &amp;&amp; !isIndex(uri) &amp;&amp; !hasExtension.test(uri)) {     request.uri = isPost(uri) ? POST_ROUTE : `${uri}.html`;   }   \/\/ ... }; <\/code><\/pre>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0447\u0430\u043d\u0438\u0435<\/strong><\/p>\n<blockquote>\n<p><em>\u0425\u043e\u0442\u044f \u0432\u044b\u0448\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u043d\u044b\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 \u0438 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0440\u0430\u0431\u043e\u0447\u0438\u043c, \u0435\u0441\u043b\u0438 \u0432\u044b \u043f\u043b\u0430\u043d\u0438\u0440\u0443\u0435\u0442\u0435 \u0434\u0435\u043b\u0430\u0442\u044c \u0441\u043b\u043e\u0436\u043d\u044b\u0439 \u0440\u043e\u0443\u0442\u0438\u043d\u0433 \u0441 \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u043c\u0438 \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u0430\u043c\u0438 \u0431\u0435\u0437 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0441\u0442\u0440\u0430\u043d\u0438\u0446 \u043d\u0430 \u044d\u0442\u0430\u043f\u0435 \u0441\u0431\u043e\u0440\u043a\u0438, \u0432\u044b \u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0435\u0441\u044c \u0432 \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u0438 \u043a\u043e\u0433\u0434\u0430 \u0440\u043e\u0443\u0442\u0438\u043d\u0433 \u0432\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0438 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0438 \u0432 Lambda \u0444\u0443\u043d\u043a\u0446\u0438\u0438 (\u043d\u0430\u043f\u043e\u043c\u043d\u044e \u0447\u0442\u043e Lambda \u0444\u0443\u043d\u043a\u0446\u0438\u044f &#8212; \u044d\u0442\u043e \u0447\u0430\u0441\u0442\u044c \u0438\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u044b). \u041f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u0442\u0430\u043a\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u0442\u0440\u0443\u0434\u043e\u0437\u0430\u0442\u0440\u0430\u0442\u043d\u043e \u0438 \u043d\u0435 \u0443\u0434\u043e\u0431\u043d\u043e, \u043f\u043e \u044d\u0442\u043e\u043c\u0443 \u0432\u0430\u043c \u0441\u0442\u043e\u0438\u0442 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0441 \u0440\u0430\u0437\u0432\u0435\u0440\u0442\u044b\u0432\u0430\u043d\u0438\u0435\u043c Frontend \u0441\u0435\u0440\u0432\u0435\u0440\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u0432\u0441\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 Next.js \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0432\u043a\u043b\u044e\u0447\u0430\u044f SSR, ISR \u0438 On-demand Revalidation.<\/em><\/p>\n<\/blockquote>\n<h4>\u0420\u0430\u0437\u0432\u0435\u0440\u0442\u044b\u0432\u0430\u043d\u0438\u0435 Lambda@Edge \u0444\u0443\u043d\u043a\u0446\u0438\u0438<\/h4>\n<ol>\n<li>\n<p>\u0412\u043e\u0439\u0434\u0438\u0442\u0435 \u0432 AWS Console \u0438 \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u00a0<a href=\"https:\/\/console.aws.amazon.com\/lambda\/\" rel=\"noopener noreferrer nofollow\"><u>AWS Lambda<\/u><\/a>.<\/p>\n<\/li>\n<\/ol>\n<p>\u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 Lambda@Edge \u0444\u0443\u043d\u043a\u0446\u0438\u0438 &#8212; \u044d\u0442\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0441\u0435\u0440\u0432\u0438\u0441\u0430 CloudFront \u0432\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0440\u0435\u0433\u0438\u043e\u043d, \u0432 AWS \u044d\u0442\u043e\u00a0<strong>US-East-1 (N. Virginia).<\/strong>\u00a0\u0420\u0435\u0433\u0438\u043e\u043d\u044b \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u0435 AWS \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u044e\u0442\u0441\u044f \u0432 \u0448\u0430\u043f\u043a\u0435 \u0441\u0430\u0439\u0442\u0430.<\/p>\n<ol start=\"2\">\n<li>\n<p>\u0414\u0430\u043b\u0435\u0435 \u043d\u0430\u0436\u043c\u0438\u0442\u0435\u00a0<strong>Create function<\/strong><\/p>\n<\/li>\n<li>\n<p>\u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0441 \u043d\u0443\u043b\u044f\u00a0<strong>Author from scratch<\/strong><\/p>\n<\/li>\n<li>\n<p>\u0423\u043a\u0430\u0436\u0438\u0442\u0435\u00a0<strong>\u0418\u043c\u044f<\/strong>\u00a0\u0438\u00a0<strong>Runtime<\/strong>\u00a0\u0444\u0443\u043d\u043a\u0446\u0438\u0438 (Node.js)<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0436\u043c\u0438\u0442\u0435\u00a0<strong>Create<\/strong><\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/912\/da7\/a79\/912da7a79e874e29cbe69f7458cb4c77.webp\" width=\"2030\" height=\"1594\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"6\">\n<li>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043e\u0442\u043a\u0440\u043e\u0435\u0442\u0441\u044f \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u0433\u0434\u0435 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043a\u043e\u0434 lambda \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/acd\/3aa\/088\/acd3aa088e4ac4066d56cc73642e6497.webp\" width=\"2478\" height=\"1410\"\/><figcaption><\/figcaption><\/figure>\n<ul>\n<li>\n<p>\u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0432\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u043a\u043e\u0434 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043f\u0440\u044f\u043c\u043e \u0432 \u0432\u0435\u0431 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0435<\/p>\n<\/li>\n<li>\n<p>\u0438\u043b\u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c \u0441\u0432\u043e\u044e lambda \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u043a\u0430\u043a \u0430\u0440\u0445\u0438\u0432<\/p>\n<\/li>\n<\/ul>\n<p>\u0433\u043b\u0430\u0432\u043d\u043e\u0435 \u0447\u0442\u043e\u0431\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 \u0441\u043e\u0432\u043f\u0430\u0434\u0430\u043b\u0438 \u0441 \u0442\u0435\u043c \u043a\u0430\u043a \u0432\u044b \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u043b\u0438 \u0432\u0430\u0448\u0443 \u0444\u0443\u043d\u043a\u0446\u0438\u044e (\u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u044d\u0442\u043e\u00a0<strong>index.js<\/strong>\u00a0\u0444\u0430\u0439\u043b \u0438 \u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u00a0<strong>handler<\/strong>):<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/664\/ff2\/10b\/664ff210b706a24a7b3b5181fab9e92d.webp\" width=\"2208\" height=\"342\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"7\">\n<li>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043d\u0430\u0436\u0430\u0442\u044c \u043a\u043d\u043e\u043f\u043a\u0443\u00a0<strong>Deploy<\/strong><\/p>\n<\/li>\n<li>\n<p>\u0417\u0430\u0442\u0435\u043c \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u043d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0443\u00a0<strong>Versions<\/strong>\u00a0\u0438 \u043d\u0430\u0436\u043c\u0438\u0442\u0435\u00a0<strong>Publish new version.<\/strong>\u00a0\u0414\u043e\u0431\u0430\u0432\u044c\u0442\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0438 \u043d\u0430\u0436\u043c\u0438\u0442\u0435\u00a0<strong>Publish.<\/strong>\u00a0\u041f\u043e\u0441\u043b\u0435 \u0447\u0435\u0433\u043e \u043f\u043e\u044f\u0432\u0438\u0442\u0441\u044f \u0432\u0435\u0440\u0441\u0438\u044f\u00a0<strong>#1<\/strong>\u00a0\u0432\u0430\u0448\u0435\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/9ff\/74e\/278\/9ff74e278fb972cffc73b0682547a68c.webp\" width=\"2244\" height=\"540\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"9\">\n<li>\n<p>\u0421\u043a\u043e\u043f\u0438\u0440\u0443\u0439\u0442\u0435 Function ARN (\u0430\u0434\u0440\u0435\u0441, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0437\u0430\u043a\u0430\u043d\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435\u043c \u0432\u0430\u0448\u0435\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0438 \u0435\u0435 \u0432\u0435\u0440\u0441\u0438\u0435\u0439)<\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/abd\/aca\/7c4\/abdaca7c4839e7ca3becfc7e9ac606d1.webp\" width=\"3158\" height=\"848\"\/><figcaption><\/figcaption><\/figure>\n<ol start=\"10\">\n<li>\n<p>\u041d\u0430 \u044d\u0442\u043e\u043c \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 Lambda \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u043e.<\/p>\n<\/li>\n<\/ol>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u043d\u0430\u043c \u043e\u0441\u0442\u0430\u043b\u043e\u0441\u044c \u0441\u0432\u044f\u0437\u0430\u0442\u044c Lambda \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0441 CloudFront \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u0435\u0439.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u0432 AWS Console \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u044c CloudFront \u21d2 Distribution \u21d2 ID. \u041d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0435\u00a0<strong>Behaviors<\/strong>\u00a0\u0432\u044b\u0431\u0435\u0440\u0438\u0442\u0435\u00a0<strong>Default<\/strong>\u00a0\u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0438 \u043d\u0430\u0436\u043c\u0438\u0442\u0435\u00a0<strong>Edit<\/strong>.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/330\/215\/ea0\/330215ea04750d0186fe3c0fa303b673.webp\" width=\"2250\" height=\"784\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412 \u043e\u0442\u043a\u0440\u044b\u0432\u0448\u0435\u043c\u0441\u044f \u043e\u043a\u043d\u0435 \u0432 \u0431\u043b\u043e\u043a\u0435\u00a0<strong>Function associations<\/strong>\u00a0\u0434\u043b\u044f\u00a0<strong>Origin request<\/strong>\u00a0\u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0443\u043a\u0430\u0436\u0438\u0442\u0435 ARN \u0432\u0430\u0448\u0435\u0439 lambda \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0438 \u0432\u043a\u043b\u044e\u0447\u0438\u0442\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0443\u00a0<strong>body.<\/strong>\u00a0\u041d\u0430\u0436\u043c\u0438\u0442\u0435\u00a0<strong>Save changes.<\/strong><\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/91c\/06c\/e77\/91c06ce77f42ddd03be531f5eb1cebb8.webp\" width=\"1684\" height=\"804\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>Origin request<\/strong>\u00a0&#8212; \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u0438\u043b\u0438 \u0445\u0443\u043a, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0442\u044c lambda \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u043f\u0435\u0440\u0435\u0434 \u0442\u0435\u043c \u043a\u0430\u043a \u0437\u0430\u043f\u0440\u043e\u0441 \u0431\u0443\u0434\u0435\u0442 \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d \u0438\u0437\u00a0<strong>CloudFront<\/strong>\u00a0\u0432\u00a0<strong>Origin<\/strong>\u00a0(\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u0441\u044b\u043b\u0430\u0435\u0442\u0441\u044f CloudFront \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u044f). \u041a\u0430\u043a \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u043e\u043c\u043d\u0438\u0442\u044c \u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043c\u044b \u0438\u043c\u0435\u0435\u043c \u043e\u0434\u0438\u043d\u00a0<strong>Origin<\/strong>\u00a0\u0438 \u0438\u043c ****\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f <strong>S3 bucket<\/strong> \u0441 \u0444\u0430\u0439\u043b\u0430\u043c\u0438 \u043d\u0430\u0448\u0435\u0433\u043e \u0441\u0430\u0439\u0442\u0430.<\/p>\n<h4>\u0412\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0435\u00a0\u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b<\/h4>\n<p>\u0415\u0441\u043b\u0438 \u043f\u0440\u0438 \u043f\u043e\u043f\u044b\u0442\u043a\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c Lambda \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u043a CloudFront \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u0438 \u0432\u044b \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0441\u043e \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u0439 \u043e\u0448\u0438\u0431\u043a\u043e\u0439:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/710\/1e3\/9f1\/7101e39f109d55130d36cfb06ad66bae.webp\" width=\"1636\" height=\"226\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0422\u043e \u0432\u0430\u043c \u043f\u043e\u043d\u0430\u0434\u043e\u0431\u0438\u0442\u0441\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c\u00a0<strong>Execution role<\/strong>\u00a0\u0434\u043b\u044f Lambda \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0432\u0435\u0440\u043d\u0438\u0442\u0435\u0441\u044c \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u044c Lambda \u0444\u0443\u043d\u043a\u0446\u0438\u0439, \u0432\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0432\u0430\u0448\u0443 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0438 \u043d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0435\u00a0<strong>Configuration<\/strong>\u00a0\u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u00a0<strong>Permissions<\/strong>. \u0412 \u0431\u043b\u043e\u043a\u0435\u00a0<strong>Execution role<\/strong>\u00a0\u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u043f\u043e \u0441\u0441\u044b\u043b\u043a\u0435 Role name.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/a55\/84d\/2b3\/a5584d2b3a7a053ad90950bd52c88112.webp\" width=\"2116\" height=\"946\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412 \u043e\u0442\u043a\u0440\u044b\u0432\u0448\u0435\u043c\u0441\u044f \u043e\u043a\u043d\u0435 \u043d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0435\u00a0<strong>Trust relationships<\/strong>\u00a0\u0434\u043e\u0431\u0430\u0432\u044c\u0442\u0435\u00a0<a href=\"http:\/\/edgelambda.amazonaws.com\" rel=\"noopener noreferrer nofollow\"><strong>edgelambda.amazonaws.com<\/strong><\/a>\u00a0\u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0434\u043e\u043f\u0443\u0441\u0442\u0438\u043c\u044b\u0445 \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u0432.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/1f0\/05d\/489\/1f005d489bee5129ff970152e06c03a1.webp\" width=\"1610\" height=\"1620\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0447\u0435\u0433\u043e \u043f\u043e\u0432\u0442\u043e\u0440\u0438\u0442\u0435 \u043f\u0440\u043e\u0446\u0435\u0434\u0443\u0440\u0443 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 Lambda \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435\u00a0<strong>Origin request<\/strong>\u00a0\u0434\u043b\u044f CloudFront \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u0438.<\/p>\n<h4>\u041f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u043e\u0432<\/h4>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u044f \u0440\u0430\u0437\u0432\u0435\u0440\u0442\u044b\u0432\u0430\u043d\u0438\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439 \u0432 CloudFront \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u043a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0432\u0430\u0448 \u0440\u043e\u0443\u0442\u0438\u043d\u0433.<\/p>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0435\u0441\u043b\u0438 \u0432\u044b \u0437\u0430\u0439\u0434\u0435\u0442\u0435 \u043f\u043e \u043f\u0440\u044f\u043c\u043e\u0439 \u0441\u0441\u044b\u043b\u043a\u0435 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443\u00a0<strong>\/about<\/strong>\u00a0\u0432\u044b \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u043d\u0430\u0448\u0435\u0433\u043e \u0441\u0430\u0439\u0442\u0430, \u0430 \u043d\u0435 \u043e\u0448\u0438\u0431\u043a\u0443 \u043a\u0430\u043a \u0431\u044b\u043b\u043e \u0434\u043e \u044d\u0442\u043e\u0433\u043e.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d63\/23a\/07b\/d6323a07b0941c2efcc809aaa39f4f22.webp\" width=\"2308\" height=\"2226\"\/><figcaption><\/figcaption><\/figure>\n<h3>\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u00a0AWS\u00a0Route 53 \u0438 Certificate Manager<\/h3>\n<p><strong>AWS Route 53<\/strong>\u00a0\u2013\u00a0\u044d\u0442\u043e \u0441\u043b\u0443\u0436\u0431\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0434\u043e\u043c\u0435\u043d\u043d\u044b\u0445 \u0438\u043c\u0435\u043d. \u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u044d\u0442\u043e\u0433\u043e \u0441\u0435\u0440\u0432\u0438\u0441\u0430 \u043c\u043e\u0436\u043d\u043e \u0440\u0435\u0448\u0438\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0432\u043e\u043f\u0440\u043e\u0441\u043e\u0432:<\/p>\n<ul>\n<li>\n<p>\u041a\u0443\u043f\u0438\u0442\u044c \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f, \u0435\u0441\u043b\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e (\u044f \u043f\u043e\u043a\u0430\u0436\u0443 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u0443\u0436\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0435\u0433\u043e \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u043c\u0435\u043d\u0438)<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0440\u043e\u0443\u0442\u0438\u043d\u0433 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u043c\u0435\u043d\u0438 \u043a \u043d\u0430\u0448\u0435\u043c\u0443 CloudFront distribution.<\/p>\n<\/li>\n<\/ul>\n<p>\u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0441\u0435\u0440\u0432\u0438\u0441\u0430\u00a0<strong>Certificate Manager<\/strong>\u00a0\u043c\u043e\u0436\u043d\u043e \u0432\u044b\u043f\u0443\u0441\u0442\u0438\u0442\u044c \u0438\u043b\u0438 \u0438\u043c\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c SSL\/TLS \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442 \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b HTTPS \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u043a \u0432\u0430\u0448\u0435\u043c\u0443 \u0441\u0430\u0439\u0442\u0443.<\/p>\n<h4>\u0414\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f<\/h4>\n<p>\u0418\u0442\u0430\u043a \u0435\u0441\u043b\u0438 \u0432\u044b \u0435\u0449\u0435 \u043d\u0435 \u043f\u0440\u0438\u043e\u0431\u0440\u0435\u043b\u0438 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f, \u044d\u0442\u043e \u043b\u0435\u0433\u043a\u043e \u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0447\u0435\u0440\u0435\u0437 Route 53.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0432 AWS Console \u043d\u0430\u0445\u043e\u0434\u0438\u043c \u0441\u0435\u0440\u0432\u0438\u0441 Router 53 \u0438 \u0432\u0431\u0438\u0432\u0430\u0435\u043c \u0432 \u043f\u043e\u043b\u0435\u00a0<strong>Find and register an available domain<\/strong>\u00a0\u0436\u0435\u043b\u0430\u0435\u043c\u043e\u0435 \u0438\u043c\u044f.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/229\/176\/9db\/2291769db49ffdac3e6e0e0a4f96723c.webp\" width=\"2438\" height=\"1316\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0414\u0430\u043b\u0435\u0435 \u0441\u043b\u0435\u0434\u0443\u0439\u0442\u0435 \u0448\u0430\u0433\u0430\u043c \u043f\u043e \u0432\u044b\u0431\u043e\u0440\u0443 \u0434\u043e\u043c\u0435\u043d\u0430, \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044e \u0432 \u043a\u043e\u0440\u0437\u0438\u043d\u0443 \u0438 \u043e\u043f\u043b\u0430\u0442\u0435, \u044d\u0442\u0438 \u0448\u0430\u0433\u0438 \u044f \u043e\u043f\u0443\u0449\u0443.<\/p>\n<p><strong>\u0415\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u0435\u0441\u0442\u044c \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f, \u043a\u0443\u043f\u043b\u0435\u043d\u043d\u043e\u0435 \u0443 \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0442\u043e\u0440\u0430<\/strong><\/p>\n<p>\u0414\u043b\u044f \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0440\u0435\u0441\u0443\u0440\u0441\u043d\u044b\u043c\u0438 \u0437\u0430\u043f\u0438\u0441\u044f\u043c\u0438 \u0432\u0430\u0448\u0435\u0433\u043e \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u043c\u0435\u043d\u0438, \u0432\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0432 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0435 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0442\u043e\u0440\u0430, \u0434\u043b\u044f \u0432\u0430\u0448\u0435\u0433\u043e \u0438\u043c\u0435\u043d\u0438, \u043f\u0440\u043e\u043f\u0438\u0441\u0430\u0442\u044c DNS-\u0441\u0435\u0440\u0432\u0435\u0440\u044b Amazon.<\/p>\n<p><strong>\u041f\u043e\u0447\u0435\u043c\u0443 \u043d\u0435\u043b\u044c\u0437\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0440\u043e\u0443\u0442\u0438\u043d\u0433 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u043c\u0435\u043d\u0438 \u043f\u0440\u043e\u0441\u0442\u043e \u0447\u0435\u0440\u0435\u0437 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0442\u043e\u0440\u0430 (\u043d\u0435 Amazon)?<\/strong><\/p>\n<p>\u0414\u0435\u043b\u043e \u0432 \u0442\u043e\u043c \u0447\u0442\u043e AWS CloudFront \u0438\u043c\u0435\u0435\u0442 \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043f\u0443\u043b \u0430\u0434\u0440\u0435\u0441\u043e\u0432 \u0438 \u0432\u044b \u043d\u0435 \u0441\u043c\u043e\u0436\u0435\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0442\u044c\u00a0<strong>A<\/strong>-\u0437\u0430\u043f\u0438\u0441\u044c \u0434\u043b\u044f \u0441\u0432\u043e\u0435\u0433\u043e \u0434\u043e\u043c\u0435\u043d\u0430 \u043d\u0438 \u0443 \u043e\u0434\u043d\u043e\u0433\u043e \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0442\u043e\u0440\u0430, \u043a\u0440\u043e\u043c\u0435 Amazon Route 53.<\/p>\n<p>\u0418\u0442\u0430\u043a, \u043a\u0430\u043a \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u043d\u044b\u043c\u0438 \u0437\u0430\u043f\u0438\u0441\u044f\u043c\u0438 \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435\u00a0<a href=\"http:\/\/reg.ru\/\" rel=\"noopener noreferrer nofollow\"><u>reg.ru<\/u><\/a>.<\/p>\n<p>\u041d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043a \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044e \u0437\u043e\u043d\u043e\u0439 \u0438 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0435 \u0441\u0432\u043e\u0438 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435 DNS-\u0441\u0435\u0440\u0432\u0435\u0440\u044b. \u041d\u0430 \u0442\u0435\u043a\u0443\u0449\u0438\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 Amazon \u0432\u043b\u0430\u0434\u0435\u0435\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c\u0438 DNS \u0441\u0435\u0440\u0432\u0435\u0440\u0430\u043c\u0438:<\/p>\n<pre><code>ns-1458.awsdns-54.org ns-384.awsdns-48.com ns-527.awsdns-01.net ns-1816.awsdns-35.co.uk <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8b2\/88a\/4fa\/8b288a4fa64621f386abf7d7078b6b1d.webp\" width=\"2008\" height=\"1392\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u043e\u0441\u043b\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439, \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 DNS \u0437\u0430\u043f\u0438\u0441\u0435\u0439 \u043c\u043e\u0436\u0435\u0442 \u0437\u0430\u043d\u044f\u0442\u044c \u043e\u0442 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u0447\u0430\u0441\u043e\u0432 \u0434\u043e \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u0434\u043d\u0435\u0439.<\/p>\n<h4>\u0421\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442<\/h4>\n<p>\u0414\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u0430 \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u0432\u00a0<strong>AWS Certificate Manager.<\/strong>\u00a0\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043d\u0430\u0431\u0435\u0440\u0438\u0442\u0435 \u0432\u00a0<strong>AWS Console<\/strong>\u00a0\u043d\u0430\u0431\u0435\u0440\u0438\u0442\u0435 \u0432 \u043f\u043e\u0438\u0441\u043a\u0435\u00a0<strong>Certificate Manager.<\/strong><\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ce1\/189\/aec\/ce1189aec1632eb893e8533a2ab0d08d.webp\" width=\"1882\" height=\"306\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0417\u0434\u0435\u0441\u044c \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0437\u0430\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u0438\u043b\u0438 \u0438\u043c\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0438\u043c\u0435\u044e\u0449\u0438\u0439\u0441\u044f \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442.<\/p>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0447\u0430\u043d\u0438\u0435 1<\/strong><\/p>\n<blockquote>\n<p><em>CloudFront \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e 1024-\u0431\u0438\u0442\u043d\u044b\u0435 \u0438 2048-\u0431\u0438\u0442\u043d\u044b\u0435 \u043a\u043b\u044e\u0447\u0438 RSA. \u0422\u043e \u0435\u0441\u0442\u044c RSA-2048 \u044d\u0442\u043e \u043c\u0430\u043a\u0441\u0438\u043c\u0443\u043c \u0447\u0442\u043e \u0432\u044b \u0441\u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441 CloudFront, \u0445\u043e\u0442\u044f \u0441\u0430\u043c Certificate Manager \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0438 \u0431\u043e\u043b\u044c\u0448\u0438\u0435 \u043a\u043b\u044e\u0447\u0438.<\/em><\/p>\n<\/blockquote>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0447\u0430\u043d\u0438\u0435 2<\/strong><\/p>\n<blockquote>\n<p><em>\u0421\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0438\u043b\u0438 \u0438\u043c\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043d\u0430\u0445\u043e\u0434\u044f\u0441\u044c \u0432 \u0440\u0435\u0433\u0438\u043e\u043d\u0435\u00a0<\/em><strong><em>US-East-1 (N. Virginia)<\/em><\/strong><em>. \u041f\u0440\u0430\u0432\u0438\u043b\u043e \u0442\u0430\u043a\u043e\u0435 \u0436\u0435 \u043a\u0430\u043a \u0438 \u0434\u043b\u044f Lambda@Edge \u2013\u00a0\u043c\u044b \u0445\u043e\u0442\u0438\u043c \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442 \u043a \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u043c\u0443 \u0441\u0435\u0440\u0432\u0438\u0441\u0443 CloudFront, \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043a \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0447\u0435\u0440\u0435\u0437 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 AWS \u0440\u0435\u0433\u0438\u043e\u043d. \u0420\u0435\u0433\u0438\u043e\u043d\u044b \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u0435 AWS \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u044e\u0442\u0441\u044f \u0432 \u0448\u0430\u043f\u043a\u0435 \u0441\u0430\u0439\u0442\u0430.<\/em><\/p>\n<\/blockquote>\n<p>\u0422\u0430\u043a \u0447\u0442\u043e \u0435\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u0443\u0436\u0435 \u0435\u0441\u0442\u044c \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442, \u043d\u043e \u043e\u043d \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0431\u043e\u043b\u044c\u0448\u0438\u0439 \u043a\u043b\u044e\u0447, \u043f\u0440\u043e\u0441\u0442\u043e \u0441\u043e\u0437\u0434\u0430\u0439\u0442\u0435 \u043d\u043e\u0432\u044b\u0439 \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442 \u0432 Amazon.<\/p>\n<p>\u041f\u0440\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u0432\u0441\u0435 \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e, \u044d\u0442\u043e \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u0438\u043c\u044f \u0434\u043e\u043c\u0435\u043d\u0430, \u0441 \u043a\u043e\u0442\u043e\u0440\u044b\u043c \u0431\u0443\u0434\u0435\u0442 \u0430\u0441\u0441\u043e\u0446\u0438\u0438\u0440\u043e\u0432\u0430\u043d \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442 \u0438 \u0441\u043f\u043e\u0441\u043e\u0431 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/a96\/949\/0c7\/a969490c79f914c39e173a017fd414f8.webp\" width=\"1752\" height=\"1140\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u0432\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u044e \u0447\u0435\u0440\u0435\u0437 DNS \u0442\u043e \u0434\u043b\u044f \u043f\u043e\u0434\u0442\u0432\u0435\u0440\u0436\u0434\u0435\u043d\u0438\u044f \u0432\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0431\u0443\u0434\u0435\u0442 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c CNAME \u0437\u0430\u043f\u0438\u0441\u044c \u0434\u043b\u044f \u0432\u0430\u0448\u0435\u0433\u043e \u0434\u043e\u043c\u0435\u043d\u0430.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/439\/02d\/0d6\/43902d0d6abbc7ca52ddf03160c40a30.webp\" width=\"3162\" height=\"464\"\/><figcaption><\/figcaption><\/figure>\n<h4>DNS Routing<\/h4>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u043c\u043e\u0436\u043d\u043e \u0432\u0435\u0440\u043d\u0443\u0442\u044c\u0441\u044f \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u044c Route 53.<\/p>\n<p>\u0417\u0430\u0439\u0434\u0438\u0442\u0435 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u00a0<strong>Hosted zones<\/strong>, \u043d\u0430\u0436\u043c\u0438\u0442\u0435\u00a0<strong>Create hosted zone<\/strong>. \u0423\u043a\u0430\u0436\u0438\u0442\u0435 \u0432\u0430\u0448\u0435 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f \u0438 \u0432\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0442\u0438\u043f\u00a0<strong>Public hosted zone<\/strong>.<\/p>\n<p>\u0417\u0430\u0442\u0435\u043c \u0437\u0430\u0439\u0434\u0438\u0442\u0435 \u0432 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u0443\u044e \u0437\u043e\u043d\u0443 \u0438 \u0441\u043e\u0437\u0434\u0430\u0439\u0442\u0435\u00a0<strong>A<\/strong>\u00a0\u0437\u0430\u043f\u0438\u0441\u044c \u0434\u043b\u044f \u043a\u043e\u0440\u043d\u0435\u0432\u043e\u0433\u043e \u0434\u043e\u043c\u0435\u043d\u0430 \u0432\u0438\u0434\u0430\u00a0<code>hostname.com<\/code>\u00a0\u0438\u00a0<strong>CNAME<\/strong>\u00a0\u0437\u0430\u043f\u0438\u0441\u044c \u0434\u043b\u044f \u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u043c\u0435\u043d\u0438 \u0432 \u043c\u0435\u043d\u0435\u0434\u0436\u0435\u0440\u0435 \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0432 (\u0441\u0443\u0431\u0434\u043e\u043c\u0435\u043d \u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0434\u043b\u044f \u044d\u0442\u043e\u0439 \u0437\u0430\u043f\u0438\u0441\u0438 \u0443 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0443\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0435).<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/79d\/9b0\/0fb\/79d9b00fb9db3970fbf4c01b6a334e28.webp\" width=\"2632\" height=\"976\"\/><figcaption><\/figcaption><\/figure>\n<p><strong>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 A \u0437\u0430\u043f\u0438\u0441\u0438<\/strong><\/p>\n<ol>\n<li>\n<p>\u041d\u0430\u0436\u043c\u0438\u0442\u0435\u00a0<strong>Create record<\/strong><\/p>\n<\/li>\n<li>\n<p>\u0412 \u043e\u0442\u043a\u0440\u044b\u0432\u0448\u0435\u043c\u0441\u044f \u043e\u043a\u043d\u0435 \u043e\u0441\u0442\u0430\u0432\u044c\u0442\u0435 \u043f\u043e\u043b\u0435\u00a0<strong>subdomain<\/strong>\u00a0\u043f\u0443\u0441\u0442\u044b\u043c (\u0442\u0430\u043a \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u0441\u044f \u043a \u043a\u043e\u0440\u043d\u0435\u0432\u043e\u043c\u0443 \u0434\u043e\u043c\u0435\u043d\u0443)<\/p>\n<\/li>\n<li>\n<p>\u0412\u044b\u0431\u0435\u0440\u0438\u0442\u0435\u00a0<strong>Record type<\/strong>\u00a0\u2013\u00a0<strong>A<\/strong><\/p>\n<\/li>\n<li>\n<p>\u0412\u043a\u043b\u044e\u0447\u0438\u0442\u0435 \u0440\u0435\u0436\u0438\u043c\u00a0<strong>Alias<\/strong>\u00a0(\u0432 \u0440\u0435\u0436\u0438\u043c\u0435 Alias AWS \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u0441\u044b\u043b\u0430\u0442\u044c\u0441\u044f \u043d\u0430 \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0438\u0435 \u0441\u0435\u0440\u0432\u0438\u0441\u044b, \u044d\u0442\u043e \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u043e\u0442 \u043f\u0443\u043d\u043a\u0442 \u043f\u043e\u0447\u0435\u043c\u0443 \u043c\u044b \u043d\u0435 \u043c\u043e\u0433\u043b\u0438 \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u043c \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0430\u0442\u043e\u0440\u043e\u043c \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u043c\u0435\u043d\u0438 \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u0442\u044c \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f \u043a CloudFront)<\/p>\n<\/li>\n<li>\n<p>\u0412 \u043f\u043e\u043b\u0435\u00a0<strong>Route traffic to<\/strong>\u00a0\u043d\u0430\u0439\u0434\u0438\u0442\u0435 CloudFront distribution<\/p>\n<\/li>\n<li>\n<p>\u0412 \u043f\u043e\u044f\u0432\u0438\u0432\u0448\u0435\u043c\u0441\u044f \u043f\u043e\u043b\u0435 \u0432\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0441\u0432\u043e\u0439 distribution<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0436\u043c\u0438\u0442\u0435\u00a0<strong>Create records<\/strong><\/p>\n<\/li>\n<\/ol>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/04d\/864\/66b\/04d86466b5f998c99bc3c05cfd89aef3.webp\" width=\"2198\" height=\"1272\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0414\u043b\u044f CNAME \u0437\u0430\u043f\u0438\u0441\u0438 \u0432\u0441\u0435 \u043f\u0440\u043e\u0449\u0435 \u2013 \u0443\u043a\u0430\u0436\u0438\u0442\u0435 \u0441\u0443\u0431\u0434\u043e\u043c\u0435\u043d, \u0432\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0442\u0438\u043f \u0437\u0430\u043f\u0438\u0441\u0438 \u0438 \u0443\u043a\u0430\u0436\u0438\u0442\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435.<\/p>\n<h4>\u0421\u0432\u044f\u0437\u044b\u0432\u0430\u043d\u0438\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u0441 CloudFront<\/h4>\n<p>\u041f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u043c \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u043c \u0448\u0430\u0433\u043e\u043c \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u0432 \u0441\u0430\u043c\u043e\u043c CloudFront.<\/p>\n<p>\u041c\u044b \u0443\u043a\u0430\u0436\u0435\u043c \u0432 \u043d\u0430\u0448\u0435\u0439 \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u0438 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f \u0438 \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u0432 \u043a\u043e\u043d\u0441\u043e\u043b\u044c CloudFront, \u0432\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u044e, \u043d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0435\u00a0<strong>General<\/strong>\u00a0\u043d\u0430\u0436\u043c\u0438\u0442\u0435 \u043a\u043d\u043e\u043f\u043a\u0443\u00a0<strong>Edit<\/strong>\u00a0\u0432 \u0431\u043b\u043e\u043a\u0435\u00a0<strong>Settings<\/strong>.<\/p>\n<ol>\n<li>\n<p>\u0414\u043e\u0431\u0430\u0432\u044c\u0442\u0435 \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u043e\u0435 \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0435 \u0438\u043c\u044f.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f7a\/e14\/6ca\/f7ae146ca656aca71efd9ad692cf7e9c.webp\" width=\"1144\" height=\"276\"\/><figcaption><\/figcaption><\/figure>\n<\/li>\n<li>\n<p>\u0423\u043a\u0430\u0436\u0438\u0442\u0435 SSL \u0441\u0435\u0440\u0442\u0438\u0444\u0438\u043a\u0430\u0442.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/0f7\/512\/a80\/0f7512a80f9a88d52d5db3fc6b2367d7.webp\" width=\"1496\" height=\"888\"\/><figcaption><\/figcaption><\/figure>\n<\/li>\n<li>\n<p>\u0421\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f<\/p>\n<\/li>\n<\/ol>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0432\u0441\u0435\u0445 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439 \u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f DNS\u00a0\u0437\u0430\u043f\u0438\u0441\u0435\u0439 \u0432 \u0441\u0435\u0442\u0438 \u0438\u043d\u0442\u0435\u0440\u043d\u0435\u0442 \u0432\u044b \u0441\u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u0432\u043e\u0439 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u0434\u043e\u043c\u0435\u043d.<\/p>\n<h3>\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/h3>\n<p>\u041c\u044b \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u043b\u0438 \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0432 \u0438\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0435 Amazon.<\/p>\n<p>\u041c\u043e\u0436\u0435\u0442 \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c\u0441\u044f \u0447\u0442\u043e \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 Amazon \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u0432 \u0442\u0440\u0443\u0434\u043e\u0435\u043c\u043a\u0438\u0439 (\u0443\u0447\u0438\u0442\u044b\u0432\u0430\u044f \u0442\u043e\u0442 \u0444\u0430\u043a\u0442 \u0447\u0442\u043e \u043c\u044b \u043d\u0435 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u043b\u0438 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0437\u0430\u0446\u0438\u0438), \u043e\u0434\u043d\u0430\u043a\u043e \u0432 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0435 \u0432\u0430\u0448\u0438\u0445 \u0443\u0441\u0438\u043b\u0438\u0439 \u0432\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442\u0435 \u043d\u0430\u0434\u0435\u0436\u043d\u0443\u044e \u0438\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0443, \u0433\u043e\u0442\u043e\u0432\u0443\u044e \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043f\u043e\u0434 \u0432\u0430\u0448\u0438 \u043d\u0430\u0433\u0440\u0443\u0437\u043a\u0438.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0436\u0435 \u0432\u0430\u0448 \u0441\u0430\u0439\u0442 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u0432\u044b \u0432\u043f\u043e\u043b\u043d\u0435 \u043c\u043e\u0436\u0435\u0442\u0435 \u0432\u043f\u0438\u0441\u0430\u0442\u044c\u0441\u044f \u0432 \u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0435 \u0442\u0430\u0440\u0438\u0444\u044b \u0434\u043b\u044f S3, CloudFront \u0438 Lambda@Edge.<\/p>\n<\/p>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"v-portal\" style=\"display:none;\"><\/div>\n<\/div>\n<p> <!----> <!----><br \/> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/post\/693528\/\"> https:\/\/habr.com\/ru\/post\/693528\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<div><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<p>\u042d\u0442\u043e \u043f\u0435\u0440\u0432\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0441\u0442\u0430\u0442\u044c\u0438, \u0433\u0434\u0435 \u043c\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u0441\u0435\u0440\u0432\u0438\u0441\u044b AWS \u0438 \u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043c \u0440\u0443\u0447\u043d\u043e\u0435 \u0440\u0430\u0437\u0432\u0435\u0440\u0442\u044b\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u0412\u043e \u0432\u0442\u043e\u0440\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0432\u043e\u043f\u0440\u043e\u0441 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0437\u0430\u0446\u0438\u0438 \u0441\u0431\u043e\u0440\u043a\u0438 \u0438 \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u0438.<\/p>\n<p><strong>\u0412\u0430\u0436\u043d\u043e\u0435 \u0437\u0430\u043c\u0435\u0447\u0430\u043d\u0438\u0435:<\/strong>\u00a0\u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u043d\u0430\u0448\u0435\u0433\u043e \u0441\u0430\u0439\u0442\u0430 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0438\u0437 \u0441\u0435\u0431\u044f \u043d\u0430\u0431\u043e\u0440 \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0444\u0430\u0439\u043b\u043e\u0432, \u0442\u043e \u0435\u0441\u0442\u044c \u0443 \u043d\u0430\u0441 \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u0441\u0435\u0440\u0432\u0435\u0440\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430 \u0432\u043e Frontend \u0447\u0430\u0441\u0442\u0438.<\/p>\n<p>\u0412\u0430\u043c \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u043b\u0435\u0437\u043d\u0430 \u044d\u0442\u0430 \u0441\u0442\u0430\u0442\u044c\u044f \u0435\u0441\u043b\u0438 \u0432\u044b \u043f\u0438\u0448\u0438\u0442\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u0431\u0430\u0437\u0435 Create React App \u0438\u043b\u0438 Next.js \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 Static Export.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 Server Side Rendering (SSR) \u0438\u043b\u0438 Incremental Static Regeneration (ISR) \u2013 \u0432 \u0432\u0430\u0448\u0435\u0439 \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u0443\u0440\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043d\u0430\u043b\u0438\u0447\u0438\u0435 \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u0438 \u043a\u0430\u043a \u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0435 \u0434\u0430\u043d\u043d\u0430\u044f \u0441\u0442\u0430\u0442\u044c\u044f \u0432\u0430\u043c \u043d\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442.<\/p>\n<h3>\u0427\u0442\u043e \u043c\u044b \u0441\u0434\u0435\u043b\u0430\u0435\u043c<\/h3>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435-\u043f\u0440\u0438\u043c\u0435\u0440 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u0430 Next.js, \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u043e\u0431\u043b\u0430\u0447\u043d\u044b\u0435 \u0441\u0435\u0440\u0432\u0438\u0441\u044b Amazon (AWS), \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u0438\u0437\u0430\u0446\u0438\u044e \u0434\u043e\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u043c\u0435\u043d\u0438.<\/p>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0440\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u0435 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u0438 \u0438 \u0441\u0435\u0440\u0432\u0438\u0441\u044b:<\/p>\n<ul>\n<li>\n<p><strong>Next.js<\/strong>\u00a0\u2013 \u043c\u0435\u0442\u0430-\u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043d\u0430 \u0431\u0430\u0437\u0435\u00a0React.js\u00a0<a href=\"https:\/\/nextjs.org\/\" rel=\"noopener noreferrer nofollow\"><u>https:\/\/nextjs.org<\/u><\/a>, \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p><strong>Amazon S3<\/strong>\u00a0\u2013 \u043e\u0431\u043b\u0430\u0447\u043d\u043e\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u043e\u0435 \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0435\u00a0<a href=\"https:\/\/aws.amazon.com\/s3\/\" rel=\"noopener noreferrer nofollow\"><u>https:\/\/aws.amazon.com\/s3<\/u><\/a>, \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0432\u0435\u0431 \u0445\u043e\u0441\u0442\u0438\u043d\u0433\u0430.<\/p>\n<\/li>\n<li>\n<p><strong>Amazon CloudFront<\/strong>\u00a0\u2013\u00a0\u0432\u0435\u0431-\u0441\u0435\u0440\u0432\u0438\u0441 \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u0438 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430\u00a0<a href=\"https:\/\/aws.amazon.com\/cloudfront\/\" rel=\"noopener noreferrer nofollow\"><u>https:\/\/aws.amazon.com\/cloudfront<\/u><\/a>, \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0432\u0435\u0431 \u0441\u0435\u0440\u0432\u0435\u0440\u0430 \u0438 CDN.<\/p>\n<\/li>\n<li>\n<p><strong>AWS Lambda@Edge<\/strong>\u00a0\u2013 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0431\u0435\u0441\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0439 \u0432\u044b\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0439\u00a0<a href=\"https:\/\/aws.amazon.com\/lambda\/edge\/\" rel=\"noopener noreferrer nofollow\"><u>https:\/\/aws.amazon.com\/lambda\/edge<\/u><\/a>, \u0434\u043b\u044f \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0435\u043d\u0438\u044f \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u0438\u0437\u0430\u0446\u0438\u0438 \u0432 \u043c\u043d\u043e\u0433\u043e\u0441\u0442\u0440\u0430\u043d\u0438\u0447\u043d\u043e\u043c Next.js \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438.<\/p>\n<\/li>\n<li>\n<p><strong>Amazon Route 53<\/strong>\u00a0\u2013 \u0441\u043b\u0443\u0436\u0431\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0434\u043e\u043c\u0435\u043d\u043d\u044b\u0445 \u0438\u043c\u0435\u043d\u00a0<a href=\"https:\/\/aws.amazon.com\/route53\/\" rel=\"noopener noreferrer nofollow\"><u>https:\/\/aws.amazon.com\/route53<\/u><\/a>, \u0434\u043b\u044f \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0434\u043e\u043c\u0435\u043d\u043d\u044b\u043c \u0438\u043c\u0435\u043d\u0435\u043c.<\/p>\n<\/li>\n<\/ul>\n<h4>\u041a\u0430\u043a \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0438\u043d\u0444\u0440\u0430\u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/h4>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<ol>\n<li>\n<p>\u0417\u0430\u043f\u0440\u043e\u0441 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043f\u043e\u043f\u0430\u0434\u0430\u0435\u0442 \u0432 CloudFront (CDN).<\/p>\n<ul>\n<li>\n<p>\u0415\u0441\u043b\u0438 \u043e\u0442\u0432\u0435\u0442 \u043d\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u0437\u0430\u043f\u0440\u043e\u0441 \u0443\u0436\u0435 \u0437\u0430\u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d \u0432 CloudFront, \u0442\u043e\u00a0CloudFront \u0441\u0440\u0430\u0437\u0443 \u0432\u0435\u0440\u043d\u0435\u0442 \u043e\u0442\u0432\u0435\u0442 \u0438 \u0437\u0430\u043f\u0440\u043e\u0441 \u043d\u0435 \u043f\u043e\u0439\u0434\u0435\u0442 \u0434\u0430\u043b\u044c\u0448\u0435 \u043f\u043e \u0441\u0445\u0435\u043c\u0435.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>(\u0448\u0430\u0433 \u0434\u043b\u044f Next.js)<\/strong>\u00a0\u0417\u0430\u043f\u0440\u043e\u0441 \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432 Lambda@Edge (\u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0442\u0430\u043a\u0436\u0435 \u043a\u0430\u043a \u0438 CloudFront \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f Edge \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u043c, \u0442.\u0435. \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u044f\u0435\u0442\u0441\u044f \u043d\u0430 \u0432\u0441\u0435 \u0442\u043e\u0447\u043a\u0438 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u044f \u0441\u0435\u0442\u0438 \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u0438). \u0412 \u044d\u0442\u043e\u043c \u0441\u0435\u0440\u0432\u0438\u0441\u0435 \u043c\u044b \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c \u043a\u0430\u043a\u043e\u0439 \u0444\u0430\u0439\u043b \u0438\u0437 S3 bucket \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0432\u0435\u0440\u043d\u0443\u0442\u044c \u0432 \u043e\u0442\u0432\u0435\u0442 \u043d\u0430 \u0437\u0430\u043f\u0440\u043e\u0441.<\/p>\n<\/li>\n<li>\n<p>\u041c\u043e\u0434\u0438\u0444\u0438\u0446\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0438\u043b\u0438 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b\u044c\u043d\u044b\u0439 (\u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0435\u0433\u043e \u0448\u0430\u0433\u0430) URL \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432 S3 bucket. \u0413\u0434\u0435 \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u043b\u0438\u0431\u043e \u0444\u0430\u0439\u043b \u043b\u0438\u0431\u043e \u043e\u0448\u0438\u0431\u043a\u0443 \u043e \u0442\u043e\u043c \u0447\u0442\u043e \u0442\u0430\u043a\u043e\u0433\u043e \u0444\u0430\u0439\u043b\u0430 \u043d\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442.<\/p>\n<\/li>\n<li>\n<p>\u0424\u0430\u0439\u043b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 CloudFront, \u0433\u0434\u0435 \u043a\u044d\u0448\u0438\u0440\u0443\u0435\u0442\u0441\u044f. \u041e\u0448\u0438\u0431\u043a\u0438 \u043d\u0435 \u043a\u044d\u0448\u0438\u0440\u0443\u044e\u0442\u0441\u044f.<\/p>\n<\/li>\n<li>\n<p>CloudFront \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043e\u0442\u0432\u0435\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e. \u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 CloudFront \u0434\u0435\u043b\u0430\u0435\u0442 \u0437\u0430\u043f\u0440\u043e\u0441 \u043a S3 bucket \u043d\u0430 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0435 \u0437\u0430\u0440\u0430\u043d\u0435\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0433\u043e \u0444\u0430\u0439\u043b\u0430, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u043a \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 404.html.<\/p>\n<\/li>\n<\/ol>\n<h3>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 Next.js \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/h3>\n<p>\u041f\u0440\u0435\u0434\u0432\u0430\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0443 \u0432\u0430\u0441 \u0443\u0436\u0435 \u0434\u043e\u043b\u0436\u043d\u0430 \u0431\u044b\u0442\u044c \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u0430\u00a0<a href=\"https:\/\/nodejs.org\/en\/\" rel=\"noopener noreferrer nofollow\"><u>Node.js<\/u><\/a><\/p>\n<p>\u041c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a Next.js \u0441 Typescript \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0435\u0439. \u0427\u0442\u043e\u0431\u044b \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430\u0431\u0435\u0440\u0438\u0442\u0435 \u0432 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u043b\u0435:<\/p>\n<pre><code class=\"bash\">npx create-next-app@latest --typescript # \u0438\u043b\u0438 \u0435\u0441\u043b\u0438 \u0432\u044b \u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435\u0441\u044c yarn yarn create next-app --typescript  ? What is your project named? \u203a my-awesome-app cd my-awesome-app<\/code><\/pre>\n<p>\u0427\u0442\u043e\u0431\u044b \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c dev \u0441\u0435\u0440\u0432\u0435\u0440 \u0441 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c:<\/p>\n<pre><code class=\"bash\">npm run dev # \u0438\u043b\u0438 \u0435\u0441\u043b\u0438 \u0432\u044b \u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435\u0441\u044c yarn yarn dev<\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u043f\u0435\u0440\u0435\u0439\u0434\u0435\u0442\u0435 \u043f\u043e \u0430\u0434\u0440\u0435\u0441\u0443\u00a0<a href=\"http:\/\/localhost:3000\/\" rel=\"noopener noreferrer nofollow\"><u>http:\/\/localhost:3000<\/u><\/a>\u00a0\u0432\u044b \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0432\u0430\u0448\u0435 \u043d\u043e\u0432\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435:<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<h4>\u0414\u043e\u0431\u0430\u0432\u0438\u043c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b<\/h4>\n<p>\u0414\u043b\u044f \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0443\u0431\u0435\u0434\u0438\u0442\u044c\u0441\u044f \u0447\u0442\u043e \u0440\u043e\u0443\u0442\u0438\u043d\u0433 \u0432 \u043d\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043a\u0430\u043a \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u043e\u0434\u043d\u0443 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0443\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043d\u043e\u0432\u044b\u0439 \u0444\u0430\u0439\u043b \u00a0<code>pages\/about.tsx<\/code>, \u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043a\u043e\u0434:<\/p>\n<pre><code class=\"javascript\">\/\/ \u043f\u0440\u043e\u0441\u0442\u043e \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u0435\u0441\u044f \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u043c\u0438 \u0441\u0442\u0438\u043b\u044f\u043c\u0438 \u0438\u0437 \u0448\u0430\u0431\u043b\u043e\u043d\u0430 import styles from '..\/styles\/Home.module.css';  const About = () => {   return (     &lt;div className={styles.container}>       &lt;main className={styles.main}>         &lt;h1 className={styles.title}>\u041e \u043f\u0440\u043e\u0435\u043a\u0442\u0435&lt;\/h1>       &lt;\/main>     &lt;\/div>   ); };  export default About;<\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u043f\u043e \u0430\u0434\u0440\u0435\u0441\u0443\u00a0<a href=\"http:\/\/localhost:3000\/about\" rel=\"noopener noreferrer nofollow\"><u>http:\/\/localhost:3000\/about<\/u><\/a>\u00a0\u0443 \u0432\u0430\u0441 \u0431\u0443\u0434\u0435\u0442 \u043d\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u041c\u044b \u0442\u0430\u043a\u0436\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u043c \u043d\u0430\u0448\u0443 \u0434\u043e\u043c\u0430\u0448\u043d\u044e\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443, \u0443\u043f\u0440\u043e\u0441\u0442\u0438\u0432 \u0435\u0435 \u0438 \u0434\u043e\u0431\u0430\u0432\u0438\u0432 \u0441\u0441\u044b\u043b\u043a\u0443 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443\u00a0<code>\/about<\/code>.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u043c \u043a\u043e\u0434 \u0432 \u0444\u0430\u0439\u043b\u0435\u00a0<code>pages\/index.tsx<\/code>\u00a0, \u043f\u043e\u043f\u0443\u0442\u043d\u043e \u0443\u0431\u0435\u0440\u0435\u043c \u043b\u0438\u0448\u043d\u0435\u0435.<\/p>\n<pre><code class=\"typescript\">\/\/ ... const Home: NextPage = () => {   return (     \/\/ ...     &lt;p className={styles.description}>       &lt;Link href=\"\/about\">         &lt;a>\u041e \u043f\u0440\u043e\u0435\u043a\u0442\u0435 &amp;rarr;&lt;\/a>       &lt;\/Link>     &lt;\/p>     \/\/ ...   ); }; \/\/ ...<\/code><\/pre>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0414\u0430\u043b\u044c\u0448\u0435 \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0441\u043e\u0431\u0440\u0430\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u043a\u0441\u043f\u043e\u0440\u0442 \u0432 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u0445 Next.js \u0438\u043b\u0438 \u0432 \u0431\u043e\u043b\u0435\u0435 \u043e\u0431\u0449\u0435\u0439 \u0444\u043e\u0440\u043c\u0443\u043b\u0438\u0440\u043e\u0432\u043a\u0435: \u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0441\u0442\u0438 Static Site Generation.<\/p>\n<pre><code class=\"bash\">npm run build # \u0438\u043b\u0438 \u0435\u0441\u043b\u0438 \u0432\u044b \u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435\u0441\u044c yarn yarn build # \u044d\u043a\u0441\u043f\u043e\u0440\u0442 \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0444\u0430\u0439\u043b\u043e\u0432 npx next export<\/code><\/pre>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0447\u0435\u0433\u043e \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u0438\u00a0<code>out<\/code>\u00a0\u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442\u043e\u0432 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u043c\u0435\u0442\u044c \u0444\u0430\u0439\u043b\u044b \u0434\u043b\u044f \u043d\u0430\u0448\u0435\u0433\u043e \u043c\u043d\u043e\u0433\u043e\u0441\u0442\u0440\u0430\u043d\u0438\u0447\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f:<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u041d\u0430 \u044d\u0442\u043e\u043c \u043c\u044b \u0437\u0430\u043a\u0430\u043d\u0447\u0438\u0432\u0430\u0435\u043c \u0440\u0430\u0431\u043e\u0442\u0443 \u043d\u0430\u0434 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c.<\/p>\n<h3>\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u00a0AWS S3<\/h3>\n<p>\u041a\u0430\u043a \u0443\u0436\u0435 \u0431\u044b\u043b\u043e \u0441\u043a\u0430\u0437\u0430\u043d\u043e \u0440\u0430\u043d\u0435\u0435 \u0441\u0435\u0440\u0432\u0438\u0441 AWS S3 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u0444\u0430\u0439\u043b\u043e\u0432 \u043d\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<p>\u0414\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u0440\u0430\u0431\u043e\u0442\u044b \u0437\u0430\u043b\u043e\u0433\u0438\u043d\u044c\u0442\u0435\u0441\u044c \u0432\u00a0<a href=\"https:\/\/console.aws.amazon.com\/console\" rel=\"noopener noreferrer nofollow\"><u>AWS Console<\/u><\/a>\u00a0\u0438 \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b Amazon S3.<\/p>\n<p>\u0414\u0430\u043b\u0435\u0435 \u043d\u0430\u0436\u043c\u0438\u0442\u0435 \u043d\u0430\u00a0<code>Create bucket<\/code>\u00a0\u0438 \u0438 \u0443\u043a\u0430\u0436\u0438\u0442\u0435 \u0438\u043c\u044f (Bucket name)<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0412\u0441\u0435 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043c\u043e\u0436\u043d\u043e \u043e\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e.<\/p>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f S3 bucket, \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u0432 \u043d\u0435\u0433\u043e \u0438 \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u0435 \u0430\u0440\u0442\u0435\u0444\u0430\u043a\u0442\u044b \u0441\u0431\u043e\u0440\u043a\u0438 \u0432\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0415\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435 \u0447\u0442\u043e \u043d\u0430\u043c \u043e\u0441\u0442\u0430\u043b\u043e\u0441\u044c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0441 S3 \u044d\u0442\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0444\u0430\u0439\u043b\u0430\u043c \u0438\u0437 \u0434\u0440\u0443\u0433\u0438\u0445 \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u0432, \u043d\u043e \u0434\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0442\u0430\u043a\u043e\u0439 \u0441\u0435\u0440\u0432\u0438\u0441-\u043f\u043e\u0442\u0440\u0435\u0431\u0438\u0442\u0435\u043b\u044c.<\/p>\n<h3>\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u00a0AWS CloudFront<\/h3>\n<p>\u0412\u0441\u0435 \u0442\u0430\u043a\u0436\u0435 \u043e\u0441\u0442\u0430\u0432\u0430\u044f\u0441\u044c \u0432 AWS Console, \u043d\u0430\u0431\u0435\u0440\u0438\u0442\u0435 \u0432 \u043f\u043e\u0438\u0441\u043a\u0435\u00a0<code>CloudFront<\/code>\u00a0, \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u043a \u0441\u0435\u0440\u0432\u0438\u0441\u0443 \u0438 \u0432 \u043f\u043e\u044f\u0432\u0438\u0432\u0448\u0435\u043c\u0441\u044f \u043e\u043a\u043d\u0435 \u043d\u0430\u0436\u043c\u0438\u0442\u0435 \u043a\u043d\u043e\u043f\u043a\u0443\u00a0<code>Create distribution<\/code>.<\/p>\n<ul>\n<li>\n<p>\u0412 \u043f\u043e\u043b\u0435\u00a0<code>Origin domain<\/code>\u00a0\u0432\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0438\u0437 \u0441\u043f\u0438\u0441\u043a\u0430 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0439 \u0440\u0430\u043d\u0435\u0435 S3 bucket.<\/p>\n<\/li>\n<li>\n<p>\u0412 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<code>Origin access<\/code>\u00a0\u0432\u044b\u0431\u0435\u0440\u0438\u0442\u0435 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u00a0<code>Origin access control settings<\/code>. \u042d\u0442\u043e\u0442 \u0440\u0435\u0436\u0438\u043c \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u0442 \u043d\u0430\u043c \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u043a \u0445\u0440\u0430\u043d\u0438\u043b\u0438\u0449\u0443 S3 \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u043e\u0434\u043d\u043e\u0433\u043e \u0441\u0435\u0440\u0432\u0438\u0441\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u043c \u0431\u0443\u0434\u0435\u0442 \u044f\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u043d\u0430\u0448\u0430 CloudFront \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0436\u043c\u0438\u0442\u0435 \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0443\u00a0<code>Create control setting<\/code>\u00a0\u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u0434\u043e\u0441\u0442\u0443\u043f\u0430. \u041a\u0430\u043a \u0443\u043a\u0430\u0437\u0430\u043d\u043e \u0432 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u043c \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0438\u00a0<code>You must update the S3 bucket policy<\/code>\u00a0\u043c\u044b \u0435\u0449\u0435 \u0432\u0435\u0440\u043d\u0435\u043c\u0441\u044f \u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043d\u0430\u0448\u0435\u0433\u043e CloudFront Distribution, \u043f\u043e\u0441\u043b\u0435 \u0435\u0433\u043e \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f, \u0447\u0442\u043e\u0431\u044b \u0437\u0430\u043a\u043e\u043d\u0447\u0438\u0442\u044c \u0448\u0430\u0433\u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0430.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u041d\u0438\u0436\u0435, \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<code>Default cache behavior<\/code>:<\/p>\n<ul>\n<li>\n<p>\u0412\u043a\u043b\u044e\u0447\u0438\u043c \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u0441\u0436\u0430\u0442\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0445. CloudFront \u0431\u0443\u0434\u0435\u0442 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0441\u0436\u0438\u043c\u0430\u0442\u044c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b, \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c\u044b\u0435 \u0438\u0437 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u0430 (\u0432 \u043d\u0430\u0448\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435 S3 bucket), \u043f\u0435\u0440\u0435\u0434 \u0438\u0445 \u0434\u043e\u0441\u0442\u0430\u0432\u043a\u043e\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e. CloudFront \u0441\u0436\u0438\u043c\u0430\u0435\u0442 \u0444\u0430\u0439\u043b\u044b \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0442\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u0435\u0441\u043b\u0438 \u0431\u0440\u0430\u0443\u0437\u0435\u0440 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u044d\u0442\u043e, \u043a\u0430\u043a \u0443\u043a\u0430\u0437\u0430\u043d\u043e \u0432 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0435 Accept-Encoding \u0432 \u0437\u0430\u043f\u0440\u043e\u0441\u0435.<\/p>\n<\/li>\n<li>\n<p>\u0412\u044b\u0431\u0435\u0440\u0435\u043c \u043e\u043f\u0446\u0438\u044e\u00a0<code>Redirect HTTP to HTTPS<\/code>\u00a0\u0434\u043b\u044f \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u043d\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u0443 HTTPS. \u0418 \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441 \u0435\u0441\u043b\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0412\u0441\u0435 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043e\u0441\u0442\u0430\u0432\u0438\u043c \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0438 \u043d\u0430\u0436\u043c\u0435\u043c \u043a\u043d\u043e\u043f\u043a\u0443 \u0441\u043e\u0437\u0434\u0430\u0442\u044c.<\/p>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u044b \u0431\u0443\u0434\u0435\u043c \u043e\u0442\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043e\u0442\u0432\u0435\u0442\u0430 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e:<\/p>\n<ul>\n<li>\n<p><strong>Default root object<\/strong>\u00a0\u2013\u00a0\u0431\u0443\u0434\u0435\u043c \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0442\u044c\u00a0<code>index.html<\/code><\/p>\n<\/li>\n<li>\n<p><strong>Error pages<\/strong>\u00a0(\u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043e\u0448\u0438\u0431\u043e\u043a) \u2013\u00a0\u0431\u0443\u0434\u0435\u043c \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0442\u044c\u00a0<code>404.html<\/code>\u00a0\u0434\u043b\u044f Next.js \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438\u043b\u0438 \u0432\u0441\u0435 \u0442\u043e\u0442 \u0436\u0435\u00a0<code>index.html<\/code>, \u0435\u0441\u043b\u0438 \u0432\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u043e \u043d\u0430 \u0431\u0430\u0437\u0435 Create React App, \u0438 \u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0438\u043c\u0435\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u0439 \u0440\u043e\u0443\u0442\u0438\u043d\u0433.<\/p>\n<\/li>\n<\/ul>\n<p>\u0414\u043b\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438\u00a0<strong>Default root object<\/strong>\u00a0\u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u043d\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u0432\u0430\u0448\u0435\u0433\u043e CloudFront Distribution \u21d2 General \u0438 \u0432 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u00a0<code>Settings<\/code>\u00a0\u043d\u0430\u0436\u043c\u0438\u0442\u0435 \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0443\u00a0<code>Edit<\/code>. \u0417\u0430\u0442\u0435\u043c \u0443\u043a\u0430\u0436\u0438\u0442\u0435 \u0432 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0435\u043c \u0440\u0430\u0437\u0434\u0435\u043b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u00a0<code>index.html<\/code>\u00a0\u0438 \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f.<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0414\u043b\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0441\u0442\u0440\u0430\u043d\u0438\u0446 \u043e\u0448\u0438\u0431\u043e\u043a \u043f\u0435\u0440\u0435\u0439\u0434\u0438\u0442\u0435 \u043d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0443\u00a0<strong>Error pages<\/strong>\u00a0\u0438 \u043d\u0430\u0436\u043c\u0438\u0442\u0435 \u043a\u043d\u043e\u043f\u043a\u0443\u00a0<code>Create error page response<\/code>. \u0421\u043e\u0437\u0434\u0430\u0439\u0442\u0435 \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u0438 \u0434\u043b\u044f \u043e\u0448\u0438\u0431\u043e\u043a 404 \u0438 403 \u043a\u0430\u043a \u0443\u043a\u0430\u0437\u0430\u043d\u043e \u043d\u0430 \u0440\u0438\u0441\u0443\u043d\u043a\u0435 \u043d\u0438\u0436\u0435:<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<hr\/>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0447\u0430\u043d\u0438\u0435 (\u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f CRA):<\/strong>\u00a0\u0415\u0441\u043b\u0438 \u0432\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u043e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e Create React App \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0443\u044e \u043a\u043e\u043d\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u044e (\u0434\u043b\u044f \u043e\u0448\u0438\u0431\u043e\u043a 404 \u0438 403):<\/p>\n<ul>\n<li>\n<p>Response page path:\u00a0<strong>\/index.html<\/strong><\/p>\n<\/li>\n<li>\n<p>HTTP Response code:\u00a0<strong>200: OK<\/strong><\/p>\n<\/li>\n<\/ul>\n<p>\u0412\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0431\u0443\u0434\u0435\u0442 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u0440\u043e\u0443\u0442\u0438\u043d\u0433 \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0432 \u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u043e\u043c \u043a\u043e\u0434\u0435 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435.<\/p>\n<hr\/>\n<p>\u0415\u0441\u043b\u0438 \u043f\u043e\u0441\u043b\u0435 \u0432\u0441\u0435\u0445 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u043f\u043e\u0434\u043e\u0436\u0434\u0430\u0442\u044c \u043a\u043e\u0433\u0434\u0430 CloudFront Distribution \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442, \u0442\u043e \u043f\u0435\u0440\u0435\u0439\u0434\u044f \u043f\u043e \u0441\u0441\u044b\u043b\u043a\u0435\u00a0<strong>Distribution domain name<\/strong>\u00a0\u0432\u044b \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0435 \u00ab\u0412 \u0434\u043e\u0441\u0442\u0443\u043f\u0435 \u043e\u0442\u043a\u0430\u0437\u0430\u043d\u043e\u00bb.<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0427\u0442\u043e\u0431\u044b \u0440\u0430\u0437\u0440\u0435\u0448\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0444\u0430\u0439\u043b\u0430\u043c S3 bucket \u0438\u0437 \u043d\u0430\u0448\u0435\u0433\u043e CloudFront distribution \u0434\u043e\u0431\u0430\u0432\u0438\u043c \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0430.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0437\u0430\u0439\u0434\u0435\u043c\u00a0<strong>CloudFront \u21d2 Distributions \u21d2 \u0412\u0430\u0448\u0430 \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u044f<\/strong>, \u0432\u043e \u0432\u043a\u043b\u0430\u0434\u043a\u0435\u00a0<strong>Origins<\/strong>\u00a0\u0432\u044b\u0431\u0435\u0440\u0435\u043c \u043d\u0430\u0448 S3 origin \u0438 \u043d\u0430\u0436\u043c\u0435\u043c\u00a0<code>Edit<\/code>.<\/p>\n<p>\u0412 \u043e\u0442\u043a\u0440\u044b\u0432\u0448\u0435\u043c\u0441\u044f \u043e\u043a\u043d\u0435 \u0441\u043a\u043e\u043f\u0438\u0440\u0443\u0435\u043c \u043f\u043e\u043b\u0438\u0442\u0438\u043a\u0443 \u0434\u043e\u0441\u0442\u0443\u043f\u0430\u00a0<strong>Origin access \u21d2<\/strong>\u00a0<code>Copy policy<\/code>\u00a0\u0438 \u043f\u0435\u0440\u0435\u0439\u0434\u0435\u043c \u043a \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c S3 bucket\u00a0<code>Go to S3 bucket permissions<\/code>.<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0414\u0430\u043b\u0435\u0435 \u043e\u0442\u0440\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u0443\u0435\u043c \u043f\u043e\u043b\u0438\u0442\u0438\u043a\u0438 \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u0434\u043b\u044f S3 bucket\u00a0<strong>Bucket policy \u21d2 Edit<\/strong>. \u0412\u0441\u0442\u0430\u0432\u0438\u043c \u0441\u043a\u043e\u043f\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0443\u044e \u043f\u043e\u043b\u0438\u0442\u0438\u043a\u0443 (\u0438\u043d\u043e\u0433\u0434\u0430 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0443\u0431\u0440\u0430\u0442\u044c \u043b\u0438\u0448\u043d\u0438\u0435 \u043f\u0440\u043e\u0431\u0435\u043b\u044b \u0432 JSON, \u044d\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0432 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0435 \u043a\u043e\u0434\u0430 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e Prettier).<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0447\u0435\u0433\u043e \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u043c \u043f\u043e\u043b\u0438\u0442\u0438\u043a\u0438 \u0438 \u0441\u043d\u043e\u0432\u0430 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0440\u0430\u0431\u043e\u0442\u043e\u0441\u043f\u043e\u0441\u043e\u0431\u043d\u043e\u0441\u0442\u044c \u0441\u0430\u0439\u0442\u0430. \u0412\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u0438\u043c\u0435\u0442\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0443\u0432\u0438\u0434\u0435\u0442\u044c \u0434\u043e\u043c\u0430\u0448\u043d\u044e\u044e \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443.<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u043f\u0435\u0440\u0435\u0439\u0434\u0435\u0442\u0435 \u043f\u043e \u0441\u0441\u044b\u043b\u043a\u0435\u00a0<strong>\u00abO \u043f\u0440\u043e\u0435\u043a\u0442\u0435\u00bb<\/strong>\u00a0\u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443\u00a0<code>\/about<\/code>\u00a0\u2013\u00a0\u043a\u043b\u0438\u0435\u043d\u0442\u0441\u043a\u0438\u0439 \u0440\u043e\u0443\u0442\u0438\u043d\u0433 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u043f\u0435\u0440\u0435\u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443\u00a0<strong>about<\/strong>\u00a0\u0438\u043b\u0438 \u0437\u0430\u0439\u0434\u0435\u0442\u0435 \u043f\u043e \u043f\u0440\u044f\u043c\u043e\u0439 \u0441\u0441\u044b\u043b\u043a\u0435\u00a0<code>\/about<\/code>\u00a0\u2013 \u0442\u043e \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443 \u043e\u0448\u0438\u0431\u043a\u0438\u00a0<strong>404.<\/strong>\u00a0\u041e\u0434\u043d\u0430\u043a\u043e \u0435\u0441\u043b\u0438 \u0437\u0430\u0439\u0434\u0435\u0442\u0435 \u043f\u043e \u0441\u0441\u044b\u043b\u043a\u0435\u00a0<code>\/about.html<\/code>\u00a0\u2013 \u0441\u043d\u043e\u0432\u0430 \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0443\u00a0<strong>about<\/strong>.<\/p>\n<p>\u0412\u044b \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0443\u0436\u0435 \u0434\u043e\u0433\u0430\u0434\u0430\u043b\u0438\u0441\u044c \u0447\u0442\u043e \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0437\u0430\u043f\u0440\u043e\u0441\u044b \u0432\u0438\u0434\u0430\u00a0<code>about<\/code>\u00a0\u0432\u00a0<code>\/about.html<\/code>.<\/p>\n<p>\u0412\u044b\u0448\u0435\u0441\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u0435 \u043a\u0430\u0441\u0430\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043c\u043d\u043e\u0433\u043e\u0441\u0442\u0440\u0430\u043d\u0438\u0447\u043d\u044b\u0445 \u0441\u0430\u0439\u0442\u043e\u0432, \u0435\u0441\u043b\u0438 \u0436\u0435 \u0432\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 Create React App \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u0440\u043e\u0434\u0430 Single Page Application (SPA), \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u0440\u0430\u0437\u0434\u0435\u043b \u0432\u0430\u043c \u043d\u0435 \u043d\u0443\u0436\u0435\u043d, \u043f\u0440\u043e\u043f\u0443\u0441\u0442\u0438\u0442\u0435 \u0435\u0433\u043e.<\/p>\n<h3>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435\u00a0AWS\u00a0Lambda@Edge<\/h3>\n<p><strong>(\u0434\u043b\u044f Next.js \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f)<\/strong><\/p>\n<p>\u041a\u0430\u043a \u0443\u0436\u0435 \u0431\u044b\u043b\u043e \u0441\u043a\u0430\u0437\u0430\u043d\u043e, AWS Lambda@Edge \u044d\u0442\u043e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0431\u0435\u0441\u0441\u0435\u0440\u0432\u0435\u0440\u043d\u044b\u0439 \u0432\u044b\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0439, \u043a\u0430\u043a \u0432\u0438\u0434\u043d\u043e \u0438\u0437 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f, \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f Edge \u0441\u0435\u0440\u0432\u0438\u0441\u043e\u043c.<\/p>\n<p>Lambda@Edge \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d\u044b \u043a CloudFront \u0434\u0438\u0441\u0442\u0440\u0438\u0431\u0443\u0446\u0438\u0438 \u0438 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u044f\u044e\u0442\u0441\u044f \u043d\u0430 \u0432\u0441\u0435 \u0440\u0435\u0433\u0438\u043e\u043d\u044b \u0438 \u0442\u043e\u0447\u043a\u0438 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u044f \u0432\u0430\u0448\u0435\u0433\u043e CloudFront.<\/p>\n<p>\u042d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442 \u0447\u0442\u043e \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0435\u043c\u043e\u043c\u0443 \u0432 Lambda@Edge \u0437\u0430\u043f\u0440\u043e\u0441\u0443 \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u0445\u043e\u0434\u0438\u0442\u044c \u0432 \u0433\u0435\u043e\u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438 \u0443\u0434\u0430\u043b\u0435\u043d\u043d\u044b\u0439 \u043e\u0442 CDN \u0440\u0435\u0433\u0438\u043e\u043d, \u0438 \u043a\u0430\u043a \u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0435 \u0437\u0430\u043f\u0440\u043e\u0441 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u043d \u043e\u0447\u0435\u043d\u044c \u0431\u044b\u0441\u0442\u0440\u043e.<\/p>\n<h4>\u0421\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u044b<\/h4>\n<p>\u0412 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0435\u043c \u0448\u0430\u0433\u0435 \u043c\u044b \u0432\u044b\u044f\u0441\u043d\u0438\u043b\u0438 \u0447\u0442\u043e \u0434\u043b\u044f web \u0441\u0442\u0440\u0430\u043d\u0438\u0446 Next.js \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u0442\u00a0<strong>html<\/strong>\u00a0\u0444\u0430\u0439\u043b\u044b. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0437\u0430\u043f\u0440\u043e\u0441\u0430 \u043a \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0435 \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u043e\u0434\u043c\u0435\u043d\u0438\u0442\u044c \u0430\u0434\u0440\u0435\u0441 \u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 (URI):<\/p>\n<pre><code>\/about => \/about.html \/posts\/how-to-deploy-react-app => \/posts\/how-to-deploy-react-app.html ... <\/code><\/pre>\n<p>Amazon AWS \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0441\u0440\u0435\u0434\u0443 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f Node.js \u0434\u043b\u044f \u0441\u0432\u043e\u0438\u0445 lambda \u0444\u0443\u043d\u043a\u0446\u0438\u0439, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u0441\u0435 \u0447\u0442\u043e \u043d\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e, \u044d\u0442\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043f\u0440\u043e\u0441\u0442\u0443\u044e Javascript \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u043f\u043e\u0434\u043c\u0435\u043d\u044b \u0430\u0434\u0440\u0435\u0441\u0430.<\/p>\n<p><a href=\"https:\/\/docs.aws.amazon.com\/lambda\/latest\/dg\/lambda-edge.html\" rel=\"noopener noreferrer nofollow\"><u>\u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f \u043f\u043e\u00a0<\/u><strong><u>Lambda@Edge<\/u><\/strong><\/a><\/p>\n<p>\u0421\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0443\u044e lambda \u0444\u0443\u043d\u043a\u0446\u0438\u044e:<\/p>\n<pre><code class=\"javascript\">\/\/ \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043c \u043d\u0430\u043b\u0438\u0447\u0438\u0435 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f \u0434\u043b\u044f JS, CSS, IMG \u0444\u0430\u0439\u043b\u043e\u0432 const hasExtension = \/(.+).[a-zA-Z0-9]{2,5}$\/;  \/\/ \u0434\u043b\u044f index \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u044b \u043d\u0430\u043c \u043d\u0435\u0442 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043f\u043e\u0434\u043c\u0435\u043d\u044f\u0442\u044c uri, \u0442\u0430\u043a \u043a\u0430\u043a \/\/ \u044d\u0442\u043e \u043d\u0430\u0448\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430 \u00ab\u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e\u00bb (\u0441\u043c. Default root object \u0432 \u0441\u0442\u0430\u0442\u044c\u0435 \u0432\u044b\u0448\u0435) const isIndex = (uri) => uri === '\/';<\/code><\/pre>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-339760","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/339760","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=339760"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/339760\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=339760"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=339760"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=339760"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}