Electron中GET请求失败但对应URL浏览器可正常访问，无法获取Okta的id_token

404错误根因 #

• 请求头不匹配：浏览器直接访问URL时会自动携带标准的HTML请求头，fetch默认请求头不符合Okta接口的校验规则，被服务端拦截返回404
• URL编码异常：拼接sessionToken时未做URL编码，特殊字符在fetch请求中被错误转义，浏览器访问时会自动补全编码所以可以正常返回
• 重定向处理异常：fetch默认重定向策略如果和Okta的回调跳转逻辑不兼容，会导致跳转后的路径解析错误

修复方案 #

方案1：调整fetch请求配置，适配Okta接口要求 #

修改你的请求代码如下：

async function getAccessToken(url = '', sessionID= ''){
  // 对sessionID做URL编码，避免特殊字符导致路径错误
  const encodedSessionId = encodeURIComponent(sessionID)
  const response = await fetch(url + encodedSessionId, {
    method: 'GET',
    // 对齐浏览器的请求头配置
    headers: {
      'Accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8'
    },
    // 显式开启跟随重定向
    redirect: 'follow',
    // 携带会话凭证，避免Okta的会话校验失败
    credentials: 'include'
  })
  // 先从响应URL的hash中提取id_token
  const resUrl = new URL(response.url)
  const idTokenMatch = resUrl.hash.match(/id_token=([^&]+)/)
  // 匹配失败再从返回的HTML内容中提取
  if (!idTokenMatch) {
    const htmlContent = await response.text()
    const htmlMatch = htmlContent.match(/id_token=([^&]+)/)
    return htmlMatch ? htmlMatch[1] : null
  }
  return idTokenMatch[1]
}

方案2：使用隐藏iframe模拟浏览器访问（兼容性更高） #

如果调整fetch配置依然无效，可以用iframe完全模拟浏览器的访问逻辑，绕过fetch的请求限制：

function fetchIdToken(requestUrl) {
  return new Promise((resolve, reject) => {
    const iframe = document.createElement('iframe')
    iframe.style.display = 'none'
    iframe.src = requestUrl
    iframe.onload = () => {
      try {
        // 从iframe的地址哈希中提取id_token
        const hash = iframe.contentWindow.location.hash
        const tokenMatch = hash.match(/id_token=([^&]+)/)
        tokenMatch ? resolve(tokenMatch[1]) : reject(new Error('未找到id_token'))
      } catch (err) {
        // 若出现跨域错误，请先确认Okta应用配置中的重定向URI和当前应用域名一致
        reject(err)
      } finally {
        document.body.removeChild(iframe)
      }
    }
    iframe.onerror = () => {
      document.body.removeChild(iframe)
      reject(new Error('请求失败'))
    }
    document.body.appendChild(iframe)
  })
}

注意事项 #

• 提前在Okta后台的应用配置中，把当前应用的域名添加到重定向URI白名单中，否则会出现跨域无法读取令牌的问题
• id_token一般会放在回调URL的hash部分，不要从search参数里查询令牌

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