首页 文章

Angular / Spring Boot / Azure Ingress - URL重写

提问于
浏览 次
0

我使用Angular作为前端技术，后端使用spring boot，使用Azure Ingress作为webserver . 我的问题是，当用户刷新站点时，由于Angular路由而出现404错误 . 我想知道这种解决这个问题的方法是不是一个很好的做法，如果可以解决我自己的AJAX调用的任何问题：

@Configuration
class WebApplicationConfig
{
    @Bean
    public EmbeddedServletContainerCustomizer containerCustomizer()
    {
        return container -> {
            container.addErrorPages(new ErrorPage(HttpStatus.NOT_FOUND, "/index.html"));
        };
    }
}

？

编辑

我正在寻找的是我的技术堆栈的某种URL重写（例如在Apache webserver上） . 目前，JAR文件中有一个静态文件夹，它返回我的Angular文件 . 如果请求链接，则返回角文件（index.html和依赖项），但是当用户正在工作时，URL更改（仅在前端），如果他然后点击站点刷新，则会出现404错误 .

例如

http://somehost/some/static/url/ < - 好的

http://somehost/some/static/url/and/angular/route < - 404

所以我想知道上面的解决方案是否会很好 . 或许还有另一个更好的解决方案？

angular azure url spring-boot

2 回答

  • 0

    听起来你的Angular应用程序是由你的Spring Boot应用程序直接提供的 . 如果你想坚持使用这个解决方案（避免使用单独的Web服务器），你必须确保Spring Boot在任何路由下服务你的Angular应用程序的 index.html （当然，除了那些用于API的那个），如Mixalloff所述 .

    以下是我在项目中的表现：

    • 将Angular项目作为Maven项目中的子项目，假设在 src/main/frontend 中 . 因此，如果您构建Angular应用程序，您将在文件夹 src/main/frontend/dist 中获取其静态资源 .

    • 使用 maven-resources-plugin 仅将 src/main/frontend/dist 中生成的 index.html 复制到输出目录 target/classes/templates . 所以最后应该有文件 target/classes/templates/index.html .

    • 使用 maven-resources-plugin 将 src/main/frontend/dist 中的任何其他静态资源（如JavaScript，CSS等）复制到输出目录 target/classes/static . 这是您的文件当前也位于的位置 .

    • 在Spring Boot应用程序中包含一个廉价的模板引擎，例如使用 spring-boot-starter-mustache 将Mustache自动配置为Spring MVC的模板引擎 . 我们将使用为Angular应用程序生成的 index.html 作为Mustache模板 .

    • 创建一个Spring控制器，其方法返回任何路径的 index 视图名称 . 请注意请求映射到 /** ：

    @Controller
public class IndexPageController {
  @RequestMapping("/**")
  public String index() {
    return "index";
  }
}

    返回索引页面的通配符方法最后由Spring MVC自动排序，请参阅https://docs.spring.io/spring/docs/current/spring-framework-reference/web.html#mvc-ann-requestmapping-pattern-comparison

    因此，您仍然可以添加映射到更具体路径的更多控制器，例如 /api/v1/whatever .

    最后，您的Spring Boot应用程序将始终为任何与更具体的请求映射不匹配的路由返回 index.html 文件 .

    这带来了更多的糖：由于 index.html 被处理为Mustache模板，因此如果需要，它可以包含服务器端模板标记 .

    回复于
  • 2

    Angular独立地确定路由，并且必须管理404页面和其他页面的显示 . 您需要始终为服务器中的所有请求提供index.html文件

    回复于

相关问题