Svelte/Sapper fetch/this.fetch 未在服务器端 API 中定义

问题描述

这是我关于使用 svelte/Sapper 的问题

• 我在 /src/routes/login.js 中有一个文件
• 根据 Sapper 文档，它将在 http://<my_domain>/login 中创建一个 API 端点
• 现在在 login.js 中，我想调用另一个 API 服务器，假设它是 http://another_server/auth
• 无论我如何使用 fetch 函数：fetch("http://another_server/auth")、this.fetch("http://another_server/auth")，svelte 响应：(this.)fetch is not defined。
• 文档说它应该在 preload() 内运行，所以我将提取包装在 export async function preload(){} 下，它不起作用

所以我的问题是：除了使用 axios 之外，我可以在服务器端 API 请求中继续使用 fetch 吗？

刚刚在模板[slug].json.js文件中测试，当我添加(this.)fetch函数时，它没有编译，同样的错误：(this.)fetch is not defined

非常感谢。

解决方法

安装 node-fetch npm 包并在您的服务器路由中使用它，而不是默认的 fetch。

（在 /src/routes/login.js 中）：

import fetch from 'node-fetch'
...
// inside your route handler
const response = await fetch('http://another_server/auth') // no error

如果您不确定代码是在客户端还是服务器端执行（即您正在寻找一种通用/同构的方法），您可以使用条件要求：

// inside your route handler
const fetch = process.browser ? window.fetch : require('node-fetch').default
const response = await fetch('http://another_server/auth') // no error

但这在您的用例中可能有点矫枉过正，因为根据定义，服务器路由是在服务器端执行的。