Sapper中的Axios请求两次？

Posted 2023-03-10

【中文标题】Sapper中的Axios请求两次？

【英文标题】：Axios in Sapper requesting twice?

【发布时间】：2020-02-25 11:23:04

【问题描述】：

我正在使用axios 在preload 内外发送请求。但我不明白由于某种原因我的后端抱怨必须提供 JWT。我正在使用与另一个前端相同的后端（仅与 Axios 一起使用 Svelte）并且没有抱怨。但是在 Sapper 中，当我使用带有凭据的 axios 请求时（是的）。我得到 jwt 必须提供。

当我在后端记录请求 URL 时，我知道 Sapper 向后端发送了两次请求 URL，一个带有凭据，另一个没有凭据，这导致必须提供 JWT。我很确定带有凭据的请求来自 axios，但没有凭据的请求来自魔术。这种魔法发生在哪里？为什么？

<script context="module">

  import axios from 'axios'

  const ax = axios.create(
    withCredentials: true,
    baseURL: 'http://localhost:7000',
    headers:  'Content-Type': 'application/json' ,
  )

  export async function preload (page) 
    const data = await ax.get(`/profile/$page.query.type`)
    let profiles = data
    return  profiles, page 
  

</script>

【参考方案1】：

我遇到了类似的问题（预加载之外），我的问题是 Sappers 服务器端代码发布了第一个请求，而 Sappers 客户端代码发布了第二个请求（这是因为 Sapper如果我理解正确，则具有服务器端渲染，并且 Sapper 也在运行您的代码，然后将其发送到第二次运行的浏览器）。

您能否在 axios 请求之前添加一些 if 语句来检查 if (process.browser) [...] （或 window 或其他浏览器专有变量的存在）？

服务器端代码显然无法从用户浏览器访问 cookie 或 localStorage，因此 JWT 将为空。