Routing-controllers: res.sendFile() and Webpack

Created on 4 Mar 2018 · 3Comments · Source: typestack/routing-controllers

Hello.

I would like to send an image file to the frontend, but unfortunately always get a 404 error although the image is present. I packed the whole thing with webpack.

my code:
`

import {
    Controller,
    Get,
    QueryParam,
    Param,
    Res
  } from "routing-controllers";
import * as path from "path";
import { Response } from "express";

@Controller('/media')
export class MediaController {
    @Get("/:file")
    NewDayBookPost(
        @QueryParam('key') key: string,
        @Param('file') file: string,
        @Res() res: Response
    ) {
        const fileName = path.resolve(__dirname, "data", file);
        res.download(fileName);
    }
}

the error:
Error at NotFoundError.HttpError [as constructor] (C:projectsgsk-wohnbauservernode_modulesrouting-controllershttp-errorHttpError.js:27:23) at new NotFoundError (C:projectsgsk-wohnbauservernode_modulesrouting-controllershttp-errorNotFoundError.js:20:28) at ExpressDriver.handleSuccess (C:projectsgsk-wohnbauservernode_modulesrouting-controllersdriverexpressExpressDriver.js:289:23) at C:projectsgsk-wohnbauservernode_modulesrouting-controllersRoutingControllers.js:128:61 at process._tickCallback (internal/process/next_tick.js:109:7)

Thx :)

Source

circy

Most helpful comment

That's my solution, it's not pretty, but that's the way it works.

import { Controller, Get, QueryParam, Param, Res } from "routing-controllers";
import * as path from "path";
import { Response } from "express";

@Controller("/media")
export class MediaController {
  @Get("/:file")
  async NewDayBookPost(
    @QueryParam("key") key: string,
    @Param("file") file: string,
    @Res() res: Response
  ) {
    const fileName = path.resolve(__dirname, "data", file);

    try {
      await new Promise((resolve, reject) => {
        res.sendFile(fileName, (err: any) => {
          if (err) reject(err);
          resolve();
        });
      });
    } catch (error) {
      console.log(error);
      throw new Error(error);
    }

    return;
  }
}

circy on 4 Mar 2018

👍6

All 3 comments

That's my solution, it's not pretty, but that's the way it works.

import { Controller, Get, QueryParam, Param, Res } from "routing-controllers";
import * as path from "path";
import { Response } from "express";

@Controller("/media")
export class MediaController {
  @Get("/:file")
  async NewDayBookPost(
    @QueryParam("key") key: string,
    @Param("file") file: string,
    @Res() res: Response
  ) {
    const fileName = path.resolve(__dirname, "data", file);

    try {
      await new Promise((resolve, reject) => {
        res.sendFile(fileName, (err: any) => {
          if (err) reject(err);
          resolve();
        });
      });
    } catch (error) {
      console.log(error);
      throw new Error(error);
    }

    return;
  }
}

circy on 4 Mar 2018

👍6

If you want to handle the response by yourself, just make sure you return the response object itself from the action.
https://github.com/typestack/routing-controllers#using-request-and-response-objects