我如何判断 SvelteKit 的 "load" 函数在服务器和客户端上是运行？

Question

我正在尝试从 load 函数在 SvelteKit 页面中进行 API 调用，但我不想使用本地端点代理这些调用，因为我想保留网络服务器越轻越好。

我特别想做的是，当从服务器调用时，API 的 URL 应该与从客户端调用时不同（例如“http: //localhost:1234" 与 "https://example.com:1234"，分别为。

但是，比这更普遍的是，有没有办法区分服务器和客户端上的当前代码是运行？

Answer 1

在 load 函数中，可以选择在从 $app/env.

导入后使用 browser 标志

<script context="module">
    import { browser } from '$app/env'; 
    ...
    export async function load({ fetch }) {
        if (!browser) {
            // code here runs only on the server
        }
        return {
           ...
        }
    }
    ...
<script>

以下来自SvelteKit's docs：

browser is true or false depending on whether the app is running in the browser or on the server

Answer 2

免责声明：我写的不是标题的真正答案，而是所描述问题的具体答案。

有目标 hook function (externalFetch) 如果客户端或服务器：

https://kit.svelte.dev/docs/hooks#externalfetch

/** @type {import('@sveltejs/kit').ExternalFetch} */
export async function externalFetch(request) {
  if (request.url.startsWith('https://api.yourapp.com/')) {
    // clone the original request, but change the URL
    request = new Request(
      request.url.replace('https://api.yourapp.com/', 'http://localhost:9999/'),
      request
    );
  }
 
  return fetch(request);
}

我如何判断 SvelteKit 的 "load" 函数在服务器和客户端上是运行？

How can I tell whether SvelteKit's "load" function is running on the server vs. client?

svelte

sveltekit

我如何判断 SvelteKit 的 "load" 函数在服务器和客户端上是 运行？

How can I tell whether SvelteKit's "load" function is running on the server vs. client?

svelte

sveltekit

我如何判断 SvelteKit 的 "load" 函数在服务器和客户端上是运行？