Tsed: [QUESTION] Best practice for serving files through API Endpoint (Not static)

[reed-lawrence]

I have the following endpoint sitting behind some middlewares on the controller. There are complex visibilty permissions, and it fetches a file from a cloud host, these are not static files.

  @Get('/get/:filename')
  async GetFile(@PathParams('filename') filename: string, @Res() res: Response) {

    const buffer: Buffer = await this.storage.FetchFile(filename);

    res.setHeader('Content-Disposition', `inline;filename=${filename}`);
    res.setHeader('X-Content-Type-Options', "nosniff");
    res.setHeader('Content-Type', 'image/png');

    res.send(buffer);

  }

The above code works - sort of. It is downloading the image, not displaying it inline as expected. The documentation outlines how to serve static files, but that approach does not fit as I am not serving files that are located on the server - nor are publicly accessible.

What is the best practice for serving files via endpoints?

[Romakita]

If you return directly the buffer it should works, no?

[reed-lawrence]

No it does not send as a renderable image unless I call res.send(buffer)

return buffer will return a 200, and the response size is as expected, but the image does not render by the browser.

[Romakita]

Yes because you have to set the Content-type at least.

[reed-lawrence]

I have tried to set the content type with both res.contentType('png') and res.setHeader('Content-Type', 'image/png'), and can confirm that these headers are displaying in the response. However its displaying as an empty <img> unless I use res.send(buffer)

[Romakita]

Is it possible to have a minimal reproducible example on a repository?

[reed-lawrence]

Not so much as a repo, but here is a minimum viable working example endpoint:

(Uses superagent package)

  @Get('/get-google')
  async GetGoogle(@Res() res: Response) {
    const http: SuperAgentStatic = agent();

    const image_res = await http.get('https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png');

    res.setHeader('Content-Disposition', 'inline;filename=googlelogo_color_272x92dp.png;');
    res.setHeader('X-Content-Type-Options', "nosniff");
    res.setHeader('Content-Type', 'image/png');

    // res.send(image_res.body); // Works
    return image_res.body; // Does not work

  }

[Romakita]

Perfect I work on it!

[Romakita]

@reed-lawrence The PR is ready. You can review it: https://github.com/TypedProject/tsed/pull/1210

See you
Romain

[Romakita]

:tada: This issue has been resolved in version 6.22.4 :tada:

The release is available on:

• v6.22.4
• GitHub release

Your semantic-release bot :package::rocket: