如何在springboot服务器中托管angular构建文件？

Question

我有一个类似于以下的 spring 引导配置文件，

server:
  port: 8002
  servlet:
    context-path: /api/
...

spring:
  mvc:
    static-path-pattern: "/resources/**"
...

我已将我的 angular 项目中的构建文件复制粘贴到resources/resources/static中。

不知道这是否相关。 这是我的JwtFilter.java ，

@Component
public class JwtFilter extends OncePerRequestFilter {

    final private JwtUtil jwtUtil;

    @Autowired
    JwtFilter(JwtUtil jwtUtil) {
        this.jwtUtil = jwtUtil;
    }

    @Override
    protected void doFilterInternal(
      HttpServletRequest httpServletRequest,
      HttpServletResponse httpServletResponse,
      FilterChain filterChain
    ) throws ServletException, IOException {
        Cookie[] cookies = httpServletRequest.getCookies();
        if(cookies == null) {
            cookies = new Cookie[]{};
        }
        Cookie jwtCookie = Arrays.stream(cookies)
          .filter(cookie -> cookie.getName().equals(StringConstants.JWT_AT_COOKIE_NAME))
          .findFirst()
          .orElse(null);

        Cookie rtCookie = Arrays.stream(cookies)
          .filter(cookie -> cookie.getName().equals(StringConstants.RT_COOKIE_NAME))
          .findFirst()
          .orElse(null);

        if (rtCookie == null) {
            httpServletResponse.sendError(401, "REFRESH_TOKEN_NOT_FOUND");
            return;
        }

        String jwt = null;
        String uid = null;

        try {
            if (jwtCookie != null) {
                jwt = jwtCookie.getValue();
                uid = jwtUtil.extractSubject(jwt);
            } else {
                httpServletResponse.sendError(401, "User not authenticated!");
            }

            if (uid != null) {
                if (!jwtUtil.validateToken(jwt)) {
                    httpServletResponse.sendError(401, "EXPIRED_JWT_TOKEN_EXCEPTION");
                    return;
                }
            }
        } catch (SignatureException exception) {
            httpServletResponse.sendError(403, exception.getMessage());
            return;
        }
        filterChain.doFilter(httpServletRequest, httpServletResponse);
    }

    @Override
    protected boolean shouldNotFilter(HttpServletRequest request) {
        String path = request.getRequestURI();
        return path.equals("/api/auth") || path.equals("/api/auth/");
    }
}

我尝试将这些 js 构建文件添加到 META-INF/resources、public & resources。 那里也没有 go。

目录结构为：

• 爪哇/...
• 资源/
  • 资源/
    • 元信息/
      • 资源/ [包含 angular 构建文件]
    • public/ [包含 angular 构建文件]
    • 资源/ [包含 angular 构建文件]
    • static/ [包含 angular 构建文件]

现在，如果我从 go 到http://localhost:8002/那么它只是说HTTP Status 404 – Not Found 。

Answer 1

项目结构需要更多的工作。

在这里查看问题。

在一个 jar 中构建 angular 11 和 Spring 引导 2.x

删除这个。

spring:
  mvc:
    static-path-pattern: "/resources/**"

您想将npm build工件放入src/main/resources/static中。

首先， npm run build ，您将在dist/中找到工件。

将dist/中的任何内容复制到src/main/resources/static/中。 例如， dist/index.html将被复制并粘贴到src/main/resources/static/index.html中。

强制 Springboot 服务index.html

但是，这里有一个问题。 如果你介意 url 中的 hash 片段#/foo/bar ，你需要告诉 Springboot 在 404 上服务index.html 。

@SpringBootApplication
public class BlogApiApplication {

    public static void main(String[] args) {
        SpringApplication app = new SpringApplication(BlogApiApplication.class);
        app.run(args);
    }


    @Bean
    public EmbeddedServletContainerCustomizer containerCustomizer() {

        return new EmbeddedServletContainerCustomizer() {
            @Override
            public void customize(ConfigurableEmbeddedServletContainer container) {

                ErrorPage error404Page = new ErrorPage(HttpStatus.NOT_FOUND, "/index.html");

                container.addErrorPages(error404Page);
            }
        };
    }
}

这样就不需要hash模式了。 React 和 Vue 也是如此。

参考