如何通过OAuth实现集成Spotify的MERN应用身份验证？

我正在开发一款MERN栈应用，核心功能包括：

• 支持用户登录Spotify账号
• 在应用数据库中保存独立于Spotify库的数据
• 通过应用操作Spotify账号

我的核心诉求是用户仅需登录Spotify账号，无需维护应用专属账号，但目前对身份验证与安全的最佳实践存疑。

当前的实现流程：

1. 用户访问Spotify授权链接并登录Spotify账号；
2. Spotify携带code查询参数将用户重定向回前端应用；
3. React前端携带该code请求后端，获取Spotify访问/刷新令牌；
4. 后端获取Spotify访问令牌后，调用Spotify的「获取当前用户信息」API；
5. 检查并确保用户已在应用数据库中创建，随后生成一个与Spotify访问令牌过期时间相近的独立JWT；
6. 后端向客户端返回两个令牌：Spotify访问令牌（用于前端直接调用Spotify API）和JWT（用于与后端通信）。

我不确定这个方案是否违反OAuth集成第三方服务的最佳实践，尤其是同时维护两个令牌的设计。该方法参考了Stack Overflow的一篇回答，但不确定是否合规。另外我尝试过passport-spotify，但它更适合后端直接与Spotify API交互，不符合我的使用场景。

关于双令牌设计的合规性 #

你的方案没有违反OAuth核心最佳实践，但存在几个需要优化的安全风险点：

• 直接向前端返回Spotify访问令牌存在泄露风险：前端存储的令牌容易被XSS攻击窃取，一旦泄露，攻击者可以直接操作用户的Spotify账号
• 双令牌过期时间同步的维护成本高：手动对齐过期时间容易出现偏差，导致用户体验或安全问题

优化后的最佳实践方案 #

建议调整为后端统一持有Spotify令牌的模式，前端仅使用应用专属JWT与后端交互：

1. 保持原有授权流程的前4步不变（用户授权→获取code→后端换Spotify令牌→获取用户信息）
2. 后端将Spotify的访问令牌和刷新令牌加密存储在应用数据库中（关联到对应的用户记录）
3. 后端生成独立的应用JWT（过期时间可设为15-30分钟，配合刷新令牌机制）返回给前端
4. 前端后续所有需要操作Spotify的请求，都通过后端代理：前端携带JWT调用后端接口，后端从数据库取出加密的Spotify令牌，完成对Spotify API的调用后返回结果给前端
5. 当Spotify访问令牌过期时，后端自动使用刷新令牌获取新的访问令牌，无需前端参与

为什么不直接返回Spotify令牌给前端？ #

• 符合OAuth的「令牌不应暴露给客户端」的安全原则：第三方服务的访问令牌属于敏感凭证，应由后端保管
• 降低XSS攻击的影响范围：即使前端JWT泄露，攻击者只能调用你的应用接口，无法直接操作用户的Spotify账号
• 简化令牌维护：后端统一处理Spotify令牌的刷新、过期逻辑，前端无需关心第三方服务的令牌生命周期

关于passport-spotify的适配 #

你可以基于passport-spotify做改造，让它仅负责完成OAuth授权流程（获取用户信息、Spotify令牌），后续的应用JWT生成、令牌存储逻辑由你自己实现，这样既利用了成熟库的稳定性，又能满足你的业务需求。

内容的提问来源于stack exchange，提问作者Tim Gillis