Promise 永远不会在 Svelte API 端点中被评估

Question

我在 Svelte 中使用以下代码编写了一个 API 端点，它应该有助于从 Prisma.io 基于 ORM 的数据库中获取一些对象。

API 端点位于 routes/api/[slug].json.ts 并包含一个获取函数：

export async function get({ params }) {
    const { slug } = params
    const objects = await prisma[slug].findMany({})
    objects.forEach(function (object, index: number) {
        object.objectId = index
    })
    
    return objects
}

我的视图功能位于一个名为 Cardview.svelte 的 Svelte 文件中。它包含以下代码：

<script lang="ts">
  export let object_model: string;
  let title = toTitleCase(object_model);

  async function obtain_objects(object_model: string) {
    const url = 'http://localhost:3000/api/' + object_model + '.json';
    const objects = await fetch(url);
    return objects;
  }
  let objects = obtain_objects('measurement');
</script>

{#await objects}
  Reading from server... <Spinner size="sm" type="grow" />
{:then objects}
  <Container>
    {#each objects as v}
      <div class="shadow mb-5 bg-white rounded">
        <Varcard variable={v} />
      </div>
    {/each}
  </Container>
{:catch error}
  There was an error in loading the JSON {object_model}.
  <div><span>{error.message}</span></div>
{/await}

省略了从其他文件导入的一些布局。

此代码的问题在于 let objects = .. 部分从未被 {#await... 语法求值。这意味着，页面总是停留在加载阶段并且 Javascript-object objects 总是停留在一个承诺中。我的代码哪里出了问题？

谢谢。

Answer 1

您的获取函数 return 不正确。您需要 return 您 return 的 'body' 属性中的数据：

return {
body: objects
}

使用 fetch 还需要一个额外的步骤：

async function obtain_objects(object_model: string) {
    const url = 'http://localhost:3000/api/' + object_model + '.json';
    const objects = await fetch(url);
    return objects.json();
  }

此处有提取 api 的示例：https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch

Promise 永远不会在 Svelte API 端点中被评估

Promise is never evaluated in Svelte API endpoint

javascript

async-await

svelte

sveltekit