前言
前一阵子用nginx分担了我网站由tomcat处理的的http服务,本文就跟大家分享下我的实战过程,以及如何从0开始用nginx来访问你的前端项目,欢迎各位感兴趣的开发者阅读本文。
写在前面
我开源项目[1]的第三方登录模块用到了localStorage
来获取用户的授权结果,前几天有个网友反馈说他从我文章的链接中点进去没法登录。
image-20211221220517500
经过一番排查后,我发现我在文章中留的链接是https://kaisir.cn/chat-system[2],而第三方鉴权回调设置的链接是https://www.kaisir.cn/chat-system[3]。由于我域名解析那里配置了@
访问与www
访问指向的都是同一个网站,因此两者访问界面相同。但是回调地址中有www,请求授权的访问界面没有www,出现了跨域问题。
跨域后,localStorage里的东西自然是不一样的,因此就出现了这个网友所说的问题。
解决办法
既然两者访问的都是同一个服务器上的资源,那么我们就可以在服务端配置重定向,当请求的地址没有携带www时,我们就给他重定向到带www的地址。
于是我搜了一波使用tomcat配置未携带www的网站自动添加www,看了一眼方案,比较麻烦,不想折腾。
image-20211222221549955
使用nginx解决这个问题
经过一番搜索后,我发现使用nginx解决这个问题比较简单,于是我花了一点时间学了下nginx,完美解决了这个问题。
注意:本文不介绍如何安装nginx,对此不了解的开发者,请移步nginx官网[4]进行学习。
移除tomcat的配置
首先我们先把tomact已配置好的一些http服务移除掉,此处要删除的有:http访问跳转https、域名证书、静态资源。
注意:如果你没有使用tomcat可以跳过此章节, 直接学习nginx的相关配置。
关闭https访问,删除域名证书
我们打开tomcat的conf目录下的server.xml
,找到Service标签里port为80
的Connector
标签,删除标签内的redirectPort
属性,如下图所示。
image-20211222231319505
注意:你还需要修改port的值,将其改为任意一个非
80
的值,因为nginx需要使用80端口号。
随后,继续找port为443的Connector
标签,将其删除,如下图所示。
image-20211222232006046
最后,删除你目录下后缀为jks的域名文件即可。
image-20211222232406645
删除静态资源
打开tomcat的webapps
目录将你的静态资源(前端项目)删掉即可。
image-20211223221326973
关闭http强跳https
我们打开tomcat的conf目录下的web.xml
文件,找到login-config
标签和security-constraint
的内容,将其删除,如下所示:
<!--开启http强制跳转https访问--> <login-config> <!-- Authorization setting for SSL --> <auth-method>CLIENT-CERT</auth-method> <realm-name>Client Cert Users-only Area</realm-name> </login-config> <security-constraint> <!-- Authorization setting for SSL --> <web-resource-collection> <web-resource-name>SSL</web-resource-name> <url-pattern>/*</url-pattern> </web-resource-collection> <user-data-constraint> <transport-guarantee>CONFIDENTIAL</transport-guarantee> </user-data-constraint> </security-constraint>
配置nginx
接下来,我们来配置nginx,让它来全面接管客户端的http请求,反向代理tomcat提供的服务,成功与tomcat完成配合。
配置虚拟主机
首先,我们需要先把虚拟主机配置好,它的作用就是模块化管理你的所有服务器资源,避免全部都一股脑的写入nginx的主配置文件,从而导致的可维护性降低问题。
我们打开nginx的conf目录,在其目录下找到virtualhost.conf
的文件(如果没有则需要手动创建),该文件的作用就是将所有的服务器配置引入进来进行统一管理,打开文件后,我们写入如下所示的内容:
# VirtualHost Configuration. # 默认存在的,如果不存在可以不理 include vhosts/localhost.vhost; # 我们新加的 include vhosts/kaisir.cn;
在上面的配置文件中,我们新加了一个kaisir.cn
的配置,我们需要在vhosts
目录下创建这个文件,这个目录也是在conf
目录中的(如果没有就自己创建),我们直接创建这个文件即可。
image-20211223224250842
注意:创建的文件不能包含后缀名,如果你有多个应用则在此处创建,然后在
virtualhost.conf
文件中使用include
指令进行引入即可。
随后,我们打开conf目录下的nginx.conf
文件,把刚才创建的virtualhost.conf
文件引入进去,我们找到http标签,在标签内部添加如下所示的内容:
# ...其他内容省略... http { # 引入服务配置文件 include virtualhost.conf; }
做完上述操作后,我们就可以愉快的编辑我们在
vhosts
目录下创建的文件了。
服务器配置文件
在上述配置中,我们在vhosts
目录下创建的文件就是我们的服务器配置文件了,http访问的相关配置都是在此文件中进行写入。