Sapper中的Axios请求两次？答案

【问题标题】：Axios in Sapper requesting twice?Sapper中的Axios请求两次？
【发布时间】：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>

【问题讨论】：

标签： javascript jwt axios sapper svelte-3

【解决方案1】：

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

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

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

【讨论】：