主要是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. python取字母以及数字随机数

    一.这里用到了:String模块ascii_letters和digits ''.join(random.sample(string.ascii_letters + string.digits, 9)) ...

  2. vscode编辑器自定义配置

    { //删除文件确认 "explorer.confirmDelete": false, // 主题 "workbench.iconTheme": "v ...

  3. vue入门模板——只需一个html

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. Django异常 - ImportError: No module named django.core.management

    Django错误 - ImportError: No module named django.core.management问题描述:在命令行输入 manage.py runserver,提示找不到d ...

  5. python之变量的数据类型(1)int 、bool 、str 及for循环运用

    一.变量的数据类型(1) 1.int 类型 int类型是整数,常用的有bit_length() 方法 用来返回一个数的二进制长度 2.bool类型 布尔型只有两个值 True,False 有关类型转换 ...

  6. Java--8--新特性--新的日期API

    LocalDate.LocalTime.LocalDateTime 类的实 例是不可变的对象,分别表示使用 ISO-8601日 历系统的日期.时间.日期和时间. Instant 时间戳, 用于“时间戳 ...

  7. HTML&CSS基础-常用选择器

    HTML&CSS基础-常用选择器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.html源代码 <!DOCTYPE html> <html> & ...

  8. python 全局声明 global

    https://www.cnblogs.com/Lin-Yi/p/7305364.html 在基本的python语法当中,一个函数可以随意读取全局数据,但是要修改全局数据的时候有两种方法:1 glob ...

  9. [转]Python测试框架对比----unittest, pytest, nose, robot framework对比

      测试框架 什么是框架? 框架(Framework)是整个或部分系统的可重用设计,框架是用来解决代码的组织及运行控制问题的. 在我们编写自动化脚本的时候,经常需要读取配置文件,读取数据文件,发送请求 ...

  10. 大规模异常滥用检测:基于局部敏感哈希算法——来自Uber Engineering的实践

    uber全球用户每天会产生500万条行程,保证数据的准确性至关重要.如果所有的数据都得到有效利用,t通过元数据和聚合的数据可以快速检测平台上的滥用行为,如垃圾邮件.虚假账户和付款欺诈等.放大正确的数据 ...