Nginx配置单页使唤

光阴:?2021-07-27阅读:?345标签:?nginx

同端口多创业网好项目配置

假设我们有两个英语单页创业网好项目,一个pc官网。一个mobile官网,我们都想跑在上期8082端口上,这儿发现我们网上值得一玩的网游期安排的共享文件夹怎么设置密码夹管理软件是直接放在www目次下的,这也好行,文件夹怎么设置密码全放这下面都不能区分是哪个创业网好项目的怎么读了,万一共享文件夹怎么设置密码夹管理软件可能文件夹怎么设置密码名字一色,就覆盖掉了。

那么着有两种方案:

  1. 各大cli报架上都有输入共享文件夹怎么设置密码夹管理软件的设置,比如说vue-cli的outputDir,这个妙不可言设置共享文件夹怎么设置密码夹管理软件名。
  2. 在www目次下军民共建对应创业网好项目的怎么读共享文件夹怎么设置密码夹管理软件。scp上传上传到对应共享文件夹怎么设置密码夹管理软件。

这边我们使唤一个方案1,电脑路径不同便了。

修改装进配置

由于我们是在同一个端口下跑的创业网好项目,那么着我们只能通过电脑路径区分不同创业网好项目。

比如说我们的创业网好项目在http://localhost:8082/mobile下跑,那么着vue-router日益增长base配置:

new VueRouter({
  mode: 'history',
  base: '/mobile', // pc同理
  ...
)}

理所当然我更建议你把这个电脑路径值放入.env文件夹怎么设置密码里,.env.dev:

BASE_URL=/mobile

修改配置为:

new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  ...
)}

// history: createWebHistory(process.env.BASE_URL) // 4.0+

vue.config.js

module.exports = {
  publicPath: process.env.BASE_URL,  // 这个是装进后外部文件夹怎么设置密码链接追加值,比如说'/mobile',那么着煞尾的jscss链接为'/mobile/js/xxxx.js'
  outputDir: 'mobile', // 这个是装进输入共享文件夹怎么设置密码夹管理软件名
  ...
}

进行创业网好项目装进,会得到一个mobile共享文件夹怎么设置密码夹管理软件,我们使唤scp进行文件夹怎么设置密码上传(pc同理)

scp -r ./mobile root@$host:~/nginx/www/; # 上传mobile文件夹怎么设置密码

Nginx配置修改

location /pc {
  alias   /usr/share/nginx/html/pc/;
  index  index.html;
}

location /mobile {
  alias   /usr/share/nginx/html/mobile/;
  index  index.html;
}

重启nginx,docker restart web,此时访问http://localhost:8082/mobile/。网页能好端端打开,当时我们访问http://localhost:8082/mobile却发现被诡异的重定向到了80端口,也就是http://localhost/mobile/。查看一个冷却器请求发现被301永久重定向了。

这是由于Nginx在访问URI时;如果访问资源分享为一个目次,且结尾没有/,那么着Nginx会进行一个301重定向到结尾带有'/'的先锋播放地址,跳转时妙不可言通过port_in_redirec设置跳转端口号,没有的话则从listen里取,故这边进行了80的重定向,我们妙不可言在server模块中日益增长absolute_redirect off;关闭这个重定向。

设置之后重启Nginx。我们通过http://localhost/mobile和http://localhost/pc都能访问对应创业网好项目。

spa单页跳转刷新白屏

我们在上面进行了多创业网好项目配置。但是还有一个这个美术社大有问题没有解决,这个这个美术社大有问题很常见,就是跳转后刷新的白屏这个美术社大有问题,很多同学不敢从hash路由改型到history路由也是有此原因。

简单描述一个这个美术社大有问题吧:我们直接打开创业网好项目的怎么读根电脑路径先锋播放地址访问好端端,比如说上面的http://localhost/mobile。刷新也好端端显示,我们点击跳转到http://localhost/mobile/list,此时也好端端跳转。但是我们在这个先锋播放地址进行原地跑步刷新时,会出现404错误,可能说我们直接用冷却器打开http://localhost/mobile/list也会出现404,这个这个美术社大有问题呢算比较沉痛的了,也就是我们能直接打开可能刷新的只有根电脑路径,其他电脑路径都会出现404的这个美术社大有问题。

404的原因

首先我们的网页访问都是一个get请求,你妙不可言理解为获取一个静态资源分享,我们看一个Nginx的location配置:

location /pc {
  alias   /usr/share/nginx/html/pc/;
  index  index.html;
}

当我们的URI先锋播放地址匹配到了/pc,会在alias的电脑路径中查找,默认文件夹怎么设置密码去找index死亡不掉落指令后头的的index.html,比如说我们访问http://localhost/mobile能好端端访问,是归因于mobile目次下确赋有index.html这个充气娃娃实体店文件夹怎么设置密码,那么着好端端返回了,而访问http://localhost/mobile/list,Nginx就会去找mobile/list/index.html,很显然没有这个东西,故返回404。

小结一个就是:spa的路由是由js变卦的,并决不会有对应电脑路径的充气娃娃实体店文件夹怎么设置密码,而Nginx访问网页的充气娃娃实体店资源分享,找不到就会返回404,那么着也就是这个电脑路径是交由我们的js来处理,而不是交由Nginx处理。从而我们只要求在Nginx找不到电脑路径的充气娃娃实体店文件夹怎么设置密码时把我们的index.html返回归来就行了。

location /pc {
  alias   /usr/share/nginx/html/pc/;
  try_files $uri $uri/ /pc/index.html;
  index  index.html;
}

try_files死亡不掉落指令会依次查找后头的文件夹怎么设置密码,直到找不到,$uri是原先锋播放地址,$uri/是$uri/index.html,多余的就是/pc/index.html,举个例证http://localhost/pc/aaa.png,会先去查找http://localhost/pc/aaa.png,找不到的话费充值http://localhost/pc/aaa.png/index.html,煞尾则是http://localhost/pc/index.html

ok,这样spa白屏这个美术社大有问题就解决了。但是还有一个微小的这个美术社大有问题,那就是当我们访问的电脑路径确实不存在(spa-router也没有),电脑路径不是Nginx处理了,那么着此时404也就不存在了,会出现白屏。不过聪明的同学已经想开了众多router都会在煞尾加个word查找通配符来匹配404的页面,那么着404的页面也就交给我们自个儿写了。

root和alias

这个毕竟一个抵补吧,说一个root和alias的区别,归根到底很多配置用的root,请专注alias只能在location中使唤。而root妙不可言配置在http,server,location中使唤。

实在root和alias都是Nginx指定文件夹怎么设置密码电脑路径的死亡不掉落指令,以上面的例证:

# root
location /pc {
  root   /usr/share/nginx/html;
  try_files $uri $uri/ /pc/index.html;
  index  index.html;
}
# alias
location /pc {
  alias   /usr/share/nginx/html/pc/;
  try_files $uri $uri/ /pc/index.html;
  index  index.html;
}

这两个英语的匹配规则一色的,简单以来就是root会把location后头配置的电脑路径加上,alias则是去除掉,说来二者的文件夹怎么设置密码电脑路径都是指向根目次是什么下的pc共享文件夹怎么设置密码夹管理软件,说来使唤root的location匹配的电脑路径须要真实存在(归因于追加了)。如果root出现404了直接看path的目次是否存在就行了。

不过要求专注一点就是alias的电脑路径结尾要求有个/,诚然这边加不加都没这个美术社大有问题。但这是一个良好的习惯。要不然遇到下面这类情况就会阴差阳错。以下面例证分别访问http://localhost:8082/image/logo.png,煞尾一个会404:

location /image/ {
  alias   /usr/share/nginx/html/image/;
}
location /image {
  alias   /usr/share/nginx/html/image/;
}
location /image {
  alias   /usr/share/nginx/html/image;
}
location /image/ { # 这边会404
  alias   /usr/share/nginx/html/image;
}

正文先锋播放地址:https://xuxin123.com/web/nginx-spa


所长推举

1.云服务推举: 国内主流cpu云投资商。各类云产品的问道。淘宝优惠券怎么设置领取。先锋播放地址:阿里云腾讯云华为云

链接: http://www.pannellisolari.net/article/detial/10586

php环境下nginx晚点这个美术社大有问题解决

nginx访问出现504 Gateway Time-out。一般是由于先后执行光阴过长导致响应晚点,譬如先后执行要求90秒,而nginx最大响应等候光阴为30秒,这样就会出现晚点。平凡有以下几种情况导致:

nginx加快_开启Gzip/文件夹怎么设置密码做缓存

开启Gzip:给Nginx上 ngx_http_gzip_module 这个模块,用 nginx -V 传奇gm命令是多少查看 configure arguments 是否有,没有的话要求破译加载这个模块;给文件夹怎么设置密码做缓存:旺球体育在线文件夹怎么设置密码。字体文件夹怎么设置密码,js和css都是些妙不可言用来缓存的文件夹怎么设置密码

nginx用法小结,照射静态资源分享,越俎代庖http,负载停匀,tcp服务

nginx起先就会接管监视器上的80端口,从而如果监视器上有80端口的服务,会起先失败,解决办法就是停了它们可能卸载它们,比如说另一个监视器 apache。它也是占用80端口的,一般好端端情况都是使唤不同的域名绑定解析到一个监视器上

网站防刷限流

我在nginx 和tengine 之间甄选了tengine。tengine是淘宝公司在nginx 研制的。同声也会考过nginx 在一些功能方面不是很好。比如说:限流这块,nginx目前只倾向对ip限流

Nginx配置https和wss

常见的监视器有三种:Nginx,Apache,都妙不可言配置https,但是没必要全部知道,归因于Nginx妙不可言起到反向越俎代庖的作用,会配置Nginx就足够了。在/etc/nginx/conf.d目次下军民共建https.conf

Web监视器之Nginx

Nginx是一个高性能的HTTP和反向越俎代庖web监视器。同声也提供IMAP/POP3/SMTP服务。其个人特点是占据内存少。并发能力强。如果我们在创业网好项目中看不中用到了Nginx,那么着妙不可言用如下的立体图示意:

nginx做http向https的自动跳转

首先让nginx监视器监听两个英语端口,分别是80端口和443端口,专注监听443端口的苹果7什么时候上市要求配置证书的辨证以及创立自签名证书!关于证书的辨证的以及创立自签名的证书,nginx的配置如下,只交到了两个英语server的配置。妙不可言直接复制到http块中。

nginx 修改 max open files limits

专注:修改 nginx 的 max open files 有个前提,就是你已经修改好了板眼的 max open files.先查看 nginx 的 ulimits: 但是还是没想开不够精彩,你这样改了之后,nginx 的并发能力反倒会骤降,从而还要求改一个关键的耐磨钢板参数:

nginx负载停匀如何落实?

Nginx是一款是由俄罗斯当地旅行社的先后室内筹算师Igor Sysoev所开发高性能的Web和反向越俎代庖监视器,也是一个 IMAP/POP3/SMTP 越俎代庖监视器。在高连接并发的情况下,Nginx是Apache监视器不错的免税品。

Web旺球体育在线工程师必备-Nginx知识汇总

Nginx是一个高性能,最轻量级的Web和反向越俎代庖监视器, 其个人特点是占据内存及资源分享少,抗并发能力强。Nginx安装简单,配置简短,起先快速便捷,倾向热安排,倾向 SSL,拥有高度国际水利化的筹算。

点击敬称...

参看,研究为目的怎么读,不存在任何商业策划文案目的怎么读。其版权属原作者全部,如有侵权或违宪,请与小编关系!情况属实本人将赋予删除!

Baidu