h3 icon indicating copy to clipboard operation
h3 copied to clipboard

Fix type information to allow express middlewares

Open tobiasdiez opened this issue 3 years ago • 5 comments
trafficstars

If you use an express-middleware (such as session or passport), one gets the following typescript error:

Type 'RequestHandler<ParamsDictionary, any, any, ParsedQs, Record<string, any>>' is not comparable to type 'EventHandler<any>'.

Example-code:

import session from 'express-session'
import passport from 'passport'
import { createApp } from 'h3'

const app = createApp()
app.use(session())
app.use(passport.initialize())

tobiasdiez avatar Jul 20 '22 09:07 tobiasdiez

@tobiasdiez

@pi0 explains it in #73 why they are changing middleware signature.

In my understanding, h3 is aiming to be environment-agnostic server framework for future, even with trade-offs like abandoning the existing ecosystem.

One possible compromise might be to provide a glue function that convert event from req/res and vice versa, so that we can wrap legacy middlewares, as well as letting the community recreate h3-dedicated middlewares.

// This is a virtual code 
// `eventify` passes `req/res` and `next` function to the wrapped middleware
app.use(eventify(session()))

nozomuikuta avatar Aug 04 '22 14:08 nozomuikuta

Sorry, I should have been more precise. There is already such a wrapper in place (und the hood) and the above code does work. It's only that TypeScript is throwing an error, so I guess something is off here https://github.com/unjs/h3/blob/4b83bdf83b94da3f66018378d39c5cc24afdf43f/src/types.ts#L23

tobiasdiez avatar Aug 04 '22 15:08 tobiasdiez

Sorry, I misunderstood you.

By the way, I couldn't instantly reproduce the error that you are taking about. Would you provide a link to reproduction, so that I can investigate it more deeply?

nozomuikuta avatar Aug 05 '22 18:08 nozomuikuta

@NozomuIkuta please have look at this ts Playground. The app.use calls are showing ts errors.

tobiasdiez avatar Aug 31 '22 21:08 tobiasdiez

@tobiasdiez

For your information, I found that @pi0 had created a branch where he is removing compatibility with legacy Express-style middleware whose signature is (req, res, next?) => {}.


By the way, it's written in README that:

For maximum compatibility with connect/express middleware (req, res, next? signature), h3 converts classic middleware into a promisified version ready to use with stack runner:

Once the branch is merged, the "maximum" compatibility get to be "zero" (note: this change has been planned in #73).

So, at this moment, all options we have would be (1) to make up h3-native auth solution by ourselves rather than making h3 complex by adding Express middleware support, or (2) to give a support to authors so that they can do it for us (e.g. sponsoring via GitHub). That's just because h3 is an OSS.

nozomuikuta avatar Sep 15 '22 19:09 nozomuikuta

Middleware made for express, depend on specific auegmentations coming from express app itself (.json(), .cookie(), etc)

In order to use express middleware with h3, you need to first create an express app:

const app = h3.createApp()

const expressApp = express()
expressApp.use(expressMiddleware()

app.use(h3.fromNodeMiddleware(expressApp))

pi0 avatar Oct 18 '22 09:10 pi0