文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

web前后端交互方式是什么

2023-06-27 10:23

关注

这篇文章主要讲解了“web前后端交互方式是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“web前后端交互方式是什么”吧!

  正如我们所知,一个完整的IT项目是由多个不同岗位共同完成的,包括UI设计、前端开发、后端开发、测试等。前端后端需要通过技术上交互实现联通,那么web前后端交互技术都有哪些呢?

  前端开发需要做的事情,只有两个:1. 创建界面结构 2. 数据交互

  数据交互其实又可以分为两种:1. 给后台技术 2. 从后台那数据

  数据交互的目的是什么?

  取:将数据渲染到dom文档中  给:提交数据到后台后,后台会继续返回我们一个数据,拿到这个数据,然后渲染页面.

  1. 利用cookie

  例如:前台通过登录来存储cookie

  后台通过req.cookies()来获取存储的cookie信息

  2. 利用Ajax

  在学习NodeJS之前最常用的前后端交互大都利用ajax 和JQuery中已经封装好的$.ajax、$.post、$.getJSON 通过创建一个XMLHttpRequest对象,来进行前后端交互。

  在学NodeJS之后我们也利用依赖于$http服务自己搭建的_http来完成get、post和jsonp的方式来进行前后端交互;

  3. jsonp

  jsonp是前后端结合跨域方式,因为前段请求到数据需要在回调函数中使用,所以后端得将数据放回到回调函数中

  jsonp属于AJAX吗? ajax是指通过使用xmlhttpquest对象进行异步数据交互的技术,jsonp是依靠scriptsrc属性来获取的,不属于ajax

  4. 服务端渲染

  浏览器请求到的内容其实可以通过后端加工一下,将一会数据直接渲染好,再给浏览器就可以了

  在php中实现服务端渲染:

  在php语言文件中可以放入html代码,访问php文件的时候就相当于访问这个对应的html文件,因为在php文件中,所以可以写一些php的代码来渲染数据

  在Node中实现服务端渲染:

  利用模板引擎,node在渲染模板的时候给模板传入数据,在模板中就可以使用特定的语法来渲染dom了 例如:ejs,jade

  注意:express里的路由是靠请求路径划分的,前一个自己搭的路由是根据请求类型划分的。

  5. webSocket 和 Socket.io

  网上的两个程序通过一个双向的通信连接实现数据的交换,这个连接的一端成为一个scoket

  通过建立socket双向连接,就可以让客户端和服务端直接进行双向通信

  简单的小案例:socket.io聊天的思路

  1. 服务器端建立好服务端, var wss=require(“socket.io”)(server)

  2. 创建客户端的连接socket var wsc = io.connect(‘ws://’)

  3. 客户端连接 wsc.on(“connect”,function(e){})

  4. 服务器端接收到客户端连接的消息 wss.on(“connection”,function(socket){})

  5. 客户端发送消息的时候触发 wsc.on(“meaasge”,function(msg){})

  6. 客户端接收到服务器端发送消息 wsc.on(“message”,function(e){})

感谢各位的阅读,以上就是“web前后端交互方式是什么”的内容了,经过本文的学习后,相信大家对web前后端交互方式是什么这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是编程网,小编将为大家推送更多相关知识点的文章,欢迎关注!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯