AWS Amplify 在 Next.js 服务器动作中 Cookie 变更问题解析

在 Next.js 应用中使用 AWS Amplify 时，开发者可能会遇到一个与 Cookie 管理相关的特殊问题。当通过 generateServerClientUsingCookies 创建的客户端在服务器动作中执行数据查询操作时，会导致 Cookie 被意外修改，进而引发组件不必要的重新渲染。

问题现象

具体表现为：当在 Next.js 服务器动作中调用 Amplify 数据模型的 list() 方法时，系统会自动删除一个特定的 Cookie。这个 Cookie 的名称格式通常为：

com.amplify.Cognito.[region]:[identityId].identityId

这种自动删除操作会导致 Next.js 服务器组件重新渲染，即使数据本身没有发生变化。对于开发者而言，这种非预期的行为会影响应用性能和用户体验。

技术背景

这个问题源于 AWS Amplify 的凭证管理机制。在身份验证流程中，Amplify 会定期刷新凭证，而在这个过程中会涉及到 Identity Id 的处理。当前的实现方式会在每次凭证刷新时对相关 Cookie 进行操作，导致了上述问题。

解决方案

AWS Amplify 团队已经意识到这个问题，并在最新版本中提供了修复方案。开发者可以通过以下步骤解决问题：

1. 升级 aws-amplify 到 6.6.3 或更高版本
2. 升级 @aws-amplify/adapter-nextjs 到 1.2.20 或更高版本

这些新版本中移除了冗余的 Set-Cookie 头，从而避免了不必要的 Cookie 变更。

临时解决方案

在修复版本发布前，一些开发者采用了临时解决方案，即通过拦截 Cookie 的删除操作来避免问题。例如：

delete(key: string) {
    if (typeof key !== 'string') {
        throw new Error('key must be a string')
    }
    if (key.startsWith('com.amplify')) {
        return
    }
    return cookies().delete(key)
}

这种方法虽然有效，但建议开发者尽快升级到官方修复版本，以获得更稳定和可靠的解决方案。

最佳实践

为了避免类似问题，建议开发者在 Next.js 中使用 AWS Amplify 时：

1. 始终保持 Amplify 相关库的最新版本
2. 在服务器动作中谨慎处理身份验证相关的操作
3. 监控 Cookie 的变化情况，特别是在执行数据操作时
4. 遵循官方文档推荐的集成方式

通过理解这个问题背后的机制，开发者可以更好地在 Next.js 应用中集成 AWS Amplify，构建更稳定高效的应用程序。