无需登录与后端实现，如何获取Spotify Access Token？

你的需求确实有点棘手——Spotify的两种官方授权流程好像刚好卡在你的需求边界上：Client Credentials Flow要后端（怕密钥泄露），Implicit Grant要用户登录。不过其实有个折衷方案，既能避开完整后端的维护，又不用用户登录，还能安全获取Token，就是用无服务器边缘函数（比如Cloudflare Workers、Vercel Edge Functions这类），这也是类似你提到的网站大概率在用的方案。

推荐方案：用无服务器边缘函数做Token中转 #

这类服务属于轻量级的"后端片段"，不需要你搭建和维护完整服务器，免费额度足够支撑小流量应用，而且能帮你安全存储Spotify的Client ID和Secret，前端完全接触不到这些敏感信息。

具体步骤（以Cloudflare Workers为例） #

1. 写一个简单的边缘函数，负责调用Spotify的Token接口并返回结果：

export default {
  async fetch(request, env) {
    // 从环境变量读取敏感信息，绝对不要写在代码里
    const clientId = env.SPOTIFY_CLIENT_ID;
    const clientSecret = env.SPOTIFY_CLIENT_SECRET;
    const authHeader = btoa(`${clientId}:${clientSecret}`);

    // 请求Spotify获取Token
    const tokenResponse = await fetch('https://accounts.spotify.com/api/token', {
      method: 'POST',
      headers: {
        'Authorization': `Basic ${authHeader}`,
        'Content-Type': 'application/x-www-form-urlencoded'
      },
      body: 'grant_type=client_credentials'
    });

    const tokenData = await tokenResponse.json();
    // 允许前端跨域请求，也可以指定你的前端域名更安全
    return new Response(JSON.stringify(tokenData), {
      headers: {
        'Access-Control-Allow-Origin': '*',
        'Content-Type': 'application/json'
      }
    });
  }
};

2. 部署函数并配置环境变量：把你的Spotify Client ID和Secret添加到Cloudflare Workers的环境变量中，这样代码里不会暴露敏感信息。
3. 前端调用这个函数获取Token：

async function getSpotifyToken() {
  const response = await fetch('https://你的worker域名.workers.dev');
  const data = await response.json();
  return data.access_token;
}

// 拿到Token后就可以调用Spotify API了，比如根据年龄生成播放列表
async function getPlaylistByAge(age) {
  const token = await getSpotifyToken();
  // 这里可以根据年龄逻辑构造API请求，比如按年代搜索播放列表
  const targetYear = new Date().getFullYear() - age;
  const response = await fetch(`https://api.spotify.com/v1/search?q=year:${targetYear}&type=playlist&limit=10`, {
    headers: {
      'Authorization': `Bearer ${token}`
    }
  });
  return response.json();
}

这个方案的优势：

• 不用维护完整后端，部署简单
• 敏感信息完全隔离，不会泄露给前端
• 不需要用户登录，完全符合你的需求

退而求其次：用极简Node.js后端（无数据库） #

如果你不想用边缘函数，也可以写一个超简单的Node.js后端，只做Token中转，完全不需要数据库：

const express = require('express');
const fetch = require('node-fetch');
const btoa = require('btoa');
const cors = require('cors');
const app = express();

app.use(cors());

// 从环境变量读取密钥
const clientId = process.env.SPOTIFY_CLIENT_ID;
const clientSecret = process.env.SPOTIFY_CLIENT_SECRET;

app.get('/get-token', async (req, res) => {
  const authHeader = btoa(`${clientId}:${clientSecret}`);
  const tokenResponse = await fetch('https://accounts.spotify.com/api/token', {
    method: 'POST',
    headers: {
      'Authorization': `Basic ${authHeader}`,
      'Content-Type': 'application/x-www-form-urlencoded'
    },
    body: 'grant_type=client_credentials'
  });
  const tokenData = await tokenResponse.json();
  res.json(tokenData);
});

app.listen(process.env.PORT || 3000, () => {
  console.log('服务器已启动');
});

部署到Heroku、Railway这类平台的免费额度上即可，前端直接调用这个/get-token接口拿Token就行。

为什么你提到的网站能做到？ #

它大概率就是用了类似边缘函数的方案——把获取Token的逻辑放在了一个轻量级的后端层，既隐藏了敏感密钥，又不需要用户登录，前端只需要调用这个中转接口就能拿到Token，完全符合你的需求。

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