到底什么是前后端分离

目录

Web 应用的开发主要有两种模式:

前后端不分离

前后端分离

总结


Web 应用的开发主要有两种模式:

前后端不分离

前后端分离

理解它们的区别有助于我们进行对应产品的测试工作。

前后端不分离

在早期,Web 应用开发主要采用前后端不分离的方式,它是以后端直接渲染模板完成响应为主的一种开发模式。以前后端不分离方式开发的 Web 应用的架构图如下:

浏览器向服务器发起请求,服务器接收到请求后去数据库中获取数据,然后渲染 HTML 模板并返回渲染后的 HTML 数据,或者返回一个重定向。绝大部分工作都在后端进行处理,客户端(浏览器)只负责页面的展示和用户交互。

这种开发方式有如下特点:

1、一般一个应用只需要一个后台服务器

2、客户端只需要请求不同的页面,服务器会完成页面上的所有数据逻辑,所以 http 请求次数较少

3、每个请求都是一个 HTML,会有大量的冗余数据

4、开发时,前后端代码耦合高,出了问题责任不明确

5、在开发单纯的网站时,效率非常高

6、响应数据是 HTML,只能适应单一客户端,当需要多端支持时如要单独开发

前后端分离

随着 AJAX 技术的出现,可以在不刷新页面向服务器发送 http 请求,所以又出现了前后端分离的开发模式。

后端只要开发接口即可,前端可以通过发起 AJAX 请求,拿到后端的数据,渲染和怎样调用接口的事情,交给前端。以前后端分离方式开发的 Web 应用的结构图如下:

这种开发方式有如下特点:

1、是目前 Web 开发的主流模式

2、需要静态文件服务器和后端接口服务器

3、后台服务器只提供的数据接口的服务,响应的往往是 JSON 数据

4、开发时,前后端责任分工明确

5、前后端解耦合,可以同时开发,提高开发效率

6、一个后台即可满足网站、app、小程序等多种应用的需要

总结

对于前后端不分离的应用,一般只需要进行功能测试。对于前后端分离的应用,既需要进行功能测试,还需要进行接口测试,并且在进行功能测试是还需要分析 bug 是前端还是后端的问题。


 以下是我收集到的比较好的学习教程资源,虽然不是什么很值钱的东西,如果你刚好需要,可以评论区,留言【777】直接拿走就好了

各位想获取资料的朋友请点赞 + 评论 + 收藏,三连!

三连之后我会在评论区挨个私信发给你们~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/46967.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【C#】并行编程实战:异步流

本来这章该讲的是 ASP .NET Core 中的 IIS 和 Kestrel ,但是我看了下这个是给服务器用的。而我只是个 Unity 客户端程序,对于服务器的了解趋近于零。 鉴于我对服务器知识和需求的匮乏,这里就不讲原书(大部分)内容了。本…

前端面试题 —— Vue (二)

目录 一、过滤器的作用,如何实现一个过滤器 二、v-model 是如何实现的,语法糖实际是什么? 三、$nextTick 原理及作用 四、Vue 中给 data 中的对象属性添加一个新的属性时会发生什么?如何解决? 五、简述 mixin、ex…

【C# 数据结构】Heap 堆

【C# 数据结构】Heap 堆 先看看C#中有那些常用的结构堆的介绍完全二叉树最大堆 Heap对类进行排序实现 IComparable<T> 接口 对CompareTo的一点解释 参考资料 先看看C#中有那些常用的结构 作为 数据结构系类文章 的开篇文章&#xff0c;我们先了解一下C# 有哪些常用的数据…

【防火墙】iptables防火墙(一)

防火墙具有隔离功能 主要部署在网络边缘或者主机边缘&#xff0c;防火墙的主要作用是决定哪些数据可以被外网访问&#xff0c;哪些数据可以进入内网访问 网络层&#xff08;路由器&#xff09;&#xff1a;数据的转发 安全技术 1.入侵监测系统&#xff1a;在检测到威胁&…

城市气象数据可视化:洞察气候变化,构建智慧城市

随着城市化进程的加速&#xff0c;城市气象数据的采集和分析变得越来越重要。气象数据不仅影响着人们的生活和出行&#xff0c;还与城市的发展和规划息息相关。在数字化时代&#xff0c;如何将城市中各个气象数据进行可视化&#xff0c;让复杂的数据变得简单易懂&#xff0c;成…

全国大学生数据统计与分析竞赛2021年【本科组】-B题:用户消费行为价值分析

目录 摘 要 1 任务背景与重述 1.1 任务背景 1.2 任务重述 2 任务分析 3 数据假设 4 任务求解 4.1 任务一&#xff1a;数据预处理 4.1.1 数据清洗 4.1.2 数据集成 4.1.3 数据变换 4.2 任务二&#xff1a;对用户城市分布情况与分布情况可视化分析 4.2.1 城市分布情况可视化分析 4…

微信小程序客服系统-对接消息推送-对接模板订阅消息-嵌入webview客服链接

想要给自己的小程序增加客服系统功能 小程序客服对接导自己的系统等需求&#xff0c;可以参照我开发的客服系统&#xff0c;实现私有化部署搭建对接的微信小程序 小程序消息推送对接 首先登录小程序后台在小程序后台>开发管理>开发设置>服务器域名部分&#xff0c;配置…

使用TensorFlow训练深度学习模型实战(下)

大家好&#xff0c;本文接TensorFlow训练深度学习模型的上半部分继续进行讲述&#xff0c;下面将介绍有关定义深度学习模型、训练模型和评估模型的内容。 定义深度学习模型 数据准备完成后&#xff0c;下一步是使用TensorFlow搭建神经网络模型&#xff0c;搭建模型有两个选项…

Java-运算符

目录 一、什么是运算符 二、算术运算符 1.基本四则运算符&#xff1a;加减乘除&#xff08;、-、*、/、%&#xff09; 2.增量运算符&#xff08;、-、*、%&#xff09; 3.自增、自减运算符&#xff08;、--&#xff09; 三、关系运算符 四、逻辑运算符 1.逻辑与 && …

Vue前端渲染blob二进制对象图片的方法

近期做开发&#xff0c;联调接口。接口返回的是一张图片&#xff0c;是对二进制图片处理并渲染&#xff0c;特此记录一下。 本文章是转载文章&#xff0c;原文章&#xff1a;Vue前端处理blob二进制对象图片的方法 接口response是下图 显然&#xff0c;获取到的是一堆乱码&…

【Docker】安全及日志管理

目录 一、Docker 安全及日志管理1.1 Docker 容器与虚拟机的区别1. 隔离与共享2. 性能与损耗 1.2Docker 存在的安全问题1.Docker 自身漏洞2.Docker 源码问题 1.3 Docker 架构缺陷与安全机制1. 容器之间的局域网攻击2. DDoS 攻击耗尽资源3. 有漏洞的系统调用4. 共享root用户权限 …

网安第二天笔记

ssh 22端口 账号密码登陆、证书登录 smtp 25端口 邮件协议 DNS 53 DHCP 67 68端口 四个包 1.DHCP服务器&#xff1a;服务器管理IP地址池和配置参数 2.客户端请求&#xff1a;发送DHCP广播请求&#xff0c;discover消息 3.DHCP服务器回应&#xff1a;收到discover会回复offer…

PostMan+Jmeter+QTP工具介绍及安装

目录 一、PostMan介绍​编辑 二、下载安装 三、Postman与Jmeter的区别 一、开发语言区别&#xff1a; 二、使用范围区别&#xff1a; 三、使用区别&#xff1a; 四、Jmeter安装 附一个详细的Jmeter按照新手使用教程&#xff0c;感谢作者&#xff0c;亲测有效。 五、Jme…

Linux_CentOS_7.9部署Docker以及镜像加速配置等实操验证全过程手册

前言&#xff1a;实操之前大家应该熟悉一个新的名词DevOps 俗称开发即运维、新一代开发工程师&#xff08;Development和Operations的组合词&#xff09;是一组过程、方法与系统的统称&#xff0c;用于促进开发&#xff08;应用程序/软件工程&#xff09;、技术运营和质量保障&…

Angular:动态依赖注入和静态依赖注入

问题描述&#xff1a; 自己写的服务依赖注入到组件时候是直接在构造器内初始化的。 直到看见代码中某大哥写的 private injector: Injector 动态依赖注入和静态依赖注入 在 Angular 中&#xff0c;使用构造函数注入的方式将服务注入到组件中是一种静态依赖注入的方式。这种方…

Python显示循环代码的进度条

目录 1. tqdm库 2. alive_progress库 3. progressbar库 1. tqdm库 tqdm是一个快速&#xff0c;可扩展的Python进度条&#xff0c;可以在Python长循环中添加一个进度提示信息 import time from tqdm import trangefor i in trange(100):# do somethingtime.sleep(0.5) 2. a…

微服务——Nacos配置管理

目录 Nacos配置管理——实现配置管理 配置管理实践 Nacos配置管理——微服务配置拉取 Nacos配置管理——配置热更新 方式一: ​编辑 方式二(推荐方式): Nacos配置管理——多环境配置共享 优先级问题 Nacos配置管理——nacos集群搭建 总结​编辑 Nacos配置管理——实现配置管…

【ADS】导入CMOS衬底文件+使用coilsys生成电感

新建工程经常忘记怎么操作&#xff0c;简记防遗忘。 操作步骤 1.unzip file2.原理图仿真3.Layout加载衬底文件4.使用coilsys生成电感 1.unzip file designKits-》unzip&#xff0c;选择对应库的压缩包&#xff0c;我这里是&#xff08;TSMC_CRN65GP_v2.zip&#xff09;。 为了…

BHQ 1Mal,BHQ-1 Maleimide,BHQ1马来酰亚胺,黑洞猝灭剂

资料编辑|陕西新研博美生物科技有限公司小编MISSwu​ PART1----产品描述&#xff1a; BHQ-1 Maleimide黑洞猝灭剂-1(BHQ-1)被归类为暗猝灭剂&#xff0c;该淬灭剂能够将一定距离内荧光基团发出的光全部吸收&#xff0c;实现对荧光信号的淬灭&#xff0c;所以可得到更强的特异性…

【App管理04-Bug修正 Objective-C语言】

一、咱们刚才已经把这个给大家做完了吧 1.这个Label怎么显示到上面去了, 我们现在是把它加到我们的控制器的View里面吧 我们看一下这个坐标是怎么算的,来,我们找一个坐标, 咱们的坐标,是不是用这个View的frame,减的吧 来,咱们在这里,输出一下这个Frame,看一下吧 在…