Маршрутизация в статических веб-приложениях Azure

Я хочу настроить маршрутизацию для своего приложения Angular в статическом веб-приложении Azure, чтобы следующая конфигурация работала должным образом.

Мой staticwebapp.config.json

      {
    "routes": [
        {
            "route": "/old-route/page/",
            "redirect": "/new-route/page/",
            "statusCode": 301
        },
        {
            "route": "/old-route/page/:filepath",
            "redirect": "/new-route/page/:filepath",
            "statusCode": 301
        },
        {
            "route": "/old-route/page/{id}",
            "redirect": "/new-route/page/{id}",
            "statusCode": 301
        },
        {
            "route": "/old-route/page/:path*.aspx",
            "redirect": "/new-route/page/:path",
            "statusCode": 301
        }
    ],
    "navigationFallback": {
        "rewrite": "/index.html",
        "exclude": [
            "*.{css,scss,png,gif,ico,jpg,svg}"
        ]
    } 
}

Первый работает как положено.

Второй и третий должны быть перенаправлены на «/new-route/page/:filepath» с указанием пути к файлу или идентификатора. но ничто из них не работает так, как ожидалось. Четвертый должен быть перенаправлен на «/new-route/page/:path» без расширения. но все работают не так, как ожидалось, кроме первого.

правильна ли моя конфигурация и есть ли способ решить эту проблему?

1 ответ

Я согласен с MikeOne, спасибо за ваши идеи

Согласно этой ссылке MSDoc , этот подстановочный знак полезен, если вы хотите захватить различные маршруты по общему шаблону.

Я попробовал с моим нижеstaticwebapp.config.json и развернут

          {
      "trailingSlash": "auto",
      "routes": [
        {
          "route": "/profile*",
          "allowedRoles": ["authenticated"]
        },
        {
          "route": "/images/*",
          "headers": {
          }
        },
        {
          "route": "/customers/contoso*",
          "allowedRoles": ["administrator", "customers_contoso"]
        },
        {
          "route": "/login",
          "rewrite": "/.auth/login/github"
        },
        {
          "route": "/.auth/login/twitter",
          "statusCode": 404
        },
        {
          "route": "/logout",
          "redirect": "/.auth/logout"
        },
        {
          "route": "/calendar*",
          "rewrite": "/calendar.html"
        },
        {
          "route": "/specials",
          "redirect": "/deals",
          "statusCode": 301
        }
      ],
      "navigationFallback": {
        "rewrite": "index.html",
        "exclude": ["/images/*.{png,jpg,gif}", "/css/*"]
      },
      "responseOverrides": {
        "400": {
          "rewrite": "/invalid-invitation-error.html"
        },
        "401": {
          "redirect": "/login",
          "statusCode": 302
        },
        "403": {
          "rewrite": "/custom-forbidden-page.html"
        },
        "404": {
          "rewrite": "/404.html"
        }
      },
      "globalHeaders": {
        "content-security-policy": "default-src https: 'unsafe-eval' 'unsafe-inline'; object-src 'none'"
      },
      "mimeTypes": {
        ".json": "text/json"
      }
    }

Результат:

введите сюда описание изображения

введите сюда описание изображения

В контексте такого маршрута звездочка (*) — это подстановочный знак, который соответствует нулю или более символам. Это часто используется в шаблонах маршрутов для охвата нескольких возможностей.

В примере"/profile*", он будет соответствовать любому маршруту, который начинается с «/profile», за которым следует ноль или более символов. Например, это будет соответствовать «/profile», «/profile/settings», «/profile/123» и т. д.

Другие вопросы по тегам