Gateway微服务路由使微服务静态资源加载失败

1.Gateway

1.1 Gateway介绍

  • Gateway就是网关微服务,为我们的各个微服务集群提供一个统一的入口,根据路由匹配进行断言,进行对应微服务的访问

2.Gateway 成功之前和之后

2.1 静态资源失败场景重现

  • 远程微服务页面上引入的静态资源路径,/css/index.css
<!-- 引入外部 样式文件 -->
<link rel="stylesheet" type="text/css" href="../static/css/index.css" th:href="@{/css/index.css}">

在这里插入图片描述

  • 远程微服务放行静态资源,修改配置文件
spring:
  application:
    name: ProductPageDemo
  # 放行静态资源
  resources:
    static-locations: classpath:/static/
  • Gateway网关配置文件
server:
  port: 80
spring:
  application:
    name: GatewayDemo
  cloud:
    gateway:
      # 配置路由
      routes:
        - id: ProductPageDemo
          uri: http://ProductPageDemo:9100
          predicates:
            # 断言,以 /page/ 开头进行匹配
            - Path=/page/**
          filters:
            # 过滤器,会去除第一级路径然后进行路由
            - StripPrefix=1

2.2 修改成功,成功加载

  • 因为我的路由匹配需要除去第一级匹配路径,所以我们需要在 对应微服务引入静态资源的时候修改静态资源路径,/page/css/index.css
<!-- 引入外部 样式文件 -->
<link rel="stylesheet" type="text/css" href="../static/css/index.css" th:href="@{/page/css/index.css}">

2.3 如果没有去除第一级路径,大家可以如下配置

server:
  port: 80
spring:
  application:
    name: GatewayDemo
  cloud:
    gateway:
      # 配置路由
      routes:
        - id: ProductPageDemo
          uri: http://ProductPageDemo:9100
          predicates:
            # 断言,以 /page/ 开头进行匹配
            - Path=/page/**,/css/** # 放行静态资源路径
Logo

权威|前沿|技术|干货|国内首个API全生命周期开发者社区

更多推荐