客户端和服务器

连接到互联网的计算机被称作客户端和服务器。下面是一个简单描述它们如何交互的图表:

  • 客户端是典型的Web用户入网设备(比如,你连接了Wi-Fi的电脑,或接入移动网络的手机)和设备上可联网的软件(通常使用像 Firefox 和 Chrome的浏览器)。
  • 服务器是存储网页,站点和应用的计算机。当一个客户端设备想要获取一个网页时,一份网页的拷贝将从服务器上下载到客户端机器上来在用户浏览器上显示。

其他部分

我们讲的客户端和服务器并不能完成全部工作。还有其他必要的部分,我们将在下面讲述。

现在,让我们假设 Web 就是一条路。路的一端是客户端,就像你的家。另一端则是服务器,就像你想去的商店。

除了客户端和服务器,我们还需要了解:

  • 网络连接: 允许你在互联网上发送和接受数据。基本上和你家到商店的街道差不多。
  • TCP/IP: 传输控制协议和英特网互连协议是定义数据如何传输的通信协议。这就像你下订单,去商店和买东西时所使用的传输机制。这里就像是一辆汽车或自行车(或是你能想到的其他可能)。
  • DNS: 域名系统服务器像是一本网站通讯录。当你在浏览器内输入一个网址时,浏览器获取网页之前将会查看域名系统。浏览器需要找到存放你想要的网页的服务器,才能发送 HTTP 请求到正确的地方。就像你要知道商店的地址才能到达那。
  • HTTP: 超文本传输协议是一个定义客户端和服务器间交流的语言的协议(protocol )。就像你下订单时所说的话一样。
  • 组成文件: 一个网页由许多文件组成,就像商店里不同的商品一样。这些文件有两种类型:
    • 代码 : 网页大体由 HTML、CSS、JavaScript组成,不过你会在后面看到不同的技术。
    • 资源 : 这是其他组成网页的东西的集合,比如图像、音乐、视频、Word文档、PDF文件。

到底发生了什么?

当你在浏览器里输入一个网址时(在我们的例子里就是走向商店的路上时):

  1. 浏览器在域名系统服务器上找出存放网页的服务器的实际地址(找出商店的位置)。
  2. 浏览器发送 HTTP 请求信息到服务器来请拷贝一份网页到客户端(你走到商店并下订单)。这条消息,包括其他所有在客户端和服务器之间传递的数据都是通过互联网使用 TCP/IP 协议传输的。
  3. 服务器同意客户端的请求后,会返回一个“200 OK”信息,意味着“你可以查看这个网页,给你~”,然后开始将网页的文件以数据包的形式传输到浏览器(商店给你商品,你将商品带回家)。
  4. 浏览器将数据包聚集成完整的网页然后将网页呈现给你(商品到了你的门口 —— 新东西,好棒!)。

DNS解析

真正的网址看上去并不像你输入的那样美好、容易记忆。它们是一串数字,像 63.245.217.105。

这叫做 IP 地址,它代表了一个互联网上独特的位置。然而,它并不容易记忆,不是吗?那就是域名系统被发明的原因。它们是将你输入浏览器的地址与实际 IP 地址相匹配的特殊的服务器(像 "mozilla.org")。

网页可以通过  IP地址直接访问。试试通过输入 63.245.217.105 来访问 Mozilla网站。能准确访问的IP是:63.245.215.20。

数据包解析

前面我们用“包”来描述了数据从服务器到客户端传输的格式。这是什么意思?基本上,当数据在Web上传输时,是以成千上万的小 数据块 的形式传输的。大量不同的用户都可以在同时下载同一个网页。如果网页以单个大的 数据块 形式传输,一次就只有一个用户下载,无疑会让Web非常没有效率并且失去很多乐趣。

【摘录自MDN】客户端和服务器的更多相关文章

  1. HTTP Keep-Alive模式客户端与服务器如何判定传输完成

    目录 长连接是什么 服务器如何知道已经完全接受客户端发送的数据 客户端如何知道已经完全接受服务端发送的数据 Transfer-Encoding transfer-coding与Content-Leng ...

  2. Android客户端与服务器

    就是普通的服务器端编程,还不用写界面,其实还比服务器编程简单一些.跟J2EE一样的服务器,你android这一方面只要用json或者gson直接拿数据,后台的话用tomcat接受请求操作数据,功能不复 ...

  3. Socket与SocketServer结合多线程实现多客户端与服务器通信

    需求说明:实现多客户端用户登录,实现多客户端登录一般都需要使用线程技术: (1)创建服务器端线程类,run()方法中实现对一个请求的响应处理: (2)修改服务器端代码,实现循环监听状态: (3)服务器 ...

  4. xmpp笔记2(客户端到服务器的例子)--xml

    xmpp( 客户端到服务器的例子 ) 1 步:客户端初始流给服务器: <stream:stream xmlns='jabber:client' xmlns:stream='http://ethe ...

  5. [ActionScript 3.0] NetConnection建立客户端与服务器的双向连接

    一个客户端与服务器之间的接口测试的工具 <?xml version="1.0" encoding="utf-8"?> <!--- - - - ...

  6. Oracle客户端与服务器字符集不统一的处理

    当Oracle客户端与服务器的字符集不统一时. 症状: 如:ORA-00283: ?????????? 提示信息中有好多问号. 解决方法: 1查询服务器的字符集: SQL> conn / as ...

  7. SignalR一个集成的客户端与服务器库。内部的两个对象类:PersistentConnection和Hub

    SignalR 将整个交换信息的行为封装得非常漂亮,客户端和服务器全部都使用 JSON 来沟通,在服务器端声明的所有 hub 的信息,都会一般生成 JavaScript 输出到客户端. 它是基于浏览器 ...

  8. Java实验四 TCP客户端和服务器的应用

    实验内容 1.掌握Socket程序的编写: 2.掌握密码技术的使用: 3.设计安全 4.对通信内容进行摘要计算并验证 实验步骤 1.信息安全传送: 发送方A——————>接收方B A加密时,用B ...

  9. Socket 通信原理(Android客户端和服务器以TCP&&UDP方式互通)

    转载地址:http://blog.csdn.net/mad1989/article/details/9147661 ZERO.前言 有关通信原理内容是在网上或百科整理得到,代码部分为本人所写,如果不当 ...

随机推荐

  1. VS Code 配置 C/C++ (Windwos)

    下载VSCode https://code.visualstudio.com/Download 在扩展里安装C/C++插件 配置MinGW 需要再环境变量中的path中添加MinGW的bin目录 修改 ...

  2. 主席树 模板题 luogu([POI2014]KUR-Couriers)

    求区间内是否有个数大于二分之一的数,有的话输出这个数,没有的话输出0. 在询问的时候,如果左边有sum大于这个limit,就可以继续求,如果右边有sum大于limit  也递归, 如果都不行,返回 0 ...

  3. 染色板QPlette

    QPalette::Window 背景颜色 QPalette::WindowText 文本颜色 QPalette::Background 同QPalette::Window QPalette::For ...

  4. 隐藏pyqt中调用matplotlib图片中的工具栏

    方法: # pyqtgraph使用matplotlib import pyqtgraph.widgets.MatplotlibWidget as mw a_plt = mw.MatplotlibWid ...

  5. Vue-路由跳转的几种方式和路由重定向

    一.标签路由 router-link 注意:router-link中链接如果是'/'开始就是从根路由开始,如果开始不带'/',则从当前路由开始. 1.不传参 <router-link :to=& ...

  6. 01-Spring的概述

    Spring概述 ①Spring是一个开源框架 ②Spring为简化企业级开发而生,使用Spring开发可以将Bean对象,Dao组件对象,Service组件对象等交给Spring容器来管理,这样使得 ...

  7. 安卓开发:Android Studio自动import

    我只想说,真好用!哈哈,提高效率的好东西. 参考: [https://blog.csdn.net/pjdd123/article/details/80953669] [https://www.cnbl ...

  8. 对DensePose: Dense Human Pose Estimation In The Wild的理解

    研究方法 通过完全卷积学习从图像像素到密集模板网格的映射.将此任务作为一个回归问题,并利用手动注释的面部标注来训练我们的网络.使用这样的标注,在三维对象模板和输入图像之间,建立密集的对应领域,然后作为 ...

  9. ubuntu mysql新增用户并开启远程连接

    1.首先用root用户登录mysql mysql -u root -p 输入密码后登录成功 2.新建用户 use mysql; select host,user from user;(查看现有用户) ...

  10. canvas的描述

    // 1.找到DOM节点 const canvas = document.getElementById('canvas'); // 2.画笔 --- canvas的上下文对象 const ctx = ...