Sveltekit 端点返回文件共享网站的文件

Question

我想建立一个类似于 nextcloud 的文件共享网站。 这个想法是，它们是服务器上的文件（当前它们是本地的），svelte 后端解析它们并呈现它们。然后，您可以单击文件夹来查找所需的文件，当您单击文件时，您可以下载该文件。

现在解析目录工作得很好。 但我似乎无法弄清楚如何创建返回文件以供下载的端点。

这些文件不应该是 sveltekit 的一部分，因此它们不是静态文件，所以我不能只是通过指向它们的 url 来下载它们。

所以我尝试根据文件类型创建一个 blob，但我似乎无法弄清楚它是如何工作的。

这就是我到目前为止所拥有的端点。

import { json } from '@sveltejs/kit';
import type { RequestHandler } from './$types';
import fs from "fs";
import { resolve } from 'path';

export const GET = (async (event) => {
    const filePath = resolve("."+event.url.pathname);
    console.log(filePath);
    var file = fs.readFileSync(filePath);

    return json({
        status:200,
        headers: {
        "Content-type" : "application/pdf",
        "Content-Disposition": `attachment; filename=${event.url.pathname.split("/").pop()}`
        },
        body: file
    });
}) satisfies RequestHandler;

Answer 1

您不会返回 JSON，即基于结构化文本的数据，而是返回一个原始

Response

对象，其中可以包含您想要的任何内容。

原始二进制数据的内容类型应为

application/octet-stream

。我也只是将文件作为查询字符串参数传递。例如

export const GET: RequestHandler = async ({ url }) => {
    const name = url.searchParams.get('name'); // E.g. /files/download?name=X
    if (name == null)
        return new Response('No name provided', { status: 400 });

    const buffer = await readFile(`./files/${name}`);

    return new Response(
        buffer,
        {
            status: 200,
            headers: {
                'Content-Type': 'application/octet-stream',
                'Content-Disposition':
                    // Use filename* instead of filename to support non-ASCII characters
                    `attachment; filename*=UTF-8''${encodeURIComponent(name)}`,
            },
        }
    );
};

在使用

name

构建页面 URL 或使用

encodeURIComponent

类构建 URL 时，请确保对

URL

查询参数值进行编码。例如

{#each data.files as file}
  <a href="/files/download?name={encodeURIComponent(file)}">
    {file}
  </a>
{/each}