生产构建后,Angular 6的重新加载中断 [英] Angular 6 Application Breaks on reload after production build

查看:74
本文介绍了生产构建后,Angular 6的重新加载中断的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个应用程序,其中保存了dist文件夹,成功后,我们在我的服务器上构建了该文件夹.所有模块均正常运行组件运行正常.直到我手动重新加载浏览器窗口,它才会引发以下错误.我也使用base-href构建项目-/dist/

I have an application where i have kept that dist folder which we get after success full production build on my server. All works fine all modules & components are working perfectly. Untill I reload the browser window manually, it throws the below errors. Also i have build the project using base-href -- /dist/

        Object not found!
        The requested URL was not found on this server. If you entered the URL 
        manually please check your spelling and try again.

        If you think this is a server error, please contact the webmaster.

推荐答案

您必须将服务器设置为针对通常不存在的任何URL发送index.html(通常).

You have to setup your server to send index.html (generally) for any URL that does not exist.

发生的情况是,当您移至应用程序中的其他路由时,是JS处理了您的路由.但是一旦刷新,浏览器便会要求服务器处理该请求,并且由于路由未在服务器端处理,因此会报告上述错误.

What happens is when you move to a different route within the application, it is the JS that is handling your routing. But once you hit refresh, it is the browser asking your server to handle that request and since routes are not handled at the server side, it reports the said error.

因此,无论浏览器要求什么路径,您都需要提供index文件.

Hence, you need to deliver the index file, no matter what route the browser asks for.

好吧,如果我们谈论从前端开始使用api,那么如果您之间有任何静态服务器或可以处理/api,则可以使用称为反向代理的概念.在服务器端的任何*路由之前进行路由,以使您的请求由服务器以不同的方式处理.

Well, if we talk about hitting the api from the front end, then you may use the concept called reverse proxy, if you have got any static server in between or handle /api route before any * route at server side, to let your request be handled by the server differently.

看看此指南来配置服务器.

但是,还有一种巧妙的方法来处理路由.通过使用useHash: true.请在此处查看指南.

There is however a clever way to handle routing as well. By using useHash: true. Please look at the guide here.

RouterModule.forRoot(routes, { useHash: true })

这篇关于生产构建后,Angular 6的重新加载中断的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆