javascript - 网站前后端分离问题
大家讲道理
大家讲道理 2017-04-10 15:56:12
[JavaScript讨论组]

公司网站原本的网页数据是用php处理的,然后最近在尝试前后端分离,数据完全由js来处理页面的数据,用js的ajax来请求返回数据,我的疑问是:

  1. 这种做法可取吗?

  2. 会不会造成安全性的问题?

  3. 不然前后端分离指的是什么?是怎么实现的?

  4. 现在国内有没有哪些网站数据完全由js控制,就是后端返回json之类的数据,然后js来负责填充显示网页

知道的朋友不妨和我讨论讨论,公司前端体系不成熟,感激不尽!


: ) 谢谢大家的讨论,受益匪浅,感谢,

大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

全部回复(19)
巴扎黑

特意把我以前写过的一个总结转过来给你看看:http://segmentfault.com/a/1190000003795517

其实也没有谈什么很深的东西(比如所谓的“大前端”是什么),但是你问的几个问题多少都有些涉及,算是一个 overview 的回顾吧。

总结一句话:分不分离是要看情况的,你可以不选择分离,但是你不可以不会分离。


建议你以后不要把问题问的如此之泛,因为回答起来没重点,容易争执。把你的几个问题拆开来分别讨论还能多赚点分多好啊?哈哈

PHPz

个人以前有过类似的问题,所以这里为楼主简单逐条解释一下。

这种做法可取吗,会不会造成安全性的问题?

技术是人们对解决问题的方式、方法的一种归结。也因此任何技术都有其特定的场景和适用领域。

个人初入社会时换过几家公司,他们的技术架构分别有J2EE、C++服务器与AS3网页客户端、C++服务器与C++客户端、PHP网站。

说白了这些看上去感觉不同的平台、技术,其实归根结底都是让用户通过网线把数据传到电信服务上,最后丢到你的服务器里。

因此说白了底层都是类 Socket(TCP/UDP) 技术,HTTP也只是基于这些技术的 “通信协议”。

而所谓通信协议,不过就是说我规定你必须以这样的方式传递数据:数据包头 · 数据包分隔符 · 数据包内容

那么在这个基础上,就延伸出来了加密通信方式来保证数据传输过程中的安全性。如:

  1. HTTPS的从协议上解决问题的。

  2. 在前端通过JS对数据进行MD5的加密方式.

  3. 通过NSAPI来制作浏览器插件,并通过C++之类的语言来编写更加不容易被破解的本地通信方式(浏览器端的JS加密可能意味着加密方式被破解,写插件可以通过单独的通道去服务器上获取Token)

说白了,PHP也只是将HTML页面生成出来,然后传回给用户。如果用户和你的服务器间的通信层(如电信服务商、机房)被劫持拦截了,那就涉及到电信公司或大规模劫持、用户电脑被植入木马之类的问题...

这个你能解决么

前后端分离指的是什么?是怎么实现的?

技(liu)术(cheng)架(guan)构(li)上的前后端分离

前后端分离通常是指程序架构上的,而不是说我用JS加载数据就可以 看起来更厉害

为什么一些应用会把数据处理丢在前端,哪些公司这么做了?

我以前跟着公司做的OA系统,J2EE与EXTJS的架构。为什么这么做?很简单,如果你的网页里涉及到像富客户端(Rich Client)一样的技术,那么这样做可以让你的前端工程师更好的把控应用的流程。

什么是Rich Client?形象一点来说就是把 Office 搬到 Web。

把流程从
PM:“我要这个功能”
后端:“这个先找前端做个模板”
前端:“模板做完了”
后端:“我来对接一下,这里样式不对”
前端:“我改完了”
后端:“功能交付”
PM:“春节要加这个活动”
后端:“这个先找前端改个模板”
前端:“模板做完了”
后端:“我来对接一下,这里样式不对”
前端:“我改完了”
后端:“功能交付”

变成
PM:“我要这个功能”
前端:“我要接口”
后端:“接口完成了”
前端:“我来对接一下,功能交付”
PM:“春节要加这个活动”
前端:“需要增加接口”
后端:“接口完成了”
前端:“我来对接一下,功能交付”

服务器结构上的前后端分离

以前的服务器结构:

数据库 -> 缓存服务器 -> N台PHP节点(通过代码控制JS、CSS)

现在的服务器结构:

数据库 -> 缓存服务器 -> N台PHP节点(只负责处理API请求) -> CDN托管(JS+CSS)

现在国内有没有哪些网站数据完全由js控制?

完全JS控制也不太可能,毕竟涉及到 SEO(搜索引擎优化) 问题。这里倒是可以问,有多少新的 Web 项目没用到 AJAX 呢?以下公司都这么做过:

  • 腾讯:微云、QQ空间

  • 百度:地图、百度盘

  • 阿里:阿里云

  • Google:没几个不是

  • Apple:iCloud,iTunes Connect

  • Microsoft:One Drive,Office

有没有什么现成的解决方案?可能会遇到哪些问题?

大部分PHP框架都提供了Restful API支持、JSON/JSONP输出。

可能会遇到的坑有:

  • SEO,搜索引擎优化、爬出抓取,解决方案就是专门为搜索引擎写页面、SITEMAP,或是部分 AJAX

  • HTML5安全风险详析之一:CORS攻击

  • 浅谈跨域WEB攻击

  • 深掘XSS漏洞场景之XSS Rootkit

还有一个我忘了,但是大概就是不安全的GET攻击。

比如你现在有一个接口是:comment.php?content=HelloWorld 的评论接口,或是 vote.php?target_id=12121 的投票接口

然后我现在在某个论坛把自己的签名改为

<img src="http://www.xxx.com/vote.php?target_id=12121" /> 

然后看到这个签名的用户有可能有你的程序的账号,之后他看到这个帖子就会请求一次于是就刷票了。微博以前出过这个问题,解决方案依然是搞定跨域。

如何区分出需要 AJAX 化的场景?

这一部分是我的一些粗浅理解,简单来说涉及到以下方面考虑:

  • 技术人员配置

  • 项目复杂度

  • 用户接受度

技术人员配置

这个是私事,如果该项目后端多,前端少,那还是后端分担一部分前段工作吧。如果人员配置健康,建议把一部分业务变动需求量大操作接口化。毕竟万变却脱离不了:CRUD。

项目复杂度

我们要做个 MMO网页游戏 一般网页APP的出来,那你还是趁早把前后端分开,让大家用 "API" 交流吧。

我们要做个 页面刷新量少,效果酷炫 的网页社交APP出来,那你可以部分分离,优先分割操作复杂、重复编写次数高的功能,如购物车的操作。

我们要做个 类似网上图书馆 的网页APP出来,那你就PHP渲染吧,毕竟让用户能够通过Google找到你的网站、或是通过Google来搜索你的网站,比你自己设计个站内搜索都重要。

用户接受度

简单来说当年 Facebook 有过大量运用 AJAX 结果导致引起部分访问 Facebook 困难的国家的网民的愤怒的事情。因为他们刷出来页面却没有数据(笑)。

ringa_lee

https://github.com/lifesinger/lifesinger.github.io/issues/184

大家讲道理

最正常不过了。后端只返回json,前端加工json渲染页面。安全上,post和get的时候做权限检验,前端过来的数据都不可信,后端也要做数据校验。另外,用node很方便的一个地方,校验的几个库都是前后端都适用的,代码copy一下就行

黄舟

推荐你看看淘宝ued的文章哈。 淘宝ued

高洛峰

所谓的“前后端分离”仅仅是开发模式的一种而已,讨论的是分工,分工是为了提高效率。

早些时候基本都是前端提供好html页面,然后后端去套,这个思路基本虽然能满足需求但是已经被严重的证明影响开发效率

后端团队(如php,java等等)处理和提供数据是毫无争议的地方,当然也不排除所谓的“大前端”把数据处理的活也干了。

现在业界比较纠结的问题是页面渲染纠结谁做,其实涉及到页面的部分当然是前端团队比较“专业”,所以近几年来由前端团队来进行数据渲染的方式大行其道,几乎可以断定是未来的趋势。

但是有这么一个问题似乎很少人进行讨论,那就是后端团队向前端团队提供的“数据”到什么颗粒度。比方说一个页面可能需要好几块的数据聚合来做渲染,那么后端团队只是一些基础性数据,然后由前端团队整合渲染还是后端团队提供一整块数据直接做页面渲染?这似乎没有多少人关注。

上面提高的问题,个人见解得看前端团队的“水平”如何来抉择。数据整合这件事其实水很深,能做和做得好玩玩全全是两个概念,所以如果前端团队的“水平”很高,那么后端团队仅仅提供基础性数据就可以了,前端团队可以更加自如的组合数据做页面,但是如果前端团队的“水平”不高,那么我觉得仅仅做把整块的数据渲染成页面的工作就好了,这样至少能保证不会被“玩坏”。

上述是针对楼主提到的问题的一些个人思考,希望有所帮助。

ringa_lee

为什么分离呢?因为前端逻辑已经很重了,为了前端能更快速开发?还是只是为了分离而分离。想了解下你想通过分离解决什么问题。不分离又是有什么限制?

迷茫

php只提供api,js进行调用
以后方便做客户端

巴扎黑

目前我也在做相关的分离工作,初衷目的是提高前端的重用性,开发多套客户端用同一套后台。

怪我咯

前后端分离,你可以看看淘宝的前后端分离实践。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号