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}">
1
2

• 远程微服务放行静态资源，修改配置文件

spring:
  application:
    name: ProductPageDemo
  # 放行静态资源
  resources:
    static-locations: classpath:/static/
1
2
3
4
5
6

• Gateway网关配置文件

server:
  port: 80
spring:
  application:
    name: GatewayDemo
  cloud:
    gateway:
      # 配置路由
      routes:
        - id: ProductPageDemo
          uri: http://ProductPageDemo:9100
          predicates:
            # 断言，以 /page/ 开头进行匹配
            - Path=/page/**
          filters:
            # 过滤器，会去除第一级路径然后进行路由
            - StripPrefix=1
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

• 进行请求：http://127.0.0.1/page/page/all
  

2.2 修改成功，成功加载

• 因为我的路由匹配需要除去第一级匹配路径，所以我们需要在 对应微服务引入静态资源的时候修改静态资源路径，/page/css/index.css

<!-- 引入外部 样式文件 -->
<link rel="stylesheet" type="text/css" href="../static/css/index.css" th:href="@{/page/css/index.css}">
1
2

• 进行请求：http://127.0.0.1/page/page/all
  

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

server:
  port: 80
spring:
  application:
    name: GatewayDemo
  cloud:
    gateway:
      # 配置路由
      routes:
        - id: ProductPageDemo
          uri: http://ProductPageDemo:9100
          predicates:
            # 断言，以 /page/ 开头进行匹配
            - Path=/page/**,/css/** # 放行静态资源路径
1
2
3
4
5
6
7
8
9
10
11
12
13
14