同源策略引发的跨域问题它都能轻松解决!先来认识认识有这么强大功能框架的神奇之处
Nginx 概念
Nginx 是一款高性能的 HTTP 服务器,反向代理服务器及电子邮件(IMAP/POPP3)代理服务器.由俄罗斯的 Igor Sysoev 所开发,Nginx 能够支撑 5 万并发链接,并且 CPU,内存等资源消耗非常低,运行非常稳定
Nginx 应用场景
HTTP 服务器,虚拟主机: Nginx 是一个 HTTP 服务可以独立提供 HTTP 服务,可以做网页静态服务器,可以实现在一台服务器上虚拟出多个网站,例如个人网站使用的虚拟主机
反向代理: 当网站的访问量达到一定程度后,单台服务器不能满足用户请求时,需要用多台服务器集群时可以使用 Nginx 做反向代理
负载均衡: 多台服务器可以平均分担负载,不会因为某台服务器负载高宕机而某台服务器闲置的情况
HTTP 服务器,虚拟主机
使用 Docker 安装运行 Nginx,在./conf 里创建 nginx.conf 文件,配置 docker-compose.yml
虚拟主机: 虚拟主机是一种特殊的软硬件技术.可以将网络上每一台计算机分成多个虚拟主机,每个虚拟主机可以独立对外提供 www 服务,这样就能实现一台主机对外提供多个 web 服务,每个虚拟主机之间是独立的,互不影响的
通过 Nginx 可以实现虚拟主机的配置,Nginx 支持三种类型的虚拟主机的配置:
基于 IP 的虚拟主机
基于域名的虚拟主机
基于端口的虚拟主机
Nginx 配置文件结构: 其中每个 server 就是一个主机
基于域名的虚拟主机配置
需求:
两个域名指向同一台 Nginx 服务器,用户访问不同的域名显示不同的网页内容
两个域名是 admin.service.itoken.oxford.com 和 admin.web.itoken.oxford.com
Nginx 服务器使用虚拟机 192.168.32.255
配置 Windows Hosts 文件:
修改 window 的 hosts 文件(C:/Windows/System32/drivers/etc)-SwitchHosts
通过 host 文件指定 admin.service.itoken.oxford.com 和 admin.web.itoken.oxford.com 对应 192.168.32.255 虚拟机
创建目录及文件: 在 /usr/local/docker/nginx/wwwroot 目录下创建 htmlservice 和 htmlweb 两个目录,并分别创建 index.html 文件
配置虚拟主机: 修改 /usr/local/docker/nginx/conf 目录下的 nginx.conf 配置文件
基于端口的虚拟主机配置
需求:
Nginx 对外提供 80 和 8080 两个端口监听服务
请求 80 端口则请求 html80 目录下的 html
请求 8080 端口则请求 html8080 目录下的 html
创建目录及文件: 在 /usr/local/docker/nginx/wwwroot 目录下创建 html80 和 html8080 两个目录,并分别创建两个 index.html 文件
配置虚拟主机: 修改 /usr/local/docker/nginx/conf 目录下的 nginx.conf 配置文件
Nginx 反向代理
代理服务器
客户端在发送请求时,不会直接发送给目的主机.而是先发给代理服务器,代理服务器接收客户端请求后,再向主机发出,并接收目的主机返回的数据,存放在代理服务器的硬盘中,再发送给客户机
代理服务器作用
提高访问速度: 由于目标主机返回的数据存放在代理服务器的硬盘中,因此下一次客户在访问相同的站点数据时,会直接从代理服务器的硬盘中读取,起到了缓存的作用,尤其对于热门站点能明显提高请求速度
防火墙作用: 由于所有客户机请求都必须通过代理服务器访问远程站点,因此可在代理服务器上设限,过滤掉某些不安全信息
通过代理服务器访问不能访问的目标站点: 互联网上有许多开放的代理服务器,客户机在访问受限时,可通过不受限的代理服务器访问目标站点
正向代理
架设在客户机和目标主机之间,只用于代理内部网络对 Internet 的连接请求,客户机必须指定代理服务器,并将本来要直接发送到 web 服务器上的 http 请求发送到代理服务器中
反向代理
反向代理服务器架设在服务器端,通过缓冲经常被请求的页面来缓解服务器的工作量,将客户机请求转发给内部网络上的目标服务器,并将从服务器上得到的结果返回给 Internet 上请求连接的客户端,此时代理服务器与目标主机一起对外表现为一个服务器
反向代理应用
防止外网对内网服务器的恶性攻击
缓存以减少服务器压力
访问安全控制
进行负载均衡,将用户请求分配给多个服务器
Nginx 反向代理 Tomcat
启动 Tomcat 容器: 启动两个 Tomcat 容器,映射端口为 9090 和 9091,配置 docker-compose.yml
配置 Nginx 反向代理: 修改 /usr/local/docker/nginx/conf 目录下的 nginx.conf 配置文件
Nginx 负载均衡
负载均衡
负载均衡建立在现有网络结构之上,提供了一种廉价有效透明的方法扩展网络设备和服务器的带宽,增加吞吐量,加强网络数据处理能力,提高网络的灵活性和可用性
负载均衡(Load Balance),分摊到多个操作单元上进行执行,例如 Web 服务器,FTP 服务器,企业关键应用服务器和其它关键任务服务器等,从而共同完成工作任务
Nginx 实现负载均衡
需求:
nginx 作为负载均衡服务器,用户请求先到达 nginx,再由 nginx 根据负载均衡配置将请求转发到 tomcat 服务器
nginx 负载均衡服务器:192.168.32.255:80
tomcat 服务器:192.168.32.255:9090
Nginx 配置负载均衡: 修改 /usr/local/docker/nginx/conf 下的 nginx.conf 配置文件
Nginx 解决跨域问题
跨域问题
在浏览器端进行 Ajax 请求时会出现跨域问题
跨域: 浏览器不能执行其它网站的脚本.是由于浏览器的同源策略造成的,是浏览器对 JavaScript 施加的安全限制
同源
同源: 域名,协议,端口均相同
解决跨域问题方式
使用 CORS(跨资源共享)解决跨域问题
CORS 是 W3C 标准,全称"跨资源共享"(Cross-origin resource sharing),允许浏览器向跨源服务器发出 XMLHttpRequest 请求,从而克服了 Ajax 只能同源使用的限制
CORS 需要浏览器和服务器同时支持
目前,所有浏览器都支持该功能,IE 浏览器不能低于 IE10.
整个 CORS 通信过程,都是通过浏览器自动完成,不需要用户参与.对于开发者来说,CORS 通信与同源 Ajax 通信没有差别,代码完全一样.
浏览器一旦发现 Ajax 请求跨源,就会自动添加一些附加的头信息,有时还会多出一次附加 的请求,但用户不会有感觉
实现 CORS 通信的关键是服务器,只要服务器实现了 CORS 接口,就可以跨域通信
在 header 中设置:Access-Control-Allow-Origin(在服务器请求控制器中的 controller 类标注 @CrossOrigin(value="*") 注解)
使用 JSONP 解决跨域问题
JSONP:(JSON with Padding),JSON 的一种"使用模式:,可用于解决主流浏览器的跨域数据访问问题
由于同源策略,一般 server1.example.com 的网页无法与 server2.example.com 的服务器进行访问,而 HTML 的< script>元素是个例外
利用< script>元素这个开放策略,网页可以得到从其它来源动态产生的 JSON 资料,而使用的这种模式就叫 JSONP
用 JSONP 抓到的资料不是 JSON,而是任意的 JavaScript,用 JavaScript 直译器执行而不是用 JSON 解析器解析
需要目标服务器配合一个 callback 函数
CORS 与 JSONP 比较:
CORS 与 JSON 使用的目的相同,但是比 JSONP 更强大
CORS 支持所有类型的 HTTP 请求
JSONP 只支持 GET 请求, JSON 的优势在于支持老式浏览器,以及可以向不支持 CORS 的网站请求数据
Nginx 反向代理解决跨域问题
当服务器无法设置 header 或提供 callback 函数时就可以采用 Nginx 反向代理解决跨域问题
Nginx 配置跨域
在 /usr/local/docker/nginx/conf 中的 nginx.conf 里的 location 中增加配置(Get:字体跨域):
配置 /usr/local/docker/nginx/conf 中的 nginx.conf 配置文件(POST:上传文件):
版权声明: 本文为 InfoQ 作者【攻城狮Chova】的原创文章。
原文链接:【http://xie.infoq.cn/article/518daac0c7681807af02ec58c】。文章转载请联系作者。
评论