Zero Configuration Next.js 10/11 Server Component для AWS Lambda@Edge, нацеленная на полную функцию функции.
Пожалуйста, просмотрите функции для списка поддерживаемых в настоящее время функций.
️ Этот Readme отражает последние изменения вmasterветви. Это может или не может быть опубликовано вlatest(стабильном) илиalpha-релизе в NPM. Пожалуйста, перейдите к выпускам, найдите правильную версию@sls-next/serverless-componentвы используете, и откройте для этого выпуска Readme для более точной информации. Если функция перечислена в этом Readme, но не работает, сначала попробуйте обновление до самого последнего релизаalphaв NPM.
В настоящее время это использует бета -версию без серверов (не GA версия), поскольку проект был запущен до GA. В настоящее время мы перерабатываем, как будут работать развертывания в будущем, и изучение лучших решений IAC, таких как CDK, CDK для Terraform и т. Д., И сделаем объявление до конца года по любым обновлениям.
Со времени Next.js 8.0 был введен режим без сервера, который обеспечивает новый API низкого уровня, который, как это может использовать для развертывания на разных облачных провайдерах. Тем не менее, Next.js не предоставляет полную логику маршрутизации без сервера, поэтому этот проект необходим для заполнения пробела. Долгосрочное видение состоит в том, чтобы позволить вам самостоятельно с различными облаками, начиная с AWS.
Этот проект представляет собой лучшую версию плагина без сервера, которая фокусируется на решении основных проблем, таких как следующие 9 поддержки, лучший опыт разработки, ограничение и производительность 200 облачных сформирования.
На конфигурации практически нет конфигурации. Вы можете расширить значения по умолчанию в зависимости от потребностей в приложении.
Пользователи этого компонента должны иметь возможность использовать инструменты разработки next.js, он же next dev . Работа компонента - развертывать ваше приложение, обеспечивающее паритет со всеми функциями следующих, которые мы знаем и любим. Мы стараемся эмулировать всю или большую часть логики маршрутизации и сервера от Next.js и оптимизировать ее для среды без сервера. Ниже вы можете найти список функций, которые в настоящее время поддерживаются.
Благодаря упрощенной архитектуре и без использования облачной информации, нет ограничений для того, сколько страниц вы можете иметь в своем приложении, плюс время развертывания очень быстро! За исключением времени распространения CloudFront, конечно.
Поскольку мы подражаем логике маршрутизации следующей. Следующие показаны все поддерживаемые функции или запланированные функции. Если флажок установлен, это означает, что функция поддерживается. В противном случае он, вероятно, еще не поддерживается или в настоящее время находится на этапе планирования или внедрения. Пожалуйста, обратитесь к описанию элемента для конкретных деталей.
Обратите внимание, что некоторые функции могут быть только на последней версии альфа. Если функция указана как поддерживаемая, но не работает над latest тегом, она, скорее всего, находится в alpha -теге. Если вы можете, пожалуйста, помогите нам протестировать последние альфа -изменения и отправить отчет об ошибке, если вы найдете какие -либо проблемы. Спасибо!
Есть ли функция, которую вы хотите, но еще не поддерживаются? Пожалуйста, откройте новый вопрос, чтобы сообщить нам!
/_next/* Служил из CloudFront. getStaticProps . getServerSideProps . getStaticPaths . _next/static/* и static/* , поскольку к ним не прикреплены обработчики Lambda. Обратите внимание, что новый has соответствующий формат (https://nextjs.org/docs/api-reference/next.config.js/redirects#header-cookie-and-query-matching), еще не поддерживается. _next/static/* и static/* , поскольку к этим поведению кеша нет прикрепленных обработчиков лямбды. Обратите внимание, что новый has соответствующий формат (https://nextjs.org/docs/api-reference/next.config.js/redirects#header-cookie-and-query-matching), еще не поддерживается. _next/static/* и static/* , поскольку к этим поведению в кеше не прикреплены обработчики лямбды. Обратите внимание, что новый has соответствующий формат (https://nextjs.org/docs/api-reference/next.config.js/redirects#header-cookie-and-query-matching), еще не поддерживается. next-i18next . Во -первых, убедитесь, что у вас установлен Node.js 12+ на машине развертывания, поскольку весь код теперь транспильтируется в ES2019. Добавьте следующее приложение в Serverless.yml:
# serverless.yml
myNextApplication :
component : " @sls-next/serverless-component@{version_here} " # it is recommended you pin the latest stable version of serverless-next.js Если вы указываете @sls-next/serverless-component в вашем файле serverless.yml , не добавляйте @sls-next/serverless-component в свой файл package.json, он не используется, и используется только версия в файле serverless.yml , которая сама по себе не используется из NPM. Если вы не указали версию, она будет использовать latest тег, которая относится к последней стабильной версии здесь (то есть не альфа -версии).
Вы также можете указать на локальную установку, например, если вы хотите версию, используя package.json .
В этом случае настройте следующее:
# serverless.yml
myNextApplication :
component : " ./node_modules/@sls-next/serverless-component "Затем установите свои учетные данные AWS в качестве переменных среды:
AWS_ACCESS_KEY_ID=accesskey
AWS_SECRET_ACCESS_KEY=sshhhИ просто развернуть:
$ serverlessЕсли у вас есть проблемы, развертывающиеся из -за новой версии без сервера, попробуйте прикрепить к конкретной версии, например 2.72.2. См. #2320 (комментарий)
[Alpha-Может быть, Buggy] Вы также можете развернуть с использованием npx @sls-next/serverless-patched (или serverless-patched если вы установили его локально), которая представляет собой исправленную версию serverless , которая решает пару проблем, исправляя базовые @serverless/cli : (1) непрерывные «развертывающие» сообщения, которые печатаются в неинтерных терминах (EG CI CI, и, E, используются, что CI-выводы), которые не используются, и это непревзойденные выводы), которые не являются выводами. Обращается молчаливым сбоями.
Также рекомендуется добавить --debug Flag, чтобы получить более полезные журналы того, что происходит за кулисами.
Не пытайтесь развернуть, используя serverless deploy , используйте только serverless
В большинстве случаев вы не захотите использовать домен распределения CloudFront для доступа к вашему приложению. Вместо этого вы можете указать пользовательское доменное имя.
Вы можете использовать любое доменное имя, но вы должны использовать AWS Route53 для вашего хостинга DNS. Чтобы перенести записи DNS из существующего домена, следуйте инструкциям здесь. Требования к использованию пользовательского доменного имени:
mydomain.com ) с набором имен.Компонент без сервера Next.js автоматически генерирует сертификат SSL и создаст новую запись, чтобы указать на ваше распределение CloudFront.
# serverless.yml
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
domain : " example.com " # sub-domain defaults to www
domainMinimumProtocolVersion : " TLSv1.2_2018 " # can be omitted, defaults to "TLSv1.2_2018" Вы также можете настроить subdomain :
# serverless.yml
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
domain : ["sub", "example.com"] # [ sub-domain, domain ] Чтобы указать свои собственные входы CloudFront, просто добавьте любые входы AWS-Cloudfront в cloudfront :
# serverless.yml
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
cloudfront :
# if you want to use an existing cloudfront distribution, provide it here
distributionId : XYZEXAMPLE # optional
# this is the default cache behaviour of the cloudfront distribution
# the origin-request edge lambda associated to this cache behaviour does the pages server side rendering
defaults :
forward :
headers :
[
CloudFront-Is-Desktop-Viewer,
CloudFront-Is-Mobile-Viewer,
CloudFront-Is-Tablet-Viewer
]
# this is the cache behaviour for next.js api pages
api :
minTTL : 10
maxTTL : 10
defaultTTL : 10
# you can set other cache behaviours like "defaults" above that can handle server side rendering
# but more specific for a subset of your next.js pages
/blog/* :
minTTL : 1000
maxTTL : 1000
defaultTTL : 1000
forward :
cookies : " all "
queryString : false
/about :
minTTL : 3000
maxTTL : 3000
defaultTTL : 3000
# you can add custom origins to the cloudfront distribution
origins :
- url : /static
pathPatterns :
/wp-content/* :
minTTL : 10
maxTTL : 10
defaultTTL : 10
- url : https://old-static.com
pathPatterns :
/old-static/* :
minTTL : 10
maxTTL : 10
defaultTTL : 10
- url : http://old-api.com
protocolPolicy : http-only
pathPatterns :
/old-api/* :
minTTL : 10
maxTTL : 10
defaultTTL : 10
aliases : ["foo.example.com", "bar.example.com"]
priceClass : " PriceClass_100 "
# You can add custom error responses
errorPages :
- code : 503
path : " /503.html "
minTTL : 5 # optional, minimum ttl the error is cached (default 10)
responseCode : 500 # optional, alters the response code
comment : " a comment " # optional, describes your distribution
webACLId : " arn:aws:wafv2:us-east-1:123456789012:global/webacl/ExampleWebACL/473e64fd-f30b-4765-81a0-62ad96dd167a " # ARN of WAF
restrictions :
geoRestriction :
restrictionType : " blacklist " # valid values are whitelist/blacklist/none. Set to "none" and omit items to disable restrictions
items : ["AA"] # ISO 3166 alpha-2 country codes
certificate :
cloudFrontDefaultCertificate : false # specify false and one of IAM/ACM certificates, or specify true and omit IAM/ACM inputs for default certificate
acmCertificateArn : " arn:aws:acm:us-east-1:123456789012:certificate/12345678-1234-1234-1234-123456789012 "
iamCertificateId : " iam-certificate-id " # specify either ACM or IAM certificate, not both
sslSupportMethod : " sni-only " # can be omitted, defaults to "sni-only"
minimumProtocolVersion : " TLSv1.2_2019 " # can be omitted, defaults to "TLSv1.2_2019"
originAccessIdentityId : XYZEXAMPLE # optional
paths : ["/*"] # which paths should be invalidated on deploy, default matches everything, empty array skips invalidation completely
waitBeforeInvalidate : true # by default true, it waits for the CloudFront distribution to have completed before invalidating, to avoid possibly caching old page
tags : # Add any tags you want
tag1 : val1
tag2 : val2Это особенно полезно для кэширования любых ваших страниц. Смотрите это для примера приложения с пользовательской конфигурацией кэша. Вы также можете обновить существующее распределение CloudFront, используя пользовательские входы CloudFront.
Статически визуализированные страницы (то есть HTML-страницы, которые загружены на S3) имеют следующий набор контроля кэша:
cache-control: public, max-age=0, s-maxage=2678400, must-revalidate
s-maxage позволяет CloudFront кэшировать страницы в местах края в течение 31 дня. max-age=0 в сочетании с must-revalidate гарантируйте, что браузеры никогда не кэшируют статические страницы. Это позволяет CloudFront быть полностью контролируется кэширование TTL. При каждом развертывании создается недействительность /* , чтобы пользователи получали свежий контент.
По умолчанию общие форматы изображений ( gif|jpe?g|jp2|tiff|png|webp|bmp|svg|ico ) под /public или /static папкам имеет однолетнюю политику Cache-Control ( public, max-age=31536000, must-revalidate ). Вы можете настроить либо value заголовка Cache-Control , так и резервную экспозицию, на которую test файлы, с publicDirectoryCache :
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
publicDirectoryCache :
value : public, max-age=604800
test : /.(gif|jpe?g|png|txt|xml)$/i value должно быть действительной политикой Cache-Control , и test должен быть действительным regex типов файлов, которые вы хотите протестировать. Если вы не хотите, чтобы браузеры кэшировали активы из публичного каталога, вы можете отключить это:
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
publicDirectoryCache : falseПо умолчанию функции Lambda@Edge выполняются с использованием awslambdabasicexecutionrole, которая позволяет только загружать журналы в CloudWatch. Если вам нужны разрешения за пределами этого, например, доступ к DynamoDB или любой другой ресурс AWS, вам понадобится собственная политика или роль Arn:
# serverless.yml
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
policy : " arn:aws:iam::123456789012:policy/MyCustomPolicy " # serverless.yml
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
roleArn : " arn:aws:iam::123456789012:role/MyCustomLambdaRole "Убедитесь, что вы добавляете разрешения журнала CloudWatch в свою пользовательскую политику или роль. Минимальная политика json Пример:
{
"Version" : " 2012-10-17 " ,
"Statement" : [
{
"Effect" : " Allow " ,
"Resource" : " * " ,
"Action" : [
" logs:CreateLogGroup " ,
" logs:CreateLogStream " ,
" logs:PutLogEvents "
]
},
{
"Effect" : " Allow " ,
"Resource" : " arn:aws:s3:::s3-deployment-bucket-name/* " ,
"Action" : [ " s3:GetObject " , " s3:PutObject " ]
}
]
} Роль должна включать в себя доверительные отношения с lambda.amazonaws.com и edgelambda.amazonaws.com .
ПРИМЕЧАНИЕ . Укажите bucketName и дайте разрешения на доступ к этому ведру через policy или roleArn , чтобы по умолчанию и API Lambdas могли получить доступ к статическим ресурсам.
Исчерпывающий список действий AWS, необходимых для развертывания:
"acm:DescribeCertificate", // only for custom domains
"acm:ListCertificates", // only for custom domains
"acm:RequestCertificate", // only for custom domains
"cloudfront:CreateCloudFrontOriginAccessIdentity",
"cloudfront:CreateDistribution",
"cloudfront:CreateInvalidation",
"cloudfront:GetDistribution",
"cloudfront:GetDistributionConfig",
"cloudfront:ListCloudFrontOriginAccessIdentities",
"cloudfront:ListDistributions",
"cloudfront:ListDistributionsByLambdaFunction",
"cloudfront:ListDistributionsByWebACLId",
"cloudfront:ListFieldLevelEncryptionConfigs",
"cloudfront:ListFieldLevelEncryptionProfiles",
"cloudfront:ListInvalidations",
"cloudfront:ListPublicKeys",
"cloudfront:ListStreamingDistributions",
"cloudfront:UpdateDistribution",
"cloudfront:TagResource", // for adding tags
"cloudfront:UntagResource", // for adding tags
"cloudfront:ListTagsForResource", // for adding tags
"iam:AttachRolePolicy",
"iam:CreateRole",
"iam:CreateServiceLinkedRole",
"iam:GetRole",
"iam:PutRolePolicy",
"iam:PassRole",
"lambda:CreateFunction",
"lambda:EnableReplication",
"lambda:DeleteFunction", // only for custom domains
"lambda:GetFunction",
"lambda:GetFunctionConfiguration",
"lambda:PublishVersion",
"lambda:UpdateFunctionCode",
"lambda:UpdateFunctionConfiguration",
"lambda:ListTags", // for tagging lambdas
"lambda:TagResource", // for tagging lambdas
"lambda:UntagResource", // for tagging lambdas
"route53:ChangeResourceRecordSets", // only for custom domains
"route53:ListHostedZonesByName",
"route53:ListResourceRecordSets", // only for custom domains
"s3:CreateBucket",
"s3:GetAccelerateConfiguration",
"s3:GetObject", // only if persisting state to S3 for CI/CD
"s3:ListBucket",
"s3:PutAccelerateConfiguration",
"s3:PutBucketPolicy",
"s3:PutObject",
"s3:PutBucketTagging", // for tagging buckets
"s3:GetBucketTagging", // for tagging buckets
"lambda:ListEventSourceMappings",
"lambda:CreateEventSourceMapping",
"iam:UpdateAssumeRolePolicy",
"iam:DeleteRolePolicy",
"sqs:CreateQueue", // SQS permissions only needed if you use Incremental Static Regeneration. Corresponding SQS.SendMessage permission needed in the Lambda role
"sqs:DeleteQueue",
"sqs:GetQueueAttributes",
"sqs:SetQueueAttributes"
По умолчанию , API и изображению (для оптимизации изображений next.js) Это значение можно изменить, назначив число вводу memory
# serverless.yml
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
memory : 1024 Значения по умолчанию , API и Lambdas изображения могут быть отдельно определены путем назначения memory такому объекту, как SO:
# serverless.yml
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
memory :
defaultLambda : 1024
apiLambda : 2048
imageLambda : 2048По умолчанию по умолчанию та же шаблон можно следовать для определения времени выполнения node.js (nodejs14.x):
# serverless.yml
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
runtime :
defaultLambda : " nodejs14.x "
apiLambda : " nodejs14.x "
imageLambda : " nodejs14.x " # Note that the sharp image library is built for Lambda Node.js 14.x, although it will likely work fine on other runtimesТочно так же тайм -аут по умолчанию составляет 10 секунд. Для настройки вы можете:
# serverless.yml
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
timeout :
defaultLambda : 20
apiLambda : 15
imageLambda : 15Обратите внимание, что максимальный тайм -аут, допустимый для Lambda@Edge, составляет 30 секунд. См
Вы также можете установить пользовательское имя для по умолчанию , API и изображения Lambdas - если не по умолчанию установлено компонентом AWS -Lambda без сервера для идентификатора ресурса:
# serverless.yml
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
name :
defaultLambda : fooDefaultLambda
apiLambda : fooApiLambda
imageLambda : fooImageLambdaСуществует четвертая регенерация лямбда, которая может быть настроена аналогично и используется для постепенной статической регенерации. Тем не менее, он не использует Lamda@Edge и может, например, иметь более длительный схему тайм -аута.

Четыре поведения в кеш создаются в Cloudfront.
Первые два _next/* и static/* Пересеките запросы на S3.
Третий связан с функцией лямбды, которая отвечает за обработку трех типов запросов.
Серверная рендерина. Любая страница, которая определяет метод getInitialProps , будет отображаться на этом уровне, и ответ немедленно возвращается пользователю.
Статически оптимизированная страница. Запросы на страницы, которые были предварительно скомпилированы рядом с HTML, пересылаются в S3.
Государственные ресурсы. Запросы на ресурсы корневого уровня, такие как /robots.txt , /favicon.ico , /manifest.json и т. Д. Они пересылаются в S3.
Причина, по которой 2. И 3. должны сначала пройти через лямбда@edge, заключается в том, что маршруты не соответствуют такому рисунку, как _next/* или static/* . Кроме того, одно поведение кеша на маршрут - плохая идея, потому что CloudFront допускает только 25 за распределение.
Четвертое поведение кэша обрабатывает следующее API запросы api/* .
| Имя | Тип | Значение по умолчанию | Описание |
|---|---|---|---|
| развертывать | boolean | true | Когда он будет установлен на False, оно не будет развернуть приложение для поставщика (например, AWS). |
| домен | Array | null | Например ['admin', 'portal.com'] |
| Domainredirects | object | {} | Добавляет перенаправления на уровне домена на краю с помощью 308 перенаправления. Укажите объект доменного имени -> перенаправить пункт назначения с помощью протокола. Например, www.example.com: https://example.com . Смотрите здесь для получения дополнительной информации. |
| BucketName | string | null | Пользовательское имя ведра, где хранятся статические активы. По умолчанию автогенерируется. |
| ведь | string | null | Регион, где вы хотите разместить свое ведро S3. Убедитесь, что это географически ближе к большинству ваших конечных пользователей, чтобы уменьшить задержку, когда CloudFront прокси -прокси -запрос на S3. |
| Бакеттагс | object | undefined | Пользовательские теги ведра, чтобы установить для вашего ведра. В случае неопределенности компонент не будет обновлять никаких тегов. Если установить на пустой объект, он удалит все теги. |
| NextConfigdir | string | ./ | Каталог, где находится ваша приложение next.config.js . Этот ввод полезен, когда serverless.yml не находится в том же каталоге, что и следующее приложение.ПРИМЕЧАНИЕ: nextConfigDir должен быть установлен, если используется next.config.js distDir |
| Nextstaticdir | string | ./ | Если ваш static или public каталог не является прямым ребенком nextConfigDir , это необходимо |
| описание | string | *lambda-type*@Edge for Next CloudFront distribution | Описание, которое будет использоваться для обоих Lambdas. Обратите внимание, что «(API)» будет добавлено к описанию API Lambda. |
| политика | string|object | arn:aws:iam::aws:policy/service-role/AWSLambdaBasicExecutionRole | ARN или встроенная политика, которая будет назначена обоим Lambdas. |
| Ролеарн | string|object | нулевой | Арн роли, которая будет назначена обоим лямбдам. |
| время выполнения | string|object | nodejs14.x | При назначении значения как по умолчанию, так и API -лямбдам будет назначено время выполнения, определенное в значении. При назначении объекту значения для по умолчанию и api лямбдас могут быть определены отдельно |
| память | number|object | 512 | При назначении номера как по умолчанию, так и API -лямбдам будет назначена память об этом значении. При назначении объекту значения для по умолчанию и api лямбдас могут быть определены отдельно |
| теги | object | undefined | Теги, чтобы назначить лямбду. В случае неопределенности компонент не будет обновлять никаких тегов. Если установить на пустой объект, он удалит все теги. |
| тайм -аут | number|object | 10 | То же, что и выше |
| обработчик | string | index.handler | При назначении значения переопределяет обработчик функции по умолчанию, чтобы разрешить конфигурацию. Копии handler.js в маршруте в папки Lambda. Ваш обработчик все еще должен позвонить default-handler , или ваша функция не будет работать с Next.js |
| имя | object | / | Имена для всех лямбдов могут быть четко определены |
| строить | boolean|object | true | Когда True создает и развертывает приложение, когда .serverless_nextjs предположим nextConfigDir что приложение было создано и использует .next . Если объект передается, build позволяет переоценить то, как вызывается скрипт и с какими аргументами. |
| build.cmd | string | node_modules/.bin/next | Команда сборки, вы можете пройти команду NO-OP (например, true или : в системах Unix), которая затем пропустит следующую сборку. |
| Build.args | Array|string | ['build'] | Аргументы, чтобы передать сборку |
| build.cwd | string | ./ | Переопределить текущий рабочий каталог |
| build.enabled | boolean | true | То же, что и проходная build:false но из конфигурации |
| Build.env | object | {} | Добавить дополнительные переменные среды в сценарий |
| BUILD.POSTBUILDCOMMANDS | Array | [] | Любые команды для запуска пост-сборки и предварительного развертывания. Например, вы можете запустить любой пользовательский код в каталоге .serverless_nextjs , например, вы можете скопировать дополнительные файлы в Lambda: см. #767 (комментарий) для примера для next-18n . Применяется только во время выполнения команды serverless . |
| build.cleanupdotnext | boolean | true | Уборка каталога .next |
| Build.assetIgnorePatterns | string[] | [] | Шаблоны глобального, чтобы игнорировать при обнаружении файлов для копирования из _next/static, публичных, статических каталогов. |
| build.usev2handler | boolean | false | Экспериментальный установите это на то, чтобы использовать обработчики V2, которые начинают использовать общие обработчики. Примечание: это имеет функциональность separateApiLambda и disableOriginResponseHandler , поэтому его не следует использовать вместе. Кроме того, он не полностью оптимизирован с точки зрения размера кода, но все равно должен быть эффективным. В будущем мы, вероятно, будем использовать этот режим по умолчанию. |
| Cloudfront | object | {} | Входные данные, которые должны быть переданы в AWS-Cloudfront |
| Сертификат | string | `` | Конкретный сертификат ARN для использования для Distribution CloudFront. Полезно, если у вас есть сертификат SSL с подстановочным знаком, который вы хотите использовать. Это в настоящее время работает только в тандеме с входом domain . Пожалуйста, проверьте пользовательскую конфигурацию CloudFront, чтобы указать certificate без необходимости использовать ввод domain (обратите внимание, что это будет переопределить любой сертификат из -за ввода домена). |
| доментип | string | "both" | Может быть одним из: "apex" - только домен Apex, не создавайте субдомен www. "www" - только домен www, не создавайте поддомен вершины. "both" - создайте как домены WWW, так и Apex, когда любой из них предоставлен. |
| Domainminimumprotocolversion | string | "TLSv1.2_2018" | Может быть одним из: "SSLv3", "TLSv1", "TLSv1.1_2016", "TLSv1.2_2018", "TLSv1.2_2019", "TLSv1.2_2021" or "TLSv1_2016" . См. Ссылку. |
| publicDirectoryCache | boolean|object | true | Настройте политику кэширования активов public / static папки. Присвоение объекта со value и/или test позволяет настроить политику кэширования и типы кэшируемых файлов. Назначение кэширования False |
| Использование | boolean | false | Используйте целевую цель экспериментальной беспрепятственности, чтобы построить следующее приложение. Это та же цель сборки, которую сейчас использует Vercel. Смотрите этот RFC для деталей. Примечание. При использовании этого, возможно, вам потребуется установить переменную NODE_ENV для production . |
| MinifyHandlers | boolean | false | Используйте предварительно построенные минимизированные обработчики, чтобы уменьшить размер кода. Не минимизирует пользовательские обработчики. |
| Enablehttpcompression | boolean | false | При true функции лямбда@Edge для запросов SSR и API будут использовать GZIP для сжатия ответа. Обратите внимание, что вам не нужно включать это, потому что Cloudfront будет сжимать ответы для вас из коробки. |
| аутентификация | object | undefined | Объект аутентификации для использования с основной аутентификацией (доступен из 1.19.0-альфа.3). На данный момент он поддерживает только одну комбинацию имени пользователя/пароля и вставлен в открытый текст в обработчике Lambda. Вы также должны пересылать заголовок Authorization для поведения Cloudfront, например, defaults , api/* и _next/data/_ . Примечание. Это предназначено как простое средство защиты среды, такой как сайт разработки/тестирования, это не рекомендуется для производства. |
| Аутентификация.username | string | undefined | Имя пользователя для базовой аутентификации. |
| включает 3 -й | boolean | true | Сообщите ли ускорение передачи S3. Это может быть полезно отключить, поскольку некоторые регионы AWS не поддерживают его. См. Ссылку. |
| Удалить oldlambdaversions | boolean | false | Основная поддержка удаления старых версий Lambda после развертывания, чтобы убедиться. Если вы устанавливаете True, каждый раз, когда вы развертываете, он автоматически удаляется до ~ 50 старых версий (начиная с самого старого) из всех лямбдов, которые не развернуты/воспроизведены. Если вам требуются более сложные стратегии, рекомендуется написать свой собственный сценарий для удаления старых версий. |
Пользовательские входы могут быть настроены так:
myNextApp :
component : " @sls-next/serverless-component@{version_here} "
inputs :
bucketName : my-bucket(Экспериментальный) - Больше работы, необходимых для достижения этой конструкции до скорости, а также для повторного использования некоторой логики без сервера. В результате конструкция, вероятно, будет соответствующим образом адаптировать/изменять.
Документация можно найти здесь.
Поскольку мы подражаем Next.js Logic почти с нуля, чтобы оптимизировать ее для среды без сервера, могут быть некоторые неполные или отсутствующие функции (как упоминалось ранее). Тем не менее, мы считаем, что мы рассмотрели большинство функций и добавили хорошую единицу и сквозное тестовое покрытие, чтобы обеспечить стабильность (например, в 10+ сквозных тестовых люксах). Несколько человек используют это для питания своего стартапа, личных сайтов и т. Д.
Также применяются ограничения облачных провайдеров - например, на AWS Lambda@Edge, есть простуды, ограничения размера кода, предел размера отклика 1 МБ и т. Д. Вы, конечно, также привязаны к одной платформе (AWS Lambda@Edge; скоро появится еще!).
Мы также продолжаем улучшать процесс развертывания, рассматривая лучшие решения инфраструктуры как код в ближайшем будущем (CDK, CDK Terraform, Pulumi и т. Д.).
Убедитесь, что ваш serverless.yml использует формат serverless-components (бета). Компоненты без серверов отличаются от исходной без серверов, даже если они оба доступны через одну и ту же CLI.
✅ делать
# serverless.yml
myNextApp :
component : " @sls-next/serverless-component@{version_here} "
myTable :
component : serverless/aws-dynamodb
inputs :
name : Customers
# other componentsНе
# serverless.yml
provider :
name : aws
runtime : nodejs10.x
region : eu-west-1
myNextApp :
component : " @sls-next/serverless-component@{version_here} "
Resources : ... Обратите внимание, как правильный YAML не объявляет provider , Resources и т. Д.
Для развертывания не запускайте serverless deploy . Просто запустите serverless , и это развертывает ваши компоненты, объявленные в файле serverless.yml .
Для получения дополнительной информации о компонентах без сервера перейдите сюда.
Пакеты обработчиков API и обработчиков по умолчанию развернуты отдельно, но каждый имеет предел на 50 МБ на молнии или 250 МБ, несущественный на AWS - см. Здесь и здесь. По дизайну в настоящее время есть только один лямбда@Edge для всех маршрутов страниц и один лямбда@Edge для всех маршрутов API. Это может привести к проблемам с размером кода, особенно если у вас есть много маршрутов API, страниц SSR и т. Д.
Если вы сталкиваетесь с проблемами размера кода, попробуйте следующее:
Оптимизируйте размер кода: уменьшите # зависимости на ваших страницах SSR и маршрутах API, Имейте меньше страниц SSR (то есть не используйте getInitialProps() или getServerSideProps() ).
Снимите сам код обработчика, используя вход minifyHandlers . Это уменьшит размер обработчика с ~ 500 кб до ~ 200 КБ.
Minify/Minimize ваш код на стороне сервера, используя Terser, добавив следующую конфигурацию WebPack в next.config.js . Он использует переменную среды NEXT_MINIMIZE , чтобы сказать ее, чтобы минимизировать код SSR. Обратите внимание, что это увеличит время сборки и министерство кода, чтобы было труднее отлаживать ошибки CloudWatch.
Во-первых, добавьте terser-webpack-plugin к вашим зависимостям. Затем обновите next.config.js :
const TerserPlugin = require ( "terser-webpack-plugin" ) ; webpack: ( config , { buildId , dev , isServer , defaultLoaders , webpack } ) => {
if ( isServer && ! dev && process . env . NEXT_MINIMIZE === "true" ) {
config . optimization = {
minimize : true ,
minimizer : [
new TerserPlugin ( {
parallel : true ,
cache : true ,
terserOptions : {
output : { comments : false } ,
mangle : true ,
compress : true
} ,
extractComments : false
} )
]
} ;
}
return config ;
} ;Обратите внимание, что если вы не используете каких -либо маршрутов API, все файлы JS, используемые только для предварительных статических страниц, автоматически удаляются из пакета. Однако, если вы используете маршруты API, мы не удаляем их, так как они могут использоваться для режима предварительного просмотра. Не существует официального/непредвзятого способа идентификации и удаления этих файлов JS, не используемых в режиме предварительного просмотра, даже когда используются маршруты API. Но мы можем добавить новый ввод, чтобы вручную исключить их, если это необходимо.
useServerlessTraceTarget в serverless.yml . Это приведет к тому, что Next.js не связывает зависимости на каждую страницу (вместо этого создание легких страниц), а затем serverless-next.js будет ссылаться на один набор зависимостей в node_modules . Вероятно, это либо из -за проблемы с размером кода лямбда@(см. Выше для потенциальных решений. Связанная проблема с Github), либо если у вас медленная скорость загрузки сети и/или вы пытаетесь развернуть большой пакет Lambda.
Во втором случае используемый пакет aws-sdk NPM имеет тайм-аут по умолчанию 120 секунд. Прямо сейчас это не настраивается, но мы можем поддерживать более длительные тайм -ауты в ближайшем будущем (аналогично без сервера/без сервера#937, что применяется только к плавке без серверов, а не без серверов).
По умолчанию CloudFront устанавливает заголовок Host на имя хоста S3. Вам нужно направить заголовок Host до начала происхождения. См. Пример ниже для пересылки для вашего поведения api/* кэш:
myNextApplication :
component : " @sls-next/serverless-component@{version_here} "
inputs :
cloudfront :
api/* :
forward :
headers : [Host] Пользователям рекомендуется использовать этот компонент вместо serverless-plugin . Этот компонент был построен и разработан с использованием уроков, извлеченных из плагина без сервера.
См. examples/dynamodb-crud для примера приложения TODO, которое взаимодействует с DynamoDB. Вы можете найти полный список примеров здесь
К сожалению, из -за того, как работают без серверных компонентов (по крайней мере, бета -версии), состояние развертывания должно быть синхронизировано за пределами основной команды serverless . Таким образом, вы можете попробовать следующие решения:
.serverless . Хотя это не рекомендуется, так как это не работает для нескольких этапов..serverless , см. Пример здесь, здесь (использует несколько файлов serverless.yml ) или здесь (на основе действий GitHub используется несколько файлов serverless.yml ).distributionId , чтобы указать существующее распределение CloudFront для развертывания.В будущем мы будем стремиться улучшить это, интегрируя правильное управление этапами в сам компонент.
Этот проект был запущен первоначальным автором, когда в бета -версии были в бета -версии, и, к сожалению, компоненты GA были выпущены вскоре после этого. Но это становилось все больше и больше, с несколькими подкомпонентами, импортированными в этот монорепо, поскольку они не поддерживались без сервера. А потом стало трудно обновить.
Был план обновления до компонентов GA, но он был приостановлен по нескольким причинам:
В настоящее время мы рассмотрим правильные решения IAC (такие как CDK для Terraform, CDK, Pulumi и т. Д.), Чтобы решить эту проблему и облегчить бремя поддержания сложной логики развертывания, чтобы мы могли сосредоточиться на опыте разработчика и функционировании с Next.js.
Да! Основным блокатором было то, что логика маршрутизации Next.js раньше была сильно связана с Lambda@Edge/CloudFront Logic. Тем не менее, мы создали большую часть основной логики (в пакет @sls-next/core ), чтобы ее можно было повторно использовано на других платформах, просто создав обработчик обертков, реализуя некоторый клиент-специфический для платформы (например, для извлечения страниц, запуска статической регенерации и т. Д.) И создания развертывателя. Если вы наблюдали, вы заметили новый пакет, который в настоящее время находится в разработке Lambda Deployments через API Gateway: https://github.com/serverless-nextjs/serverless-next.js/tree/master/packages/libs/lambda. Надеемся, что другие платформы, такие как Azure и Google Cloud.
us-east-1 . Как я могу развернуть его в другом регионе? Без сервера next.js - это без региона . По дизайну, приложения serverless-next.js будут развернуты по всему миру в каждом местоположении Cloudfront Edge. Lambda может выглядеть только в us-east-1 но за кулисами она воспроизводится в любом другом регионе.
См. Пример ниже для расширенной настройки build , которая включает в себя передачу дополнительных аргументов и переменных среды в сборку.
# serverless.yml
myDatabase :
component : MY_DATABASE_COMPONENT
myNextApp :
component : " @sls-next/serverless-component@{version_here} "
inputs :
build :
args : ["build", "custom/path/to/pages"]
env :
DATABASE_URL : ${myDatabase.databaseUrl} Если вы попытаетесь объединить переменную среды с другой строкой, например, ${env.VARIABLE}-blah , Framework без сервера, кажется, разрешает ее только ${env.VARIABLE} .
Похоже, что это ошибка в компонентах без сервера - это может быть связано с тем, что он не использует последнюю версию GA, где она могла быть исправлена (к сожалению, это все еще на бета -версии компонентов). На данный момент обходной путь:
serverless.yml , затем Concatenate: stage : ${env.STAGE}
my-app :
component : " @sls-next/[email protected] "
inputs :
domain :
- " ${stage}-front-end "
- mydomain.com Вы можете использовать новый ввод domainRedirects , наряду с заголовком Host и domainType: both , чтобы перенаправить запросы в правильный домен. См. Пример конфигурации ниже, которая перенаправляет www.example.com запросы на https://example.com .
next-app :
component : " ../../serverless-components/nextjs-component "
inputs :
cloudfront :
defaults :
forward :
headers : [Host]
domain : ["example.com"]
domainType : " both "
domainRedirects :
www.example.com : https://example.com Все это происходит в обработчиках запросов лямбда@ Обратите внимание, что это не позволит вам перенаправлять запросы по адресу _next/static/* или /static/* , поскольку к ним не прилагается обработчик лямбда@Edge.
В противном случае, вы также можете использовать обходной путь ручного обхода, используя ковш S3, изложенное здесь. Таким образом, вам придется создать новое ведро S3 и настроить его на статическое хостинг веб -сайтов, чтобы перенаправить запросы на ваш поддерживаемый тип субдомена (Ex. Чтобы иметь возможность поддерживать https перенаправления, вам нужно настроить распределение Cloudfront с ковшом S3 Redirect в качестве источника. Наконец, вам нужно будет создать «А» запись в маршруте 53 с вашим недавно созданным распределением CloudFront в качестве цели псевдонима.
build.env , не отображаются в моем приложении Чтобы позволить вашему приложению получить доступ к переменным определенной среды, вам необходимо разоблачить их через next.config.js . Config.js, как указано здесь.
Учитывая такую serverless.yml
myApp :
inputs :
build :
env :
API_HOST : " http://example.com "Ваш stear.config.js должен выглядеть так:
module . exports = {
env : {
API_HOST : process . env . API_HOST
}
} ; Вы можете увидеть ошибку, как ниже:
502 ERROR
The request could not be satisfied.
The Lambda function returned invalid JSON: The JSON output is not parsable. We can't connect to the server for this app or website at this time. There might be too much traffic or a configuration error. Try again later, or contact the app or website owner.
If you provide content to customers through CloudFront, you can find steps to troubleshoot and help prevent this error by reviewing the CloudFront documentation.
Generated by cloudfront (CloudFront)
Это обычно происходит, когда размер ответа слишком велик. Lambda@Edge в настоящее время имеет ограничение в размере 1 МБ, возвращаемое обработчиком запроса происхождения. См.: Https://docs.aws.amazon.com/amazoncloudfront/latest/developerguide/lambda-generating-http-responsess-in-requests.html#lambda-generating-http-responses-errors. К сожалению, не может быть обходного пути, кроме как попытка, чтобы ваши ответы были меньше.
Убедитесь, что вы направляете заголовок Accept-Language через конфигурацию Cloudfront, отдельно не может определить, какие языки понимает и/или/или предпочитает. По умолчанию он пересылается, но если вы переопределяете собственную конфигурацию, вы должны добавить ее обратно.
Если вы используете сторонние библиотеки (на данный момент next-i18next ) и используете пути по умолчанию, некоторые файлы могут быть скопированы в каталоги Lambda. Этот компонент попытается обнаружить файлы по умолчанию и скопировать их для вас. Однако, если у вас есть пользовательская конфигурация, вам может потребоваться написать свои собственные postBuildCommands для копирования файлов и т. Д.
Обратитесь к Readme для получения дополнительной информации и предостережения.
Вы можете открыть новую проблему здесь. Если разместить проблему, пожалуйста, сначала следите за отладкой вики для некоторых полезных советов и постарайтесь включить столько информации, чтобы воспроизвести проблему.
Если вы сообщаете об уязвимости безопасности, пожалуйста, следуйте политике безопасности.
Обратите внимание, что сейчас есть только один основной сопровождающий (@dphang) и несколько участников сообщества, которые вносят вклад в эту библиотеку в свободное время. So we hope you understand that our response is best-effort and may take several days, or more. So we hope you could at least help debug the issue or provide as much context. In case an issue hasn't been looked at for a long time (> a few weeks) or it seems like a major issue, feel free to mention a maintainer and we will try to prioritize it.
We would love if you can help contribute, whether it's coding, triaging or debugging issues, helping with documentation, or financial support! Please see the contributing guide.
This project exists thanks to all the people who contribute. [Способствовать].
Made with contributors-img.
Become a financial contributor and help us sustain our community. [Способствовать]
Support this project with your organization. Your logo will show up here with a link to your website. [Способствовать]