Ant Design Pro 部署到 aliyun oss 遇到的一个小问题

以往前端页面和后端服务放同一服务器,通过nginx配置。现决定将前端静态资源部署到阿里云OSS,后台接口允许跨域请求。Ant Design Pro项目打包上传后刷新页面报错,问题与前端路由有关,可通过配置Hash History或在阿里云OSS镜像回源设置解决。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

       以往我们都是买一台服务器托管,然后把前端页面和后端服务放在同一台机器上,把域名解析到这台服务器,通过nginx绑定域名,并指向到前端页面所在目录,前端页面请求接口,就配置nginx代理转发,比如匹配到 '/xxxx',就转发到后台服务上。

       但是我们现在决定把前端页面(html,js,css,图片等其他静态资源)部署到 (阿里云对象存储服务(Object Storage Service,简称 OSS),然后后台接口允许跨域请求。

       这些都设置好后,我就把 Ant Design Pro 的项目打包上传到aliyun oss,一切都很正常,但是就不能刷新页面,一刷新页面就报这样的错误,错误信息:This XML file does not appear to have any style information associated with it. The document tree is shown below.

如图

       这个问题跟前端路由有关系,Ant Design Pro(>=2.0) 使用 UmiJS ,umi 默认是用的 Browser History,如果要用 Hash History,需配置:

export default {

    history: 'hash',

}

       

       如果我们使用默认配置(Browser History),以前我们需要在nginx里这样配置:

location / {

        # 用于配合 browserHistory使用

        try_files $uri $uri/ /index.html;

    }

       而在 aliyun oss 里,我们可以通过在 基础设置 --> 镜像回源 来设置,也可以达到这样的效果。

        设置如下:

图1

图2

           设置完立即生效,再刷新页面,就正常了。

来源:

Ant Design Pro 部署到 aliyun oss 遇到的一个小问题-留客客-获客营销saas系统

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值