Sveltekit - 从 lib 访问会话

Question

我将 Sveltekit 与 Typescript 一起使用。在$lib 文件夹中，我有一个api.ts 文件。

登录后，我将 JWT 令牌写入 session 并想在 api.ts 文件中使用它。但我遇到了一个错误。

我正在关注这个例子： sveltejs / realworld

// login.svelte

import { session } from "$app/stores";

// After login...

$session.accessToken = response.accessToken;

// api.ts

import { session } from "$app/stores";

// Before sending request...

if ($session.accessToken) {
    // Add Bearer token to header...
}

错误：Cannot find name '$session'. Did you mean 'session'?ts(2552)

为什么$session 这个东西在.svelte 文件中有效，但在.ts 文件中无效？

如何从.ts 访问session 中的accessToken？

谢谢。

---

编辑

api.ts代码：

import { get as getStore } from "svelte/store";
import { session } from "$app/stores";

const base = "https://localhost:44300";

async function send(method: string, path: string, data?: unknown) {
  const opts = {
    method,
    headers: {},
    body: ""
  };

  if (data) {
    opts.headers["Content-Type"] = "application/json";
    opts.body = JSON.stringify(data);
  }

  const { accessToken } = getStore(session);

  if (accessToken) {
    opts.headers["Authorization"] = `Bearer ${accessToken}`;
  }

  return fetch(`${base}${path}`, opts)
    .then((r) => r.text())
    .then((json) => {
      try {
        return JSON.parse(json);
      } catch (err) {
        return json;
      }
    });
}

export function get<T>(path: string): Promise<T> {
  return send("GET", path);
}

export function post<T>(path: string, data: unknown): Promise<T> {
  return send("POST", path, data);
}

export function put<T>(path: string, data: unknown): Promise<T> {
  return send("PUT", path, data);
}

export function del<T>(path: string, data: unknown): Promise<T> {
  return send("DELETE", path, data);
}

Answer 1

$session 是一个特定的语法used to reactively access a store value。对于 typescript 文件中的一次性值访问，请使用 get function:

import { get } from 'svelte/store';
import { session } from "$app/stores";

const { accessToken } = get(session);

如果您需要反应式解决方案，请改用session.subscribe。