ThinkJS前端搭配vue时的Nginx配置
Thinkjs 作为奇舞团开源的nodejs mvc框架之一,引起了很多NodeJS程序员的亲赖。但是其关于静态文件处理部分支持不够完善,主要是体现在SPA单页应用,之前在ThinkJS 2.*版本时写过一个关于处理单页应用静态资源的middleware think-resource-spa,但是这个只是建议在开发调试环境中使用,并不是解决方案。
一般作为线上服务,都会使用Nginx作为静态服务资源代理,然后ThinkJS官网的nginx默认配置只是普通代理,所以在官方群里就经常有人闻到,前端用ng2或vue怎么配nginx等问题。
所以这里我将对修改后的配置文件分享给大家。
server {
listen ;
server_name **.com www.***.com;
root /your/server/path/of/www;
set $node_port ;
location / {
proxy_http_version 1.1;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header X-NginX-Proxy true;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_pass http://127.0.0.1:$node_port$request_uri;
proxy_redirect off;
}
#静态文件
location ~ /static/ {
etag on;
expires max;
}
#spa app 主目录
location ~ /oneapp {
try_files $uri $uri/ /oneapp/index.html;
}
}
1. 将所有请求代理到ThinkJS服务
2. 优先处理static请求
3. 更优先处理oneapp请求
我这里前端是使用vue2,这里前端需要配合修改的地方是:vue 配置base href 为“/oneapp”, 然后打包输出到www目录下即可
ThinkJS前端搭配vue时的Nginx配置的更多相关文章
- 前端vue开发中的跨域问题解决,以及nginx上线部署。(vue devServer与nginx)
前言 最近做的一个项目中使用了vue+springboot的前后端分离模式 在前端开发的的时候,使用vue cli3的devServer来解决跨域问题 上线部署则是用的nginx反向代理至后台服务所开 ...
- 前端搭建Linux云服务器,Nginx配置详解及部署自己项目到服务器上
目录 搭建Linux云服务器 购买与基本配置 链接linux服务器 目录结构 基本命令 软件安装 Linux 系统启动 启动过程 运行级别 Nginx详解 1.安装 方式一:yum安装 方式二:自定义 ...
- 前端lvs访问多台nginx代理服务时出现404错误的处理
前端lvs访问多台nginx代理服务时出现404错误的处理 环境描述:app --> lvs --> nginx --> server app访问页面购买流量页面(nginx服务器) ...
- Vue 应用 nginx 配置 前后端不分离模式
一.先在官网下载nginx 软件,解压后放在软件盘中如D盘 将nginx 文件夹拖到编译器中,打开conf 文件夹中的 nginx.conf 文件,找到其中的server {} 配置项,默认35 行. ...
- VUE项目二级菜单刷新时404 nginx
原因:vue项目的路径时虚拟路径,并不存在,所以用nginx去请求请求不到,所以vue项目做了两部调整: 1.所有的请求后端接口地址前端写死 2.nginx里把所有的接口转发后端删掉,并添加以下内容 ...
- nginx配置 的话注意几点 1.错误时注意看log 2.天威证书的话,有文档按照其文档一步步配置即可;3每句话的结尾注意千万别丢掉分号
nginx配置 的话注意几点 1.错误时注意看log 2.天威证书的话,有文档按照其文档一步步配置即可:3每句话的结尾注意千万别丢掉分号:4.配置https时 其转发可以转发到http上 pass_ ...
- 前端部署: nginx配置
前提:nginx 已安装 简介:nginx(engine x) 是一个高性能的HTTP和反向代理服务,也是一个IMAP/POP3/SMTP服务.Nginx是由伊戈尔·赛索耶夫为俄罗斯访问量第二的Ram ...
- 前后端分离 vue的nginx配置
nginx配置vue 有全静态化 与 vue自己的应用端口 两种方式 以下是nginx跳转到vue自己的端口 https://www.jianshu.com/p/b7bd0d352db7 以下是全静 ...
- eggjs+vue+nginx配置
安装node https://github.com/nodesource/distributions#installation-instructions-1 注意使用No root privilege ...
随机推荐
- vulnhub~incllusiveness
这个机子相对简单一点,但是也是从中发现了自己不少问题 技能一: nmap 扫描发现了21,22 ,80三个端口,并且ftp服务允许匿名登录,在pub目录下面有writeable权限,这就好办了.我以 ...
- 【数据库测试工具】认识Sysbench
本文基于课堂PPT笔记整理,主要介绍一下Sysbench及其简单使用,实验代码部分在代码中有重点注释,不另作说明. 一,基准测试 什么是数据库的基准测试? 数据库的基准测试是对数据库的性能指标进行定量 ...
- .net core 实现excel 和 word 的在线预览
最新在搞文件的在线预览,网上很多免费的方案都需要是电脑安装office的,这要就很麻烦:收费的插件又太贵了. 不过还是找到一款相对好用的免费在线预览插件. 直接在nuget上搜索ce.office.e ...
- 2017蓝桥杯九宫幻方(C++B组)
题目:九宫幻方 小明最近在教邻居家的小朋友小学奥数,而最近正好讲述到了三阶幻方这个部分,三阶幻方指的是将1~9不重复的填入一个3*3的矩阵当中,使得每一行.每一列和每一条对角线的和都是相同的. ...
- Dubbo 路由机制的实现
Dubbo 路由机制是在服务间的调用时,通过将服务提供者按照设定的路由规则来决定调用哪一个具体的服务. 路由服务结构 Dubbo 实现路由都是通过实现 RouterFactory 接口.当前版本 du ...
- 30.4 Map HashMap
本文将会讲解到: Map和Collection的对比 Map接口的使用,实现类HashMap的使用 /* * 需求:实现学号和姓名这样有对应关系的数据存储 * 为了体现这种有对应关系的数据,我们使用以 ...
- Hadoop(一) centos7 jdk安装,hadoop安装|3
安装JDK 下载jdk https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 选择最 ...
- 登陆ECP后,无法正常现实OU
当我们在ECP创建邮箱账户或者会议室的时候,发现无法预览所有OU信息 这是因为,默认情况下,Exchange只能识别到500个OU,如果要解决这个问题就需要我们到后端服务器修改配置文件 文件路径:C: ...
- 并查集---体会以及模板&&How Many Tables - HDU 1213
定义&&概念: 啥是并查集,就是将所有有相关性的元素放在一个集合里面,整体形成一个树型结构,它支持合并操作,但却不支持删除操作 实现步骤:(1)初始化,将所有节点的父亲节点都设置为自己 ...
- 怎么高效学习python?其实只需要这个方法,快速掌握不叫事儿
很多人想学python,并且希望能快速高效的学习python,但一直都没有找到合适的方法,下面谈一下我的方法. 首先,高效入门python 怎么高效学习python?想要高效,就要先搞清楚你这个阶段, ...