谈谈渲染,玩玩nginx——前后端分离,转发请求到Tomcat的尝试

一、谈谈“渲染”

相信好多人都挺听过“渲染”这个词,但不清楚它是什么意思?前端开发以为这是后端的活儿,后端开发以为是前端的事儿,推着推着就不了了之。其实渲染很简单,不说概念,直接举例:

1、 后端渲染:以JSP为例,可以分成三步

a、编写标签或Java代码(可以称之为模板)

b、在JSP编译阶段被转换成Servlet编译为Servlet Class

c、执行编译后的代码,将响应(模板执行结果)返回给页面

优势:减少前端工作,前端只需要设计纯页面,其他的都由后端来做;

缺点:依赖于服务器端,增大服务器压力,前后端职责分工不明确;

应用场景:在页面不太多、渲染压力不大、服务器端能够承受范围内可以使用后端渲染。

2、 前端渲染:以基于JS的模板引擎为例

a、编写模板代码

b、通过模板引擎将模板转化为脚本语言,拼接在JS中(第一次拼接,以后使用缓存)

c、页面加载执行JS

优势:减少服务器压力,前后端职责可以很好地分开,后端只做Json数据接口,前端进行渲染;

缺点:前端渲染依赖于客户端,增大的前端压力,需要代理服务器、末班渲染引擎的支持;

应用场景:在前端页面较多,前端开发人员能力较强,需要前后端分离的场景可以使用前端渲染(前端渲染是趋势)。

二、谈谈nginx

1、谈谈为什么会用到nginx?

首先明确一件事,浏览器可以发出请求吗?可以!那我们为什么要用到服务器呢?因为我们的前端如果不依赖服务器,页面就只能访问本地资源而不能访问服务器上的资源,而我们的后台一定是写在服务器上的。所以举个例子,我们在使用Tomcat服务器时,就必须把前端资源架在Tomcat上,才能访问后台的servlet。如下图所示:

所以当我们希望前后端分离时,前端的资源就不能放在Tomcat上面,那如何获得Tomcat的资源的?这就用到了nginx,如下图所示:

2、谈谈nginx的反向代理

有反向代理必有正向代理,先谈谈正向代理:一般默认的代理都是正向代理,用户访问不了一个资源,然后通过代理服务器去访问这个资源,将响应带回给用户。关键在于用户知道自己访问的是其他服务器的资源,代理服务器不会掩饰URL

反向代理是,代理服务器也是在中间层,但是用户不知道自己访问的资源是其他服务器的资源,代理服务器会掩饰URL

3、谈谈如何使用nginx反向代理tomcat

(1)首先打开nginx,两种方式,一种是直接点击ngnix.exe,一种是使用命令行,cd到nginx目录下,start nginx,无报错即启动成功

(2)启动成功后,如何验证,因为ngnix.conf核心配置文件默认配置监听80端口,所以浏览器打开localhost,看到如下显示:

(3)下一步就是配置反向代理Tomcat,打开conf目录下的nginx.conf文件,主要看35行左右开始的代码,下面是我修改过的代码:

主要修改lacation属性,使所有的请求都被转发到http://localhost:8080的Tomcat服务器下处理:

listen:是监听的端口,即用户访问nginx服务的端口

server_name:服务名,经过测试并不会影响到什么

location:定义资源类型与服务器中资源地址url的映射关系,可在/后面定义资源类型,可设置多个location

其中proxy_pass代表要反向代理的服务器资源url,只要资源类型匹配,在这个url下的子路径资源都可以访问到,

其中root代表本地的资源路径,同样只要资源类型匹配,这个路径下的子目录资源都可以被访问到,

一个location中只能配置一个root或proxy_pass。

(4)修改后ngnix.conf文件后,使用nginx -s reload指令,重启ngnix,如果没有报错即重启成功

(5)发出请求,获得Json,url显示依然是80端口的资源,即我们说的反向代理的特点,掩饰url,效果如下图所示:

事实上,nginx是将请求转发到Tomcat服务器,是8080端口下的资源,如下图所示:

(6)如果不光有Tomcat服务器的资源,那么就需要定义多个location,比如,jsp资源请求就转发到Tomcat服务器下,PHP、html、js、css等资源资源可以转到Apache服务器目录下,如下图配置示例:

[html] view
plain
 copy

  1. location ~ \.jsp$ {
  2. proxy_pass http://localhost:8080;
  3. }
  4. location ~ \.(html|js|css|png|gif)$ {
  5. root D:/software/developerTools/server/apache-tomcat-7.0.8/webapps/ROOT;
  6. }

ngnix的功能远不止于此,它的高效也同样被称道,有兴趣可以更深入了解!

时间: 2024-08-14 20:18:30

谈谈渲染,玩玩nginx——前后端分离,转发请求到Tomcat的尝试的相关文章

前后端分离ajax请求跨域问题

解决方案一(服务器端): 1.java语言 如果您使用的mvc框架是spring4.2以上的话,一个@CrossOrigin就可以搞定.将@CrossOrigin加到Controller上,那么这个Controller所有的请求都是支持跨域的,代码如下: @Controller @CrossOrigin public class GreetingController {} 将@CrossOrigin加到请求方法上,那么这个请求是支持跨域的,代码如下 @CrossOrigin @RequestMa

我们为什么要尝试前后端分离

这不是一篇纯技术文章,而是一篇分享我个人在前后端分离路上收获的点点滴滴的文章,以此来为准备尝试前后端分离或者想了解前后端分离的童鞋做一个大体的讲解. 尝试与改变 如果你没有尝试过前后端分离的工作流程,那么可以先试想一下这样的流程改变: 把流程从 PM:“我要这个功能”后端:“这个先找前端做个模板”前端:“模板做完了”后端:“我来对接一下,这里样式不对”前端:“我改完了”后端:“功能交付”PM:“春节要加这个活动”后端:“这个先找前端改个模板”前端:“模板做完了”后端:“我来对接一下,这里样式不对

SpringBoot电商项目实战 — 前后端分离后的优雅部署及Nginx部署实现

在如今的SpringBoot微服务项目中,前后端分离已成为业界标准使用方式,通过使用nginx等代理方式有效的进行解耦,并且前后端分离会为以后的大型分布式架构.弹性计算架构.微服务架构.多端化服务(多个客户展现端,例如:web端,安卓app,IOSapp,微信小程序等)打下坚实的基础.这个步骤是系统架构从猿进化成人的必经之路. image 上图是简单的分布式微服务开发及前后端分离的示意图.展现层也就是所谓的前端(客户可直观看到的),比如电商项目前端包含:app(安卓和IOS).微信小程序.PC商

通过nginx部署前端代码实现前后端分离

实现前后端分离,可以让前后端独立开发.独立部署.独立单测,双方通过JSON进行数据交互. 对于前端开发人员来说,不用每次调试都需要启动或配置Java/Tomcat运行环境:对于后端开发人员来说 ,也不用在需要往JSP页面注入数据. 通过nginx来部署前端代码,可以帮助前端实现以下基本需求: 1.请求转发,解决请求跨域的问题 server { listen       7777; location /{ root   /Users/xiaoyun/git/someproject/dist; }

nginx反向代理前后端分离项目(后端多台)

目前软件架构都比较流行前后端分离,前后端的分离也实现了前后端架构的分离,带来的好处 —— 整个项目的开发权重往前移,实现真正的前后端解耦,动态资源和静态资源分离,提高了性能和扩展性. 通常SpringBoot与vue 进行前后端分离,主要有两种方式: 1.打包(npm run build命令)vue项目出来的dist文件夹拷贝到springboot项目的static文件目录,部署到tomcat即可. 2.利用nginx的反向代理. 本文主要讲解第二种 首先打包前端项目到指定目录:E:\fjgh\

前后端分离后的前端时代

本文从前端开发的视角,聊一聊前后端分离之后的前端开发的那些事儿.阅读全文,大约需要8分钟. 什么是前后端分离 除了前端之外都属于后端了. 你负责貌美如花,我负责赚钱养家 在传统的像ASP,JSP和PHP等开发模式中,前端是处在一个混沌的状态中,可以说是没有独立的"人格"可言. 前端负责切图和编写静态页面模板,后端将数据渲染到前端提供的页面模板中,最后将页面渲染到浏览器展示. 这个过程中,前端只提供页面模板或者写一些JavaScript脚本,有的甚至JS脚本都是后端来写,前端的作用只局限

前后端分离实践(一)

前言 最近这一段时间由于Nodejs的逐渐成熟和日趋稳定,越来越多的公司中的前端团队开始尝试使用Nodejs来练一下手,尝一尝鲜. 一般的做法都是将原本属于后端的一部分相对于业务不是很重要的功能迁移到Nodejs上面来,也有一些公司将NodeJS作为前后端分离的一个解决方案去施行.而像淘宝网这类的大型网站也很早的完成了前后端的分离,给我们这样的后来者提供了宝贵的经验. 同样,我们的大网盘团队也早在去年早早就开始了紧锣密布的准备工作,这目前工作也做的差不多了,现在我就来总结一下在过程中遇到的坑点以

前后端分离模式

我是做java出身的前端开发工程师经历过由前端视图逻辑和后端的业务逻辑混合的开发模式, 在到由ajax跨域请求来进行前后端的分离的模式,最后到由nodejs来进行前后端的分离, 今天就分别站在不同的视角上尽可能的为大家剖析下这几种模式的优缺点. 前后端逻辑混合开发模式: 这种开发模式在现在来看几乎没有什么优点,但是在很多互联网公司依然在用,我想这大概是历史原因造成的吧, 也有可能缺乏技术体系的整体思想,但是也不能完全否定其优点,与第二种开发模式相比较. 优点: 1. 用户体验好,在相同的网络条件

前后端分离的思考与实践(六)

原文出处: 淘宝UED - 筱谷 Nginx + Node.js + Java 的软件栈部署实践 起 关于前后端分享的思考,我们已经有五篇文章阐述思路与设计.本文介绍淘宝网收藏夹将 Node.js 引入传统技术栈的具体实践. 淘宝网线上应用的传统软件栈结构为 Nginx + Velocity + Java,即: 在这个体系中,Nginx 将请求转发给 Java 应用,后者处理完事务,再将数据用 Velocity 模板渲染成最终的页面. 引入 Node.js 之后,我们势必要面临以下几个问题: 技