AWS Amplify 上的 Next-AUTH UNTRUST_HOST_ERROR答案

【问题标题】：Next-AUTH UNTRUST_HOST_ERROR on AWS AmplifyAWS Amplify 上的 Next-AUTH UNTRUST_HOST_ERROR
【发布时间】：2023-02-03 20:17:40
【问题描述】：

在 AWS Amplify 上部署 NextJS 应用程序

我的 CloudWatch 日志中出现不信任主机。

有人可以帮忙吗？

[下一个授权][错误][UNTRUST_HOST_ERROR]

网址：https://master.dtzbr8sfj0q7k.amplifyapp.com/

我已将此域添加到我的 Cognito 允许的回调中。

包.json

"next": "13.0.7",
"next-auth": "^4.18.6",

构建设置

version: 1
applications:
  - frontend:
      phases:
        preBuild:
          commands:
            - npm ci
        build:
          commands:
            - npm run build
            - COGNITO_CLIENT_ID=${COGNITO_CLIENT_ID}
            - COGNITO_CLIENT_SECRET=${COGNITO_CLIENT_SECRET}
            - COGNITO_DOMAIN=${COGNITO_DOMAIN}
            - JWT_SECRET=${JWT_SECRET}
            - NEXTAUTH_URL=${NEXTAUTH_URL}
      artifacts:
        baseDirectory: .next
        files:
          - '**/*'
      cache:
        paths:
          - node_modules/**/*
    appRoot: client

/pages/api/[...nextauth].js

import NextAuth from "next-auth/next";

function CognitoProvider(options) {
  return {
    id: "cognito",
    name: "Cognito",
    type: "oauth",
    wellKnown: `${options.issuer}/.well-known/openid-configuration`,
    idToken: true,
    profile(profile) {
      return {
        id: profile.sub,
        name: profile.name,
        email: profile.email,
        image: profile.picture,
      };
    },
    options,
  };
}

export default NextAuth({
  providers: [
    CognitoProvider({
      clientId: process.env.COGNITO_CLIENT_ID,
      clientSecret: process.env.COGNITO_CLIENT_SECRET,
      issuer: process.env.COGNITO_DOMAIN,
    }),
  ],
  secret: process.env.JWT_SECRET,
  callbacks: {
    jwt({ token, account, profile }) {
      if (account) {
        console.log("Account exists");
        // modify token
        token.role = profile["cognito:groups"];
      }
      return token;
    },

    session({ session, token }) {
      if (session.user) {
        // modify session
        session.user.roles = token.role;
      }
      return session;
    },
  },
});

/index.js

import Head from "next/head";
import App from "../components/App/App";
import { useSession, signIn, signOut } from "next-auth/react";

export default function Home() {
  const { data: session } = useSession();
  if (session) {
    return (
      <>
        <Head>
          <title>Create Next App</title>
          <meta name="description" content="Generated by create next app" />
          <meta name="viewport" content="width=device-width, initial-scale=1" />
          <link rel="icon" href="/favicon.ico" />
        </Head>
        <App />
      </>
    );
  }
  return (
    <>
      Not signed in <br />
      <button
        onClick={() => {
          e.preventDefault();
          signIn("cognito", {
            callbackUrl: process.env.NEXTAUTH_URL,
          });
        }}
      >
        Sign in
      </button>
    </>
  );
}

任何帮助，将不胜感激

【问题讨论】：

标签： amazon-web-services next.js amazon-cognito aws-amplify next-auth

【解决方案1】：

确保您已在 AWS Amplify 上正确配置 NEXTAUTH_URL 环境变量。

我检查了你的网站，我看到了这个错误：

CLIENT_FETCH_ERROR

在 NextAuth.js 文档中，

这是一个类似的案例： How to solve client fetch error for next-auth authentication

【讨论】：

服务器上报告的不信任问题可能是因为 URL 设置。如果它不起作用，请告诉我。
这是我的环境配置i.ibb.co/7rN7jCQ/…
在我的本地环境中 NEXTAUTH_URL=localhost:3000 有效但在部署中同样不起作用
你能帮忙吗？

【解决方案2】：

我今天遇到了同样的问题，我发现这个解决方案对我有用：

我必须在构建设置中编辑 amplify.yml 并在 .env 文件中设置环境变量，如下所示：

version: 1
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - echo "NEXTAUTH_URL=$NEXTAUTH_URL" >> .env
        - echo "JWT_SECRET=$JWT_SECRET" >> .env
        - npm run build
  artifacts:
    baseDirectory: .next
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

我必须为我的所有环境变量执行此操作，以允许我的 Next.js 应用程序访问它们。

希望它有所帮助。

【讨论】：