用魔搭账号登录你的应用：ModelScope OAuth 统一身份接入指南

// Node.js / Express
app.get('/api/auth/oauth/url', (req, res) => {
  const redirectUri = req.query.redirect_uri
  const state = crypto.randomUUID()
  const params = new URLSearchParams({
    client_id: process.env.OAUTH_CLIENT_ID,
    redirect_uri: redirectUri,
    response_type: 'code',
    scope: 'openid profile',
    state,
  })
  res.json({
    url: `https://www.modelscope.cn/oauth/authorize?${params}`,
    state,
  })
})

app.post('/api/auth/oauth/callback', async (req, res) => {
  const { code, redirect_uri } = req.body
  // 1. code → access_token
  const tokenRes = await fetch('https://www.modelscope.cn/oauth/token', {
    method: 'POST',
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
    body: new URLSearchParams({
      grant_type: 'authorization_code',
      client_id: process.env.OAUTH_CLIENT_ID,
      client_secret: process.env.OAUTH_CLIENT_SECRET,
      code,
      redirect_uri,
    }),
  })
  const { access_token } = await tokenRes.json()
  // 2. access_token → 用户信息（二选一）
  // 方式 A：OIDC 标准 userinfo 端点（推荐）
  const userRes = await fetch('https://www.modelscope.cn/oauth/userinfo', {
    headers: { Authorization: `Bearer ${access_token}` },
  })
  const userInfo = await userRes.json()
  // userInfo: { sub, name, preferred_username, picture, email, ... }
  // 方式 B：OpenAPI 端点（返回更多魔搭平台字段）
  // const userRes = await fetch('https://modelscope.cn/openapi/v1/users/me', {
  //   headers: { Authorization: `Bearer ${access_token}` },
  // })
  // const { data } = await userRes.json()
  // data: { username, nickname, avatar_url, email, description }
  // 3. 在你的数据库中创建或更新用户
  // ...
  res.json(user)
})

// 发起登录
const handleLogin = async () => {
  const redirectUri = window.location.origin  // 关键：使用前端真实地址
  const { url } = await fetch(
    `/api/auth/oauth/url?redirect_uri=${encodeURIComponent(redirectUri)}`
  ).then(r => r.json())
  window.location.href = url  // 跳转到魔搭授权页
}
// 页面加载时检测回调
useEffect(() => {
  const code = new URLSearchParams(window.location.search).get('code')
  if (!code) return
  fetch('/api/auth/oauth/callback', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      code,
      redirect_uri: window.location.origin,
    }),
  })
    .then(r => r.json())
    .then(user => {
      // 登录成功，存储用户信息
      window.history.replaceState({}, '', window.location.pathname)
    })
}, [ ])