【Angular】——路由之刷新报404

最新推荐文章于 2024-08-12 17:09:58 发布
最新推荐文章于 2024-08-12 17:09:58 发布
阅读量5.4k 收藏 4
点赞数 3
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/onlybymyself/article/details/72794619
版权
当在Angular应用中遇到刷新导致404错误的问题，主要是因为刷新时浏览器直接请求后端，而未走前端路由。传统的解决方法是设置后端重定向，但这违背前后端分离原则。通过查阅资料，找到了前端解决方案：在app.module.ts中进行配置，确保刷新时仍走前端路由，从而避免404错误。
摘要由CSDN通过智能技术生成

    项目进入测试期，发现了一个开发过程中没有发现的问题：发布后访问网站，使用过程一切正常：


    但只要刷新，就会：


      开始查了一些资料：大都是关于这样的说法：

最低0.47元/天 解锁文章
非本人文章
关注
angular6页面刷新时报HTTP Status 404 – Not Found
盼盼盼的博客
05-14 1680
错误信息： HTTP Status 404 – Not Found Type Status Report Description The origin server did not find a current representation for the target resource or is not willing to disclose that one exists. Apache...
Angular基础教程+Demo项目——尽可能全面一些——第一节
Burnup_110的博客
11-21 1833
第二节预告：生命周期函数、Rxjs、数据请求、路由 学习过程中所写的Demo_GitHub——学习Angular——浅度学习Demo 官网：https://angular.cn/（官网是最好的老师哦，追求技术的大神可以继续深入啦） Angular前言（跳过即可，自勉而已） 一写博客，不例外的喜欢啰嗦一下，本人是广大java后端开发中的一员，但是因为工作需要不得不利用工作之余学习Angular前端，虽然我对于学习前端技术不反感，但是我更加信奉T型发展，先精后广，后端远远称不上精通，就要走广而多的路子了，就怕以
angularjs 刷新 404
renpinghao的专栏
07-15 3420
在项目根目录下，添加 .htaccess 文件。 文件内容为 RewriteEngine On Options FollowSymLinksRewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . index.html这是以apache作为服务器为例的。如果是nginx作为服务器，
vue项目，页面刷新就404了
最新发布
一个UI、前端爱好者。
08-12 2503
history模式：需要在服务器端配置，确保所有路由都重定向到index.html。hash模式：更简单，不需要服务器端配置，但 URL 中会有。根据你的项目需求和服务器环境选择合适的解决方案。
angular路由跳转页面后刷新报404错误
xif3681的博客
09-25 2188
服务器环境: nginx    问题： 刷新请求页面时，nginx 等服务器会先于angular接管页面跳转，由于nginx并没有 angular里的路由，因此会报错。 解决： nginx 配置： try_files $uri $uri/ /index.html =404; #这里一定要设置 http://www.cnblogs.com/wawahaha/p/4641691.ht...
【angular】路由之刷新报404
FCat
10-31 2077
项目开发完成，build发布后，发现转到路由后刷新页面报错404解决方法： 找到项目中app.module.ts文件 增加红圈的内容 然后打包发布：ng build –prod –aot
Angular打包到tomcat后页面刷新404
aliaichidantong的博客
06-29 490
一、Angular项目打包后部署到tomcat下，刷新页面会报404的错误 原因是找不到地址，我的环境是用nginx代理之后的 网上找到2中解决方案，我用的第二种，第一种没测试 1、app.module.ts imports: [ RouterModule.forRoot(routers, {useHash: true}) ], 2、app.module.ts import { LocationStrategy, HashLocationStrategy } from '@angul
英雄之旅：Angular教程应用
02-12
**Angular教程应用——“英雄之旅”** Angular是一款强大的前端开发框架，由Google维护，用于构建交互式的单页应用程序（SPA）。这个“英雄之旅”是Angular官方提供的一个基础教程，旨在帮助初学者理解Angular的...
两天学会Angular开发——第二天
zhuzhiqiang_zhu的博客
08-15 263
Angular实战开发-第一节 项目地址：Github 搜索 zhuzhiqiang/douBanVideo 简述 在第一节中，我们把工程搭建好了，首页的分类也能展示。接下来我们要做的是： 点击每一个分类，去请求数据，展示 请求接口 请求接口的代码封装在 home.service.ts 文件中。使用的数据是 mock 数据，放在 mock-data 文件夹中，项目中用到的接口地址都放在 ma...
angularJS的两种路由ng-router和ui-router的差异
IT修真院：初学者转行到互联网的聚集地
05-17 4403
这里是修真院前端小课堂，每篇分享文从 【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】 八个方面深度解析前端知识/技能，本篇分享的是： 【angularJS的两种路由ng-router和ui-router的差异】 大家好，我是IT修真院深圳分院第07期学员，一枚正直善良的web程序员。 今天给大家分享一下，修真院官网 JS-06任...
angular4打包以后，刷新报404
diaobei9747的博客
07-06 260
项目打包以后，上传到服务器，可以正常的切换页面，但是一旦刷新就会报404，找不到页面，其解决方法是：在app.module.ts里面引入下面的模块： import {HashLocationStrategy, LocationStrategy} from "@angular/common"; 在providers数组里面加入： providers: [{ ...
Angular2 路由刷新404解决办法
李纯
10-22 2396
Angular2设置路由，部署后刷新后Tomcat直接出来404。 从来只逛博客，赞都懒得点的人突然开始写博客。只是因为最近接触了Angular2，网上资源太少，之前又没有Angular1的基础，真是举步维艰，记录下自己艰辛的历程。同时公司没有建立知识库博客等相关的工具，在此方便交流下，还有上班些博客其实不当误工作的 ^_^ (代码部分也不涉及公司业务)。
项目（Angular + Ionic）打包成 H5 应用后，刷新路由报 404，且图标不显示
Lyrelion的博客
12-26 832
1.项目（Angular + Ionic）打包成 H5 后，刷新路由报 404； 2.项目（Angular + Ionic）打包成 H5 后，图标无法正常显示；
《Angular之部署刷新404错误解决》
杨晓风 迷迭香的记忆
11-26 3970
随着Angular的深入实践，某些问题悄然浮出水面，但方法总比困难多，请听小编娓娓道来。
angularjs路由跳转页面后刷新报404错误
高飞的专栏
06-07 4955
服务器环境: nginxangularjs自带路由功能，当通过路由跳转的新页面时，由于目录下并不存在该页面对应的静态文件，所以此时执行刷新页面，会报404的错误。进一步讲，原因是在刷新请求页面时，nginx 等服务器会先于angularjs接管页面跳转，由于nginx并没有 angularjs里的路由，因此会报错。所以解决的方法就是让nginx把路由转发的功能交回angularjs的ng-app。n
Angular默认路由策略-PathLocationStrategy策略页面刷新报404错误解决方案
weixinhmz的博客
09-01 241
Angular默认路由策略-PathLocationStrategy策略页面刷新报404错误解决方案
配置Nginx出现No input file specified.
YIP
05-23 2151
决定用Nginx来试试magento，但是配置过程出现如题错误，最终我的解决方案是： 终端输入sudo gedit /etc/nginx/sites-available/default   找到下面代码：     # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000     location ~ /.ph
apache.htaccess文件重写配置
qq_37482307的博客
06-15 580
tp3.2 <IfModule mod_rewrite.c> RewriteEngine On RewriteCond %{REQUEST_FILENAME} !-d RewriteCond %{REQUEST_FILENAME} !-f RewriteRule ^(.*)$ index.php?s=$1 [QSA,PT,L] </IfModule> t...
Angular通过Ngnix发布
hzjanger的博客
03-14 233
编写ngnix配置文件 在项目的根目录下创建default.conf文件 server { listen 80; server_name 192.168.2.131; location / { root /usr/share/nginx/html; index index.html index.htm; try_files $uri $uri/ /in...
Angular8路由守卫详解与实战
"Angular8路由守卫原理和使用方法" 在Angular框架中，路由守卫（Routing Guards）是一种强大的机制，用于在路由导航过程中控制页面的访问权限。它们允许开发者在用户试图进入、离开或者加载一个路由之前执行逻辑...
评论 17
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值