Hybris Cloud维护页配置：如何不转base64加载外部CSS及图片

你遇到的CSS、图片资源无法加载的问题，核心原因是维护模式下JS Storefront的路由拦截规则与常规访问场景不同，无需强制使用base64内嵌资源方案，按以下规范调整即可正常加载外部资源：

1. 资源引用规则调整 #

所有资源在503.html中必须使用相对路径引用，路径前缀统一为./，禁止使用绝对路径或/开头的根路径（这类路径会被维护模式下的路由规则拦截，返回404），示例写法如下：

<!-- 样式文件引用 -->
<link rel="stylesheet" href="./style.css">
<!-- 图片资源引用 -->
<img src="./img1.jpg" alt="维护提示">
<!-- 若资源放在assets子目录下，引用写法如下 -->
<link rel="stylesheet" href="./assets/style.css">
<img src="./assets/img2.png" alt="提示图标">

2. 压缩包结构与打包规范 #

• 压缩包根目录必须保留error文件夹，所有资源（503.html、图片、样式、子目录等）均需放在该文件夹内
• 打包时需选中error文件夹本身进行压缩，不要直接选中文件夹内的所有文件打包：

  正确打包的error.zip解压后，第一层仅显示error文件夹，进入文件夹后才是503.html等资源
  错误打包会导致压缩包第一层直接显示503.html等文件，不符合云门户静态资源的解析规则

3. 命名规范要求 #

文件无需遵循特殊命名规则，仅需避免使用中文、空格、特殊字符即可，建议所有文件名使用小写英文字母、数字、下划线或短横线组合。

验证方法 #

上传配置完成后开启维护模式，可通过浏览器开发者工具的网络面板查看资源请求状态，若仍有404报错，优先核对资源引用路径是否符合相对路径要求，其次检查压缩包的目录结构是否正确。

内容的提问来源于stack exchange，提问作者Harvey