web 技术中前端和后端交互过程

简介: 客户端:上网过程中,负责浏览资源的电脑,叫客户端

1、客户端服务器交互过程

客户端:上网过程中,负责浏览资源的电脑,叫客户端

服务器:在因特网中,负责存放和对外提供资源的电脑叫服务器

服务器的本质: 就是一台电脑,只不过相比个人电脑它的性能高很多,个人电脑中可以通过安装浏览器的形式,访问服务器对外提供的各种资源。

个人电脑也可以配置环境,使能对外提供资源,也是一台服务器。

 

微服务就是单个应用程序拆分成许多个小型服务的一种开发方法。举个例子:

支付宝上有订购火车票的服务,现在阿里巴巴又开发了一个微信小程序,上面也可以订购火车票,那么订购火车票的代码只需要开发一份就行了,谁需要它就去找它(请求调用)就行啦。

 

访问本机服务器和访问互联网中的服务器的区别:

环境配置:

本机作为服务器:需要配置适当的软件和服务来充当服务器,例如安装和配置Web服务器(如Apache、Nginx)、数据库服务器(如MySQL、MongoDB)、应用服务器(如Tomcat、Node.js)等。

而访问其他服务器资源则不需要这样的配置。

网络访问:

本机作为服务器:通常情况下,你需要确保你的网络设置、防火墙配置等允许其他用户通过网络访问你的服务。

而访问其他服务器资源时:只需要通过普通的网络连接即可。

资源地址:

本机作为服务器:你可以使用本地主机地址(如localhost或者127.0.0.1)来访问你的服务器资源。

而访问其他服务器资源时:你需要使用对应服务器的地址或域名。

权限和安全性:

本机作为服务器,需要考虑到权限和安全性的问题,确保你的服务对外界的访问是安全可控的。

而访问其他服务器资源时:你可能需要提供相应的凭证(如用户名和密码、API密钥等)来获取授权访问。

2、前端的功能

前端开发中常见的三种主要技术。

HTML:HTML 被认为是网页的骨架。它用于构建网页的内容,并且还告诉Web浏览器如何显示它。

CSS:CSS为浏览器提供了有关显示内容的更具体信息,例如文本的大小和颜色。

JavaScript:网站不仅仅是文本。JavaScript允许我们创建更复杂的元素,如交互式地图和动画图形。它能够让我们的网页具有更多功能。

3、后端的功能

根据不同的请求信息做出不同的响应。具体来说,当用户触发某个行为后,客户端会通过 http/https 请求,和服务器建立连接、发送请求,往往这个请求首先会被连接到 LB(负载均衡上),LB 根据配置,将请求转发到内部的 API 服务上。这些 API 服务,根据不同的业务逻辑请求其他服务(service),这些服务各司其职,例如读写某 Mysql 表、读写缓存、甚至请求搜索引擎来完成相应的任务。而 API 服务在完成相应的流程后,也会将数据返回给客户端,客户端根据前端逻辑完成相关的展示。

4、web 前后端是如何交互的

在本地开发Angular前端和Spring Boot后端时,他们之间的交互基于http协议。

前端发送HTTP请求:Angular前端通过Angular框架提供的HttpClient模块或其他HTTP客户端库发送HTTP请求到后端。

后端接收HTTP请求:Spring Boot后端应用程序通过Spring MVC或Spring Webflux等Web框架接收HTTP请求。这些框架提供了用于处理不同HTTP方法和路径的注解和工具。

后端处理HTTP请求:后端应用程序根据收到的HTTP请求执行相应的业务逻辑。这可能包括从数据库中检索数据、执行业务逻辑、对数据进行处理等。

后端发送HTTP响应:一旦后端完成处理,它将生成HTTP响应并将其发送回前端。响应通常包括HTTP状态码、响应头和响应体。响应体中可以包含请求的结果数据或者其他信息。

前端接收HTTP响应:Angular前端接收到后端发送的HTTP响应。它根据响应中的数据进行相应的操作,例如更新界面、显示数据、处理错误等。

相关文章
|
8天前
|
JSON 自然语言处理 前端开发
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
102 72
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
|
4月前
|
Web App开发 JavaScript 前端开发
Node.js 是一种基于 Chrome V8 引擎的后端开发技术,以其高效、灵活著称。本文将介绍 Node.js 的基础概念
Node.js 是一种基于 Chrome V8 引擎的后端开发技术,以其高效、灵活著称。本文将介绍 Node.js 的基础概念,包括事件驱动、单线程模型和模块系统;探讨其安装配置、核心模块使用、实战应用如搭建 Web 服务器、文件操作及实时通信;分析项目结构与开发流程,讨论其优势与挑战,并通过案例展示 Node.js 在实际项目中的应用,旨在帮助开发者更好地掌握这一强大工具。
88 1
|
14天前
|
监控 前端开发 Java
构建高效Java后端与前端交互的定时任务调度系统
通过以上步骤,我们构建了一个高效的Java后端与前端交互的定时任务调度系统。该系统使用Spring Boot作为后端框架,Quartz作为任务调度器,并通过前端界面实现用户交互。此系统可以应用于各种需要定时任务调度的业务场景,如数据同步、报告生成和系统监控等。
36 9
|
1月前
|
前端开发
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
43 1
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
|
2月前
|
前端开发 NoSQL Java
【Java若依框架】RuoYi-Vue的前端和后端配置步骤和启动步骤
本文介绍了如何配置和启动基于Java的若依(RuoYi)项目,涵盖后端和前端的详细步骤。首先,准备Redis、MySQL以及IDE(如Idea和VS)。接着,通过GitHub获取代码并导入到IDE中,执行必要的SQL文件和配置数据库密码。然后,启动Redis并进行相关配置。最后,按照前端配置步骤克隆前端代码库,打开终端执行命令完成前端配置。整个过程详细记录了每一步的操作,帮助开发者顺利部署若依项目。 如果你觉得有帮助,请点赞、关注和收藏,这将是我持续分享的动力!
596 1
|
3月前
|
机器学习/深度学习 前端开发 算法
婚恋交友系统平台 相亲交友平台系统 婚恋交友系统APP 婚恋系统源码 婚恋交友平台开发流程 婚恋交友系统架构设计 婚恋交友系统前端/后端开发 婚恋交友系统匹配推荐算法优化
婚恋交友系统平台通过线上互动帮助单身男女找到合适伴侣,提供用户注册、个人资料填写、匹配推荐、实时聊天、社区互动等功能。开发流程包括需求分析、技术选型、系统架构设计、功能实现、测试优化和上线运维。匹配推荐算法优化是核心,通过用户行为数据分析和机器学习提高匹配准确性。
233 3
|
3月前
|
缓存 负载均衡 算法
深入理解后端服务的负载均衡技术
在现代网络服务架构中,高效的负载均衡策略对于保证应用性能和可靠性至关重要。本文将深入探讨后端服务中的负载均衡技术,包括其重要性、常见算法以及如何实现高效均衡。通过分析不同的负载均衡方法,我们旨在为开发者提供实用的指导,帮助他们优化自己的系统架构。
|
4月前
|
前端开发 JavaScript 搜索推荐
HTML与CSS在Web组件化中的核心作用及前端技术趋势
本文探讨了HTML与CSS在Web组件化中的核心作用及前端技术趋势。从结构定义、语义化到样式封装与布局控制,两者不仅提升了代码复用率和可维护性,还通过响应式设计、动态样式等技术增强了用户体验。面对兼容性、代码复杂度等挑战,文章提出了相应的解决策略,强调了持续创新的重要性,旨在构建高效、灵活的Web应用。
73 6
|
4月前
|
前端开发 JavaScript 搜索推荐
前端懒加载:提升页面性能的关键技术
前端懒加载是一种优化网页加载速度的技术,通过延迟加载非首屏内容,减少初始加载时间,提高用户访问体验和页面性能。
|
4月前
|
缓存 JavaScript 前端开发
JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用
本文深入讲解了 JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用。
104 5

热门文章

最新文章