现象:

在浏览器中直接访问www.test.com/api1/login会404。但如果你先访问www.test.com后再点“登录" 跳转到www.test.com/api1/login是正常显示。f5刷新又会出现 404了

这是web单页面开发模式造成的。现在主流的前端框架基本都是单页面的。如:react、vue等。

单页面简单来说就是访问所有资源路径、其实页面内容只有一个(一般是index.html)。这个页面中引入的js框架会根据当前访问的url去路由到相应的子页面组件(可以理解为页面片段)进行逻辑处理和页面渲染。

所以当你访问www.test.com/api1/login 其实web站中并没login这个页面资源。所以就报404啦!

解决:

location /demo/ {
rewrite .* /index.html break;
root /data/build;
}

参考:http://www.fly63.com/article/detial/821

nginx配置vue项目部署访问无问题,刷新出现404问题的更多相关文章

  1. 阿里云安装Nginx+vue项目部署

    阿里云安装Nginx+vue项目部署 nginx安装包下载 http://nginx.org/en/download.html nginx安装 首先先安装PCRE pcre-devel 和Zlib,因 ...

  2. Vue项目部署问题及解决方案

    Vue项目部署问题及解决方案 Vue-Router 有两种模式,默认是 hash 模式,另外一种是 history 模式. hash:也就是地址栏里的 # 符号.比如 http://www.examp ...

  3. nginx代理vue项目

    很多项目的前端都使用vue编写的,在项目上线部署的时候,有些项目要求把前端页面和后台服务部署在不同的服务器,这就要求使用nginx代理,本文就来讲讲vue项目怎么使用nginx代理. 项目github ...

  4. django项目、vue项目部署云服务器

    目录 上线架构图 服务器购买与远程连接 安装git 安装mysql 安装redis(源码安装) 安装python3.8(源码安装) 安装uwsgi 安装虚拟环境 安装nginx(源码安装) vue项目 ...

  5. node vue 项目部署问题汇总

    场景:vue-router为history模式,不带项目名访问的部署,如果资源是用相对路径加载,则资源匹配路径不对 一.带项目名称访问,如部署到tomcat服务上 webpack:  build/ut ...

  6. vue 项目部署

    vue项目部署到PHP项目 入口目录 vue项目打包后, 是一个单文件html 我们只需要把打包后的文件夹放在php项目的public下面 访问 xxx.com/h5/index.html 就可以访问 ...

  7. Apache Tomcat下载、安装、环境变量配置以及项目部署

    前言 针对在本地访问文件或资源出现的跨域问题,可以通过搭建本地服务器来解决,本篇随笔主要介绍通过搭建Apache Tomcat服务器来解决跨域.包括Apache Tomcat的下载.安装.环境变量的配 ...

  8. Windows下Nginx配置SSL实现Https访问(包含证书生成)

    Vincent.李   Windows下Nginx配置SSL实现Https访问(包含证书生成) Windows下Nginx配置SSL实现Https访问(包含证书生成) 首先要说明为什么要实现https ...

  9. linux nginx配置新项目加域名(设置绑定域名)

    转自:linux nginx配置新项目加域名 找到nginx的配置文件 nginx/nginx.conf 第一种方,法直接在nginx.com里面配置 user www www; worker_pro ...

随机推荐

  1. 本地Windows环境Dubbo搭建测试

    Dubbo介绍 Dubbo[]是一个分布式服务框架,致力于提供高性能和透明化的RPC远程服务调用方案,以及SOA服务治理方案. 其核心部分包含: 远程通讯: 提供对多种基于长连接的NIO框架抽象封装, ...

  2. Linux- 常用命令, Vim编辑器操作

    1.Linux命令: ls >查看列表(蓝色为文件夹,白色为文件) ls -a >显示包括隐藏文件的所有文件 ls -l >以列表的形式显示 ls -lh >类似于ls -l ...

  3. saiku环境搭建

    说明:搭建saiku环境,BI展示工具. 环境说明: os:windows7 jdk:jdk1.6.0_43 tomcat:apache-tomcat-7.0.62 saiku:saiku-ui-2. ...

  4. 爬虫技术实现空间相册采集器V.0.0.1版本

    一.    功能需求分析: 在很多时候我们需要做这样一个事情:我们想把我们QQ空间上的相册高清图像下载下来,怎么做?到网上找软件?答案是否定的,理由之一:网上很多软件不知有没有病毒,第二它有可能捆了很 ...

  5. Ranger-Kafka插件安装

    Ranger-Kafka插件安装, 使用Ranger0.7.0版本,集成Kafka插件到Kafka集群, Kafka Plugin需要安装到所有的Kafka的集群节点上面. 1.登陆Kafka的安装用 ...

  6. python接口自动化-json数据处理

    前言 有些post的请求参数是json格式的,需要导入json模块进行处理,json是一种数据交换格式,独立于编程语言 一般常见的接口返回数据也是json格式的,我们在做判断的时候,往往只需要提取其中 ...

  7. 解决consul覆盖注册

    默认注册consul的服务id为服务名-端口号,相同的服务名和端口号注册会覆盖 解决方式: 1.自定义Consul注册Id import com.ecwid.consul.v1.ConsulClien ...

  8. Codeforces #550 (Div3) - G.Two Merged Sequences(dp / 贪心)

    Problem  Codeforces #550 (Div3) - G.Two Merged Sequences Time Limit: 2000 mSec Problem Description T ...

  9. windows系统中给qt工程添加第三方库

    · TEMPLATE = app CONFIG += console c++11 CONFIG -= app_bundle CONFIG -= qt SOURCES += main.cpp LIBS ...

  10. 让自己的开源项目支持CocoaPods

    测试的时候找个自己封装的方法或UI控件就可以了 这里用我刚封装的Redirect重定向的请求体为例 1, 在github上创建一个Redirect,重要:记得选择开源协议 (MIT)(如果木有GitH ...