使用 Zeit Now 的 Next js + Express 部署问题

Posted 2023-02-22

技术标签:

【中文标题】使用 Zeit Now 的 Next js + Express 部署问题【英文标题】：Trouble with Next js + Express deployment using Zeit Now 【发布时间】：2019-08-09 03:10:26 【问题描述】：

我编写了一个简单的 s-s-r Next js 网页，并附加了一个快速服务器来处理我附加到联系表单的一些电子邮件功能。

我已经尝试部署到现在，虽然终端显示我已成功部署，但当我向我的 express 服务器发出网络请求时，我收到 502 错误。

now.json:


  "version": 2,
  "builds": [
    "src": "package.json", "use": "@now/next",
    "src": "/server/index.js", "use": "@now/node-server"
  ],
  "routes": ["src": "/api/contact", "dest": "/server/index.js"]

下一个.config.js：

const  PHASE_PRODUCTION_SERVER  =
  process.env.NODE_ENV === 'development'
    ?  // We're never in "production server" phase when in development mode
    : !process.env.NOW_REGION 
      ? require('next/constants') // Get values from `next` package when building locally
      : require('next-server/constants'); // Get values from `next-server` package when building on now v2

module.exports = (phase,  defaultConfig ) => 
  if (phase === PHASE_PRODUCTION_SERVER) 
    // Config used to run in production.
    return ;
  

  const withSass = require('@zeit/next-sass');

  return withSass();
;

我查看了 now-examples，但不幸的是，没有表示这种特殊的库组合，而且我的程序员还不够熟练，无法自己理解它们的内部工作原理。

任何帮助将不胜感激。我的服务器代码是

索引.JS

const express = require('express');
const next = require('next');
const bodyParser = require('body-parser');

const mailer = require('./mailer/mailer.js');

const dev = process.env.NODE_ENV !== 'production';
const app = next( dev )
const handle = app.getRequestHandler()

app.prepare().then(() => 
  const server = express();

  server.use(bodyParser.json());

  server.get('*', (req, res) => 
    return handle(req, res);
  );

  server.post('/api/contact', (req, res) => 
    const  firstName, lastName, phoneNumber, emailAddress, messageText  = req.body

    mailer.send( firstName, lastName, phoneNumber, emailAddress, messageText ).then(() => 
      console.log(`Sent the message "$messageText" from <$firstName> $emailAddress.`);
      res.status(200);
      res.send('success')
    ).catch((error) => 
      console.log(`Failed to send the message "$messageText" from <$firstName> $emailAddress with the error $error && error.message`);
      res.status(400);
      res.send('failure')
    )
  );

  server.listen( (process.env.PORT || 3000) , (err) => 
    if (err) throw err
    console.log('> Read on http://localhost:3000')
  );

);

我的 next.js 应用程序的其余部分非常简单。

日志：

2019-03-19T11:01:49.575Z  [11:01:49] Compiling client
2019-03-19T11:01:49.598Z  [11:01:49] Compiling server
2019-03-19T11:01:52.602Z  [11:01:52] Compiled server in 3s
2019-03-19T11:02:00.177Z  info fsevents@1.2.7: The platform "linux" is incompatible with this module.
2019-03-19T11:02:00.177Z  info "fsevents@1.2.7" is an optional dependency and failed compatibility check. Excluding it from installation.
2019-03-19T11:02:00.183Z  [3/4] Linking dependencies...
2019-03-19T11:02:00.199Z  warning "@zeit/next-sass > sass-loader@6.0.6" has unmet peer dependency "webpack@^2.0.0 || >= 3.0.0-rc.0 || ^3.0.0".
2019-03-19T11:02:00.200Z  warning "@zeit/next-sass > @zeit/next-css > css-loader@1.0.0" has unmet peer dependency "webpack@^4.0.0".
                          warning "@zeit/next-sass > @zeit/next-css > mini-css-extract-plugin@0.4.3" has unmet peer dependency "webpack@^4.4.0".
2019-03-19T11:02:00.208Z  warning "next-optimized-images > raw-loader@1.0.0" has unmet peer dependency "webpack@^4.3.0".
2019-03-19T11:02:00.209Z  warning "next-optimized-images > file-loader@3.0.1" has unmet peer dependency "webpack@^4.0.0".
                          warning "next-optimized-images > url-loader@1.1.2" has unmet peer dependency "webpack@^3.0.0 || ^4.0.0".
2019-03-19T11:02:00.209Z  warning " > react-loading@2.0.3" has unmet peer dependency "prop-types@^15.6.0".
2019-03-19T11:02:02.880Z  [11:02:02] Compiled client in 13s
2019-03-19T11:02:03.396Z  compiling entrypoint with ncc...
2019-03-19T11:02:06.428Z  [4/4] Building fresh packages...
2019-03-19T11:02:08.530Z  success Saved lockfile.
2019-03-19T11:02:08.538Z  Done in 28.73s.
2019-03-19T11:02:08.806Z  yarn cache v1.13.0
2019-03-19T11:02:11.332Z  success Cleared cache.
2019-03-19T11:02:11.332Z  Done in 2.54s.
2019-03-19T11:02:11.341Z  running user script...
2019-03-19T11:02:11.342Z  running "yarn run now-build"
2019-03-19T11:02:11.592Z  yarn run v1.13.0
2019-03-19T11:02:11.670Z  $ NODE_OPTIONS=--max_old_space_size=3000 next build --lambdas
2019-03-19T11:02:13.254Z  [11:02:13] Compiling client
2019-03-19T11:02:15.907Z  ncc: Module directory "/tmp/6b60c2d/user/node_modules/chokidar/lib" attempted to require "fsevents" but could not be resolved, assuming external.
2019-03-19T11:02:31.586Z  downloading user files...
2019-03-19T11:02:31.679Z  installing dependencies for user's code...
2019-03-19T11:02:31.680Z  installing to /tmp/84eaca5/user/server
2019-03-19T11:02:35.826Z  Browser assets sizes after gzip:

                             19.3 kB  .next/static/0rX3****/pages/_app.js
                             12.3 kB  .next/static/0rX3****/pages/_error.js
                             1.04 kB  .next/static/0rX3****/pages/components/about/About.js
                             6.64 kB  .next/static/0rX3****/pages/components/backtotopbutton/BackToTopButton.js
                             1.14 kB  .next/static/0rX3****/pages/components/bookingcard/BookingCard.js
                               323 B  .next/static/0rX3****/pages/components/bookingcard/components/calendlywidget/CalendlyWidget.js
                             8.31 kB  .next/static/0rX3****/pages/components/contactcard/ContactCard.js
                             8.26 kB  .next/static/0rX3****/pages/components/contactcard/components/contactform/ContactForm.js
                             6.55 kB  .next/static/0rX3****/pages/components/landingcard/LandingCard.js
                             7.09 kB  .next/static/0rX3****/pages/components/mapview/MapContainer.js
                             6.81 kB  .next/static/0rX3****/pages/components/mapview/components/mapview/MapView.js
                             8.49 kB  .next/static/0rX3****/pages/components/navbar/NavBar.js
                             7.91 kB  .next/static/0rX3****/pages/components/navbar/components/burgermenu/BurgerMenu.js
                               478 B  .next/static/0rX3****/pages/components/servicescard/ServicesCard.js
                             25.7 kB  .next/static/0rX3****/pages/index.js
                             56.2 kB  .next/static/chunks/commons.ebad****.js
                               154 B  .next/static/chunks/styles.49ee****.js
                             3.01 kB  .next/static/css/styles.ee9ce638.chunk.css
                             23.4 kB  .next/static/runtime/main-44b4****.js
                               737 B  .next/static/runtime/webpack-8917****.js

2019-03-19T11:02:35.830Z  [11:02:35] Compiled client in 23s
2019-03-19T11:02:35.854Z  [11:02:35] Compiling server
2019-03-19T11:02:36.469Z  npm WARN
2019-03-19T11:02:36.470Z   clevetoothdenture@1.0.0 No repository field.
2019-03-19T11:02:36.470Z  npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.7 (node_modules/fsevents):
                          npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.7: wanted "os":"darwin","arch":"any" (current: "os":"linux","arch":"x64")
2019-03-19T11:02:36.470Z
2019-03-19T11:02:36.470Z  up to date in 4.427s
2019-03-19T11:02:36.657Z  npm
2019-03-19T11:02:36.658Z
2019-03-19T11:02:36.658Z  WARN using --force
2019-03-19T11:02:36.658Z   I sure hope you know what you are doing.
2019-03-19T11:02:36.773Z  writing ncc package.json...
2019-03-19T11:02:36.773Z  installing dependencies for ncc...
2019-03-19T11:02:36.773Z  installing to /tmp/84eaca5/ncc
2019-03-19T11:02:36.938Z  yarn install v1.13.0
2019-03-19T11:02:36.962Z  [1/4] Resolving packages...
2019-03-19T11:02:36.983Z  success Already up-to-date.
2019-03-19T11:02:36.985Z  Done in 0.05s.
2019-03-19T11:02:37.152Z  yarn cache v1.13.0
2019-03-19T11:02:37.173Z  success Cleared cache.
2019-03-19T11:02:37.173Z  Done in 0.03s.
2019-03-19T11:02:55.631Z  [11:02:55] Compiled server in 20s
2019-03-19T11:02:55.737Z  Done in 44.15s.
2019-03-19T11:02:55.743Z  running npm install --production...
2019-03-19T11:02:55.743Z  installing to /tmp/77afa5cd
2019-03-19T11:02:55.994Z  yarn install v1.13.0
2019-03-19T11:02:56.142Z  [1/4] Resolving packages...
2019-03-19T11:02:57.021Z  [2/4] Fetching packages...
2019-03-19T11:03:10.921Z  info fsevents@1.2.7: The platform "linux" is incompatible with this module.
2019-03-19T11:03:10.921Z  info "fsevents@1.2.7" is an optional dependency and failed compatibility check. Excluding it from installation.
2019-03-19T11:03:10.931Z  [3/4] Linking dependencies...
2019-03-19T11:03:10.939Z  warning "@zeit/next-sass > sass-loader@6.0.6" has unmet peer dependency "webpack@^2.0.0 || >= 3.0.0-rc.0 || ^3.0.0".
2019-03-19T11:03:10.940Z  warning "@zeit/next-sass > @zeit/next-css > css-loader@1.0.0" has unmet peer dependency "webpack@^4.0.0".
                          warning "@zeit/next-sass > @zeit/next-css > mini-css-extract-plugin@0.4.3" has unmet peer dependency "webpack@^4.4.0".
2019-03-19T11:03:10.949Z  warning "next-optimized-images > file-loader@3.0.1" has unmet peer dependency "webpack@^4.0.0".
2019-03-19T11:03:10.950Z  warning "next-optimized-images > raw-loader@1.0.0" has unmet peer dependency "webpack@^4.3.0".
2019-03-19T11:03:10.950Z  warning "next-optimized-images > url-loader@1.1.2" has unmet peer dependency "webpack@^3.0.0 || ^4.0.0".
2019-03-19T11:03:10.950Z  warning " > react-loading@2.0.3" has unmet peer dependency "prop-types@^15.6.0".
2019-03-19T11:03:13.518Z  [4/4] Building fresh packages...
2019-03-19T11:03:13.567Z  Done in 17.58s.
2019-03-19T11:03:13.834Z  yarn cache v1.13.0
2019-03-19T11:03:16.398Z  success Cleared cache.
2019-03-19T11:03:16.399Z  Done in 2.57s.
2019-03-19T11:03:16.666Z  preparing lambda files...
2019-03-19T11:03:16.840Z  Creating lambda for page: "components/about/About.js"...
2019-03-19T11:03:16.841Z  Creating lambda for page: "components/backtotopbutton/BackToTopButton.js"...
2019-03-19T11:03:16.841Z  Creating lambda for page: "components/bookingcard/BookingCard.js"...
2019-03-19T11:03:16.842Z  Creating lambda for page: "components/bookingcard/components/calendlywidget/CalendlyWidget.js"...
2019-03-19T11:03:16.842Z  Creating lambda for page: "components/contactcard/components/contactform/ContactForm.js"...
2019-03-19T11:03:16.843Z  Creating lambda for page: "components/contactcard/ContactCard.js"...
2019-03-19T11:03:16.843Z  Creating lambda for page: "components/landingcard/LandingCard.js"...
2019-03-19T11:03:16.844Z  Creating lambda for page: "components/mapview/components/mapview/MapView.js"...
2019-03-19T11:03:16.844Z  Creating lambda for page: "components/mapview/MapContainer.js"...
2019-03-19T11:03:16.845Z  Creating lambda for page: "components/navbar/components/burgermenu/BurgerMenu.js"...
2019-03-19T11:03:16.845Z  Creating lambda for page: "components/navbar/NavBar.js"...
2019-03-19T11:03:16.845Z  Creating lambda for page: "components/servicescard/ServicesCard.js"...
2019-03-19T11:03:16.846Z  Creating lambda for page: "index.js"...
2019-03-19T11:03:17.851Z  Created lambda for page: "components/about/About.js"
2019-03-19T11:03:18.495Z  Created lambda for page: "components/backtotopbutton/BackToTopButton.js"
2019-03-19T11:03:19.099Z  Created lambda for page: "components/bookingcard/BookingCard.js"
2019-03-19T11:03:19.668Z  Created lambda for page: "components/bookingcard/components/calendlywidget/CalendlyWidget.js"
2019-03-19T11:03:20.169Z  Created lambda for page: "components/contactcard/components/contactform/ContactForm.js"
2019-03-19T11:03:20.923Z  Created lambda for page: "components/contactcard/ContactCard.js"
2019-03-19T11:03:21.383Z  Created lambda for page: "components/landingcard/LandingCard.js"
2019-03-19T11:03:22.061Z  Created lambda for page: "components/mapview/components/mapview/MapView.js"
2019-03-19T11:03:22.759Z  Created lambda for page: "components/mapview/MapContainer.js"
2019-03-19T11:03:23.336Z  Created lambda for page: "components/navbar/components/burgermenu/BurgerMenu.js"
2019-03-19T11:03:23.772Z  Created lambda for page: "components/navbar/NavBar.js"
2019-03-19T11:03:24.416Z  Created lambda for page: "components/servicescard/ServicesCard.js"
2019-03-19T11:03:24.988Z  Created lambda for page: "index.js"
2019-03-19T11:03:28.817Z  preparing cache ...
2019-03-19T23:29:10.708Z  REPORT RequestId: 2b7c115d-9d46-4eef-a2d9-4788ed22116a        Duration: 130.73 ms     Billed Duration: 200 ms         Memory Size: 3008 MB    Max Memory Used: 89 MB

【问题讨论】：

检查https://zeit.co/username/websitename(package.json name)/deployment/******/logs。在此处发布链接我想知道你正在使用的 Next.js 的女巫版本，我想看看你的 next.config.js 文件自从我发布以来，我一直在研究这个问题，并更改了 now.json 和 next.config.js 文件 - 问题已更新，包括日志。站点已部署，但现在 502 错误出现在网络请求联系表中。为了帮助您，我已将此项目的 github 存储库公开 - github.com/washboardalex/ctdc 也使用Now 2.0，CLI v14.1.0。 【参考方案1】：

您必须使用带有以下 now.json 的 lambdas


    "version": 2,
    "builds": [
         "src": "package.json", "use": "@now/next" ,
         "src": "lambda_file.js", "use": "@now/node"
    ],
    "routes": [
         "src": "api_route", "dest": "lambda_file.js"
    ]

【讨论】：

@washboardalex 了解更多信息，请查看 github 中的 PR 为我节省了很多时间，感激不尽。我猜我可以从文档中为自己学习正确的路由？我面临同样的问题。但是我不太确定 lambda_file.js 是什么，请您说的更具体一些吗？【参考方案2】：

尝试在 now.json 中使用 @now/node-server 或 @now/node builder


  "version": 2,
  "builds": [ "src": "package.json", "use": "@now/node-server" ]

作为@now/next is used for Next.js apps

希望这会有所帮助！

【讨论】：

以上是关于使用 Zeit Now 的 Next js + Express 部署问题的主要内容，如果未能解决你的问题，请参考以下文章

javascript Zeit Now的Anycard-fcc server.js文件

如何在 Next.js 组件中使用 SVG 图像？

Next.js中使用antd组件

如何将在 zeit 中运行的 node.js 与 postgresql 连接起来？

[Now] Deploy a Node project with Zeit’s Now

zeit-now v2 + apollo-server-express：操场错误：无法访问服务器