前后端分离构架特点

就是把数据和页面分离开，后端不提供页面，只是纯粹的通过 Web API 来提供数据和业务交互能力，Web 前端就是纯粹的客户端角色，与 WinForm、移动终端应用属于同样的角色，可以把它们合在一起，统称为前端，分离开了后，后端不再考虑页面如何美化，前段也不需要了解后端采用的是什么样的技术实现方案，使得前后端的开发人员能够更加专注于自身业务的开发。

以前的一体式 Web 架构示意

现在的前后端分离构架示意图

前后端分离后，会出现以前web一体式构架中没有出现过得问题，比如认证，会话机制，签名验证等，
既然是做对外的api接口，当然安全问题是我们需要认真考虑的问题了，那么webapi会存在那些安全隐患呢？

处理这些安全隐患可以采用token+signature认证的方式；原理是：（1）做一个认证服务，提供一个认证的webapi，用户先访问它获取对应的token；（2）用户拿着相应的token以及请求的参数和服务器端提供的签名算法计算出签名后再去访问指定的api；（3）服务器端每次接收到请求就获取对应用户的token和请求参数，服务器端再次计算签名和客户端签名做对比，如果验证通过则正常访问相应的api，验证失败则返回具体的失败信息

登录的时候，获取信息，根据uid和随机数加密后，得到token，这作为取得用户信息的标识，把用户信息存入缓存，token为键，信息为值，以后取信息就从缓存取，防止重复查表。我是这么写的。你这token是要存入header的，也可以说cookie的，前段可以从header，cookie拿到这token和你传给他的比较下，ok，结束

前后端分离说白了就是把前端和后端分成两个工程，由不同的团队负责开发，这样从工程和职责的角度上都有分开，这样，后端偏向于提供单纯的API接口，前端就是调用API接口进行展示和业务调用。

这样不仅将页面渲染和业务逻辑从server剥离开来，将页面渲染放给前端，甚至放给浏览器；将业务逻辑放给后台专心搞业务，降低了他们之间的耦合性，而且从职责上进行了分明，更适合大项目和大团队管理和开发。

1一般来说，要实现前后端分离，前端就需要开启一个本地的服务器来运行自己的前端代码，以此来模拟真实的线上环境，并且，也是为了更好的开发。因为你在实际开发中，你不可能要求每一个前端都去搭建一个java(php)环境，并且在java环境下开发，这对于前端来说，学习成本太高了。
2但如果本地没有开启服务器的话，不仅无法模拟线上的环境，而且还面临到了跨域的问题，因为你如果写静态的html页面，直接在文件目录下打开的话，你是无法发出ajax请求的(浏览器跨域的限制),因此，你需要在本地运行一个服务器，可是又不想搭建陌生而庞大的java环境，怎么办法呢？nodejs正好解决了这个问题。在我们项目中，我们利用nodejs的express框架来开启一个本地的服务器，然后利用nodejs的一个>在前后端分离架构下，难免会遇到跨域问题。但是对于跨域，很多人并没有多么深入的了解。这里我就详细讲一下这个问题。

同源策略与跨域

所谓跨域，英文叫做cross-domain，是网络安全领域的一个专有名词。简单点理解就是某些 *** 作越过了域名的界限，访问了别的域名。

如果脚本可以自由访问其他域，就会产生很多安全问题。

比如，假设有一个网上银行系统，你已经登录过了，它支持一个ajax api可以进行转账；有一个论坛系统，人气很高，但是其中有恶意脚本，这个脚本会调用这个ajax api，从当前登录的用户账户中，转1000块到攻击者的账户。这样，当你访问这个论坛的时候，就会被转走1000块，而你一点都不知道！

除此之外，跨域请求还有很多危害。这不是一本关于安全的书，也就不展开讲了，想深入了解的可以买一本余弦编写的《Web前端黑客技术揭秘》。

为了防范跨域攻击，所有现代浏览器都遵循一套同源策略。根据MDN上的定义，“如果两个页面拥有相同的协议（protocol），端口（如果指定），和主机，那么这两个页面就属于同一个源（origin）”。对于违反同源策略的请求，除了img src等少数嵌入 *** 作之外，都会被浏览器阻止。

这里需要注意的是：同源不仅仅要求相同的域名或ip，连协议和端口也必须相同。比如>