Expressのルーティング順序について

Question

Express.jsでアプリを作成しています。初めてサイトに訪れたときに匿名ユーザーを自動で作成してクッキーに保存するために以下のミドルウェアを作りました。

const User = require('../models/user');

const createAnonymUser = async (req, res, next) => {
  if (!req.cookies.anonymUser && !req.user) {
    const anonymUser = await User.create({ username: 'anonymous', displayName: '名無しさん' });
    res.cookie('anonymUser', anonymUser);
    return next();
  }
  next();
};

module.exports = createAnonymUser;

このミドルウェアをすべてのルーティングに優先させて実行したいのですが、現状匿名ユーザーが作成されるよりも先に他のルーティングが実行されてしまう結果、匿名ユーザーのプロパティを取得できずエラーが発生してしまいます。リロードするとエラーは消えます。

ルーティングの設定は以下のようになっています。Expressは上から順にルーティングを実行していくと聞いたことがあり、ミドルウェアを一番上に置いているのですが、なぜうまく行かないのでしょうか？

// router setup
app.use(createAnonymUser);
app.use(indexRouter);
app.use('/questions', questionsRouter);
app.use('/oauth2', oauth2Router);
app.use('/comments', commentsRouter);
app.use('/users', usersRouter);

###追記
実行例①

const createAnonymUser = (req, res, next) => {
  console.log('createAnonymUser');
  if (!req.cookies.anonymUser && !req.user) {
    const anonymUser = (async () => await User.create({ username: 'anonymous', displayName: '名無しさん' }))();
    console.log(anonymUser);
    res.cookie('anonymUser', anonymUser);
    return next();
  }
  next();
};

結果①

実行例②

const createAnonymUser = (req, res, next) => {
  console.log('createAnonymUser');
  if (!req.cookies.anonymUser && !req.user) {
    (async () => {
      const anonymUser = new User({ username: 'anonymous', displayName: '名無しさん' });
      await anonymUser.save();
      res.cookie('anonymUser', anonymUser);
      console.log(anonymUser);
      return next();
    })();
  } else {
    next();
  }
};

結果②

Answer 1

const createAnonymUser = (req, res, next) => {
  console.log('createAnonymUser');
  if (!req.cookies.anonymUser && !req.user) {
    User.create({ username: 'anonymous', displayName: '名無しさん' }, (err, anonymUser) => {
      if (err) {
        console.log(err);
      }
      res.cookie('anonymUser', anonymUser);
      res.redirect(req.originalUrl);
    });
  } else next();
};

レスポンスが帰ってきた後でなければcookieに保存されているデータにアクセスできないので、cookieにデータを保存した直後にリダイレクトさせることで、後続のミドルウェアでreq.cookieからデータを取得できるようにしました。

Answer 2

なぜうまく行かないのでしょうか？

ミドルウェアを async 関数にしているためです。

ExpressはPromiseが標準化される以前に登場したNodeJS用のフレームワークです
コールバック形式のミドルウェア関数を内部実装でフロー制御します。

ご質問のように async 関数をミドルウェアにした場合、
async 関数自体は非同期ですので、Promiseの結果を待たずにフロー制御され、
次のミドルウェア関数に処理を移そうとします。

---

Promise を返却する関数を活用する場合、
以下のように async関数を即時実行する形にするなど、工夫が必要です。

const User = require('../models/user');

const createAnonymUser = (req, res, next) => {
  
  if (!req.cookies.anonymUser && !req.user) {
    const anonymUser = (async () => {
      return await User.create({ username: 'anonymous', displayName: '名無しさん' });
    })();
    res.cookie('anonymUser', anonymUser);
    return next();
  }
  next();
};
/**
const createAnonymUser = (req, res, next) => {
  
  if (!req.cookies.anonymUser && !req.user) {
    User.create({ username: 'anonymous', displayName: '名無しさん' })
      .then( anonymUser => {
        res.cookie('anonymUser', anonymUser);
        return next();
      })
    })();
  }
  else next();
};
 */
module.exports = createAnonymUser;

Comments

[maskmelon]

回答くださりありがとうございます。確かに非同期関数のミドルウェアを順次実行すると実行完了を待たずに次の関数に移るのが自然ですね。。

ご指摘頂いた方法を試してみたのですが（実行例①）、プロミスがPending状態で返ってきてしまいました。
そこで匿名ユーザーの作成、保存、return next()までをasync関数の中に入れて、ifelseで分岐してnext()を実行させるようにしました。（実行例②）
ログ出力をすると、createAnonymUser関数の実行→作成したanonymUserの表示→レンダリングという順になっているのですが、やはりレンダリングの時点でanonymUserのプロパティにアクセスすることができません。度々の質問で申し訳ないのですが、ご教授頂けますと幸いです。

[AkitoshiManabe]

本来は、コールバックで記述するのが安定するフレームワークですので、フローは色々考えてみる必要があります。回答欄のソースにコメントでもう一例を記述してみました。

[maskmelon]

返事が遅くなってしまい申し訳ありません。
非同期処理の制御について理解が深まりました。ありがとうございます。