在 AWS Amplify 上成功部署 Next.js 应用程序后，https://www.example.com/api/any-route 在控制台中显示以下错误

Question

应用已成功部署，但 API 路由 (/pages/api) 未按预期工作，在控制台中显示以下错误。

构建成功并部署到aws-amplify上，我已经正确添加了环境变量，不知道为什么会这样？

aws-amplify 是否不支持 /api 文件夹中的无服务器函数编写器？

{
"error": {
"message": "connect ECONNREFUSED 127.0.0.1:80",
"name": "Error",
"stack": "Error: connect ECONNREFUSED 127.0.0.1:80\n    at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1148:16)",
"config": {
"url": "undefined/campaigns",
"method": "get",
"headers": {
"Accept": "application/json, text/plain, */*",
"User-Agent": "axios/0.21.4"
},
"auth": {},
"transformRequest": [null],
"transformResponse": [null],
"timeout": 0,
"xsrfCookieName": "XSRF-TOKEN",
"xsrfHeaderName": "X-XSRF-TOKEN",
"maxContentLength": -1,
"maxBodyLength": -1,
"transitional": {
"silentJSONParsing": true,
"forcedJSONParsing": true,
"clarifyTimeoutError": false
}
},
"code": "ECONNREFUSED"
}
}

这是代码

import axios from 'axios';
import Cors from 'cors';
import rateLimit from '../../../utils/rate-limit';
import initMiddleware from '../../../lib/init-middleware';

// Initialize the cors middleware
const cors = initMiddleware(
  Cors({
    methods: ['POST'],
    origin: ['https://www.example.com', /\.example\.com$/],
  })
);

const limiter = rateLimit({
  interval: 60 * 1000, // 60 seconds
  uniqueTokenPerInterval: 500, // Max 500 users per second
});

const handler = async (req, res) => {
  await cors(req, res);

  if (req.method === 'GET') {
    try {
      await limiter.check(res, 50, 'CACHE_TOKEN');

      const { data } = await axios.get(`${process.env.BASE_URL}/campaigns`, {
        auth: {
          username: process.env.MAIL_SERVER_USERNAME,
          password: process.env.MAIL_SERVER_PASSWORD,
        },
      });
      return res.status(200).json(data);
    } catch (error) {
      return res.status(429).json({ error });
    }
  } else {
    try {
      await limiter.check(res, 10, 'CACHE_TOKEN'); // 10 requests per minute
      return res.status(200).json('not allowed');
    } catch (err) {
      return res.status(429).json({ error: 'Rate limit exceeded' });
    }
  }
};

export default handler;

Answer 1

我发现环境变量没有得到反映，谷歌搜索也是如此；找到了这个解决方案，它对我有用。在 Amplify 控制台中添加所需的环境变量，如正常（步骤）使用您在 Amplify 控制台中添加的环境变量更新（或创建）您的 next.config.js 文件。例如，如果您在上面的步骤 1) 中的控制台中创建了一个名为 MY_ENV_VAR 的环境变量，那么您将添加以下内容：

module.exports = {
  env: {
    MY_ENV_VAR: process.env.MY_ENV_VAR
  }
};

现在，在您的下一次构建之后，您将能够在您的 SSR lambda 中引用您的环境变量 (process.env.MY_ENV_VAR)！

这是link：Github

Answer 2

运行陷入同样的问题 Amplify 目前只支持 NextJS 11。如果您使用默认设置，它将使用最新的 NextJS 12 和 /api 路由将无法工作，它们 return 一个带有 cloudformation 权限错误的 503。

在 package.json

中指定下一个 11.1.3

https://aws.amazon.com/about-aws/whats-new/2021/08/aws-amplify-hosting-support-next-js-version-11/

Answer 3

我也遇到过这个问题。 Amplify 不支持 next 的 v12。只需将 package.json 中的 next.js 版本降级到 v1.1.3，您的路由就会正常工作。

最大的遗憾。阿尔乔姆·梅什科夫

在 AWS Amplify 上成功部署 Next.js 应用程序后，https://www.example.com/api/any-route 在控制台中显示以下错误

After successfully deploying Next.js app on AWS Amplify, https://www.example.com/api/any-route showing below error in console

deployment

amazon-cloudfront

next.js

serverless

aws-amplify