如何从 SvelteKit 应用程序发送安全的 API 请求，而不在客户端显示 API 密钥？

我正在将 Supabase 用于新的 Sveltekit 应用程序，这个模板 https://github.com/joshnuss/svelte-supabase

目前，我正在客户端传递 Supabase 密钥，如下所示：

const supabase = createClient(
  import.meta.env.VITE_SUPABASE_URL,
  import.meta.env.VITE_SUPABASE_ANON_KEY
)

创建安全后端/API 的最简单方法是什么，以便应用程序可以从 Supabase 获取内容，而无需在客户端显示 Supabase 密钥？

Sveltekit 中是否内置了任何功能可以让我执行此操作？或者我需要集成一个像 Rails 这样的后端吗？

SvelteKit 在两个主要位置支持服务器端代码：

• 端点 https://kit.svelte.dev/docs#routing-endpoints
• hooks https://kit.svelte.dev/docs#hooks

浏览器永远无法访问这些代码；只有结果。此外，客户端将看不到任何网络调用，因为它们都发生在服务器上（对于 API 密钥嵌入在 URL 中的情况）。这locals每个 API 的属性是与所有服务器端部分共享敏感数据（如 API 密钥）的好地方。

一般建议是使用本地端点代理外部 API 调用：

1. Fetch a local SvelteKit endpoint from SvelteKit pages https://kit.svelte.dev/docs#routing-pages (instead of calling the external API, like Supabase, directly). You can fetch the endpoint from two different places on a page:
   • load() https://kit.svelte.dev/docs#loading in <script context="module">（允许在发送/渲染页面之前从服务器端调用 API）
   • main <script>
2. 在单例中初始化外部 API。
3. 从端点调用外部API并将结果返回到页面。

Notes:

• SvelteKit 端点是无服务器 lambda 函数的泛化。 （看Netlify https://docs.netlify.com/functions/build-with-javascript/ or AWS https://docs.aws.amazon.com/lambda/latest/dg/nodejs-handler.html口味）
• 端点/挂钩中使用的任何 NPM 模块都必须是 devDependency。
• fetch()推荐（例如，相对于 axios），尤其是在load(). load()提供了一个特殊版本fetch()缓存来自服务器端的调用，以便客户端可以重用结果。
• 第 2 步主要是支持 Netlify 等无服务器环境。