TaikiTkwkbysh
@TaikiTkwkbysh (WAKA Engineer)

Are you sure you want to delete the question?

If your question is resolved, you may close it.

Leaving a resolved question undeleted may help others!

We hope you find it useful!

【Next.js】nxt.config.jsのrewirte機能の設定について

解決したいこと

next.config.jsのrewrite機能の設定について教えて頂きたいことがございます。

教えてほしい箇所

 async rewrites() {
    return [
      {
       // ex. api/proxy
        source: `${process.env.NEXT_PUBLIC_API_BASE_PATH}/:match*`,
       // ex. http://localhost:8000
        destination: `${process.env.API_BASE_URL}/:match*`,
      },
    ]
  },

このsourceとdestinationのところの、リンクにある、

:match*

というのは何を表しているのでしょうか。


色々なサイトを探してみたのですが見つからず、
Next.jsの公式ドキュメントにもこのmatchというものがありません。
恐らく、rewrites機能というよりかは、next.config.jsのパラメータ機能なのかと思いますが、
そこまでしか知ることができませんでした。

sourceに設定したリクエストのURLパターンと実際のリクエストのURLパターンがマッチしているか
を確認するものなのかなとは思ったのですが、
公式ドキュメントには似たようなものに、slugというものがあります。

module.exports = {
  async rewrites() {
    return [
      {
        source: '/blog/:slug',
        destination: '/news/:slug', // Matched parameters can be used in the destination
      },
    ]
  },
}

これとは何が違うのでしょうか。

ご存じの方がいらっしゃいましたら、ご教示のほど宜しくお願い致します。

0

1Answer

matchという文字そのものに意味があるわけではなく:matchという変数名と言う意味です.
Regexのグループをご想像いただければと思います.

source: `${process.env.NEXT_PUBLIC_API_BASE_PATH}/:match*`,
// If http://***/a/b/123 then :match* = "a/b/1/2/3"
destination: `${process.env.API_BASE_URL}/:match*`,
// Will redirect to {API_BASE_URL}/a/b/1/2/3
1Like

Comments

  1. @TaikiTkwkbysh

    Questioner

    @Verclene様

    この度はご教示いただき、誠にありがとうございます。
    変数名だったのですね、理解致しました。


    お忙しい中ご教示いただき、ありがとうございました。
    また機会がございましたら、ぜひご教示のほど宜しくお願い致します。

Your answer might help someone💌