主要是router问题,两个解决方案

一个是修改angular项目的router选项,一个是修改Nginx的route 选项

一般情况下项目部署了,不愿意修改angular项目的router选项,所以

修改nginx 的选项:

第一步

查看nginx的配置文件位置

docker exec -it yourContainerId  /bin/sh

# nginx -t
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

第二步

文件cp

docker cp yourContainerId:/etc/nginx/nginx.conf nginx.conf

打开复制到当前路径下的文件:nginx.conf,其他建议就是添加:

location /myangular {
alias /html/myangular;#angular项目所在目录
index index.html index.htm;
try_files $uri $uri/ /index.html =404;#主要是这一行
}

但不一定起作用,主要是这句配置:

include /etc/nginx/conf.d/*.conf;

这就需要重复上述步骤进入exec cp /etc/nginx/conf.d/下的conf文件修改:

还是加上这一行:

try_files $uri $uri/ /index.html;

最后

执行cp命令,复制回去,重新启动container就ok了。

docker cp default.conf yourContainerId:/etc/nginx/conf.d/default.conf

angular项目中的解决办法

在root.module.ts加入:

import {HashLocationStrategy, LocationStrategy} from '@angular/common';
添加provide:
{ provide: LocationStrategy, useClass: HashLocationStrategy, }
这时候在刷新时候会加上#,就不会出现刷新出错的问题了。
建议使用nginx配置方法,有时候项目中可能其他地方配置的url不是这种形式,就出错了。
 

docker nginx angular 刷新错误,404错误的更多相关文章

  1. 解决angular2页面刷新后报404错误

    如果你的angular项目部署到一个tomcat容器里面,localhost:8080是JavaWeb的主页,localhost:8080/driver/login是你angular2项目的登陆地址. ...

  2. Vue实现远程获取路由与页面刷新导致404错误的解决

    一.背景 先简单介绍一下现在项目情况:前后端分离,后端服务是Java写的,前端是Vue+ElementUI. 最近的一个需求是:通过后端Api去获取前端路由表,原因是每个登录角色对应的前端路由表可能是 ...

  3. 前端lvs访问多台nginx代理服务时出现404错误的处理

    前端lvs访问多台nginx代理服务时出现404错误的处理 环境描述:app --> lvs --> nginx --> server app访问页面购买流量页面(nginx服务器) ...

  4. 解决使用angular2路由后,页面刷新后报404错误。

    点击路由链接跳转页面是正常的,但是当刷新页面时就出现了404错误. 解决方法如下: 在app.module.ts中添加import: import {HashLocationStrategy,Loca ...

  5. Vue项目build打包部署到Tomcat后,刷新报404错误解决方案

    问题描述: 一.更新依赖,并打包项目 cd /root/.jenkins/workspace/v-test;npm installcd /root/.jenkins/workspace/v-test; ...

  6. Web环境从Apache转Nginx后页面报404错误

    问题原因: Apache支持伪静态规则在项目的入口目录有个.htaccess文件,Apache默认识别此文件内容, 但是Nginx不识别.htaccess文件,导致伪静态规则失效,从而无法解析url地 ...

  7. vue下history模式刷新后404错误解决

    官方说明文档: https://router.vuejs.org/zh/g... 一. 实测 Linux 系统 Apache 配置: 更改站点配置文件即可,我这里在 Directory 标签后面添加了 ...

  8. Angular刷新浏览器 404 问题

    最近在用angular写一个后台的项目,遇到一个小问题. 进入某个路由页面之后,手动触发浏览器的刷新,然后就404了... 翻看Angular的文档,发现Google早已经给我们想到了这个问题的处理方 ...

  9. 远程服务器返回错误: 404错误、远程服务器返回错误:500错误、 HttpWebResponse远程服务器返回错误:(404、500) 错误。

    现象 我们编码实现请求一个页面时,请求的代码类似如下代码: HttpWebRequest req = (HttpWebRequest)WebRequest.Create(strUrl);req.Use ...

随机推荐

  1. windows下安装hexo和生成博客

    首先在电脑上安装node和git,这个只要在相关官网的下载然后一步安装即可. 然后在你的电脑上新建一个文件夹,用来存放你的博客文件,比如创建hexo 进入该文件,右键打开git bash 安装hexo ...

  2. springboot超级详细的日志配置(基于logback)

    前言   java web 下有好几种日志框架,比如:logback,log4j,log4j2(slj4f 并不是一种日志框架,它相当于定义了规范,实现了这个规范的日志框架就能够用 slj4f 调用) ...

  3. mysql 存储过程、视图---创建、调用、删除

    之前一直用的是Sql Server数据库,最近偶然机会接触到mysql.这里总结了关于mysql 存储过程.视图的“创建.调用.删除”示例 ============================== ...

  4. Android多线程操作,as快捷键笔记

    Android studio 快捷键 cmd+p 快速查看该方法的参数定义 * * option + shift +上下 快速移动上下行 * * cmd + e 显示最近操作的文件 * * cmd + ...

  5. 如何通过Restful API的方式读取SAP Commerce Cloud的Product Reference

    从SAP官网上找到api的说明: https://api.sap.com/api/commerce_services/resource api endpoint: /rest/v2/electroni ...

  6. js sort() 排序用法(转载)

    原文:https://blog.csdn.net/m0_37885651/article/details/80016718 sort() 方法用于对数组的元素进行排序,并返回数组.默认排序顺序是根据字 ...

  7. python中的debug

    python中有很多的debug方法,大部分新人忽略了Python debugger(pdb)的重要性. 1.命令行运行 在终端中输入命令行   python -m pdb helloword.py ...

  8. Oracle 多表插入

    多表插入 作用:一条INSERT语句可以完成向多张表的插入任务(Multitable insert).有两种形式:insert all与insert first,准备测试环境:1.创建表T并初始化测试 ...

  9. 计算机网络原理,TCP&UDP

    UDP伪首部:计算校验和时会用到,然后实际传输过程中里包含的IP地址没有什么用. UDP校验和计算:求数值之和,如果溢出回卷,最后求出反码;UDP伪首部,UDP首部,应用层数据相加 tcp报文,最短2 ...

  10. Python——Int&Bool

    整数类型: int类型,多用于数字运算 print(666) print(6+1) 整数类型转换: v1 = 666 v2 = str(v1) #会得出字符串的666 v1 = True v2 = i ...