Web基础和HTTP协议

最新推荐文章于 2024-08-15 22:28:28 发布

moluxiangfenglo

最新推荐文章于 2024-08-15 22:28:28 发布

阅读量984

点赞数 26

文章标签： http 网络协议网络

本文链接：https://blog.csdn.net/moluxiangfenglo/article/details/139596289

版权

Web基础

域名和DNS

1.域名的概念

域名是网络上的一个名字可以看成地址别名。它是用来代替IP地址的一串字符，因为IP地址通常是一些列数字。对于我们来说并不容易记住。域名是通过域名系统解析IP地址，从而使得计算机可以定位交换数据。域名具有层次结构通过包括顶级域名，二级域名，有时还包括子域名。

（1.域名结构）（2.域名结构类型）

域名的结构是分层次的，由几个部分组成，通常由右至左读取，越向右层次越高，具体结构如下：

顶级域名（TLD）:
这是域名最右侧的部分，例如 .com、.org、.net、.gov 等。它表明了域名的最高级别的类别。还包括国家代码顶级域名（ccTLD），如 .uk、.de、.cn 等。

二级域名:
这是域名中的下一部分，位于顶级域名的左侧，通常由个人或组织自定义，如 google、wikipedia 等。

子域名:
在二级域名左边可以设置子域名，它们用来组织或分隔一个网站内的不同部分，例如 mail.google.com 中的 mail。

主机名:
在一些情况下，子域名的左侧还可以进一步细分，例如 www 是一个传统的主机名用以指向网站的主服务器，但如今 www 可以视为一个常见的子域名。

一个完整的域名例子，blog.example.co.uk：

.uk 是国家代码顶级域名（ccTLD）。
.co 一般是指一个商业机构，作为二级域名。
example 是注册的域名。
blog 是一个子域名，可能指向托管有关博客内容的服务器。

2.Hosts文件

(1.Hosts文件的作用)

文件是一种操作系统级别的文件，存在于大多数操作系统中，包括Windows、Mac OS、Linux等。它的基本作用是将特定的主机名（或域名）映射到对应的IP地址。这样，当您试图访问一个网站或网络资源时，系统会首先检查 hosts 文件，看是否有对应这个网站或资源的映射。

3.DNS

DNS是“域名系统”(Domain Name System)的缩写，是互联网上的一种服务，可读的域名（如 www.example.com）转换成计算机可理解的IP地址（如 192.0.2.1）。由于计算机和网络设备使用IP地址来识别和通信，DNS服务对于用户在网上浏览网站至关重要。

这里是DNS的一些关键点和功能：

域名到IP地址的转换:
当您在网页浏览器中输入一个网址时，浏览器会使用DNS将该域名转换成服务器的IP地址，以建立连接并加载网页内容。

分散管理:
DNS遵循分布式数据库模型，由许多不同的服务器构成一个广泛的网络。这些服务器包括根服务器、顶级域名（TLD）服务器、权威名称服务器等。

域名层级:
域名系统有一个层次结构，最顶层是根域，下一层是顶级域名（如 .com、.org、.net），再下一层是二级域名，以此类推。

名称服务器的角色:

根名称服务器: 回应对顶层域名服务器的查询。
顶层域名服务器: 存储特定顶级域名下所有域名的信息。
权威名称服务器: 存储特定域名的信息，并具有最终解释权。
递归服务器: 通常由ISP运行，为用户提供简化的查询服务，它们在必要时与其他DNS服务器通信以解析域名。

缓存:
为了减少延迟和网络负载，DNS查询结果会被缓存。缓存可以在多个级别上发生，包括您的个人计算机、您的网络路由器，或者您的ISP的DNS服务器。

记录类型:
DNS涉及多种不同类型的记录，例如：

A记录 (Address): 映射域名到IPv4地址。
AAAA记录 (Quad-A record): 映射域名到IPv6地址。
CNAME记录 (Canonical Name): 允许将一个域名指向另一个域名，而非IP地址。
MX记录 (Mail Exchange): 指定用于接收电子邮件的服务器。
NS记录 (Name Server): 指出该域名由哪些名称服务器控制。

DNS是互联网的基本组成部分，使得人们能够更容易地访问网站和网络服务，而不必记住复杂的IP地址。

4.域名注册

以下是域名注册步骤的大致流程：

选择域名:
首先，您需要决定想要注册的域名，这通常反映了您的个人名字、品牌或公司名称，并且应该是容易记住和输入的。

检查域名的可用性:
使用注册商提供的域名搜索工具来确认所选的域名是否可用。如果已经被别人注册，您将需要考虑替代的名称或不同的顶级域名。

选择域名注册商:
您可以从许多不同的注册商中选择，包括GoDaddy、Namecheap、阿里云等。选择时应该考虑价格、服务质量、附加服务（如域名隐私保护、托管服务）等因素。

完成注册过程:
一旦您选定了域名并找到了提供该域名的注册商，就需要填写一些注册信息并支付注册费用。这通常包括联系信息、注册期限（通常是1到10年），随后您需要与注册商签订服务协议。

设置域名服务器 (DNS):
在注册过程中，您通常需要指定域名服务器 (DNS)。您可以使用注册商的DNS服务，也可以指定第三方的DNS服务。

维护和续约:
域名注册是有期限的。在域名到期前，您需要将其续约，以避免域名被释放并可能被其他人注册。许多注册商提供自动续约服务。

保障隐私和安全:
如果您希望保护您的个人信息，可选择隐私保护服务，以免您的注册信息（如名字、地址、电子邮件和电话号码）公开在WHOIS数据库中。

注册域名是在网络上建立在线身份的第一步，对商业、个人品牌建设或任何想要在线出现的项目都非常关键。您注册的域名有助于定义您的品牌，并且可以增强用户对您网站的记忆，这也是网络营销和SEO策略的一个组成部分。

网页与HTML

1.网页的概述

网页，通常被称为页面，是互联网上的基本构建块，它由标记语言（如HTML）编写而成，提供了网上信息和用户互动的平台。网页可以包含文本、图像、视频和其他多媒体内容，并且可以使用CSS（层叠样式表）进行美化和布局设计，以及JavaScript等脚本语言来实现交互功能。

网页的关键特性如下：

HTML结构:
HTML（超文本标记语言）是创建网页内容的标准标记语言。它定义了网页的结构，并允许作者使用超链接连接到其他页面。

CSS样式:
CSS用于设置HTML元素的样式，控制布局和页面的外观。通过CSS，开发者可以提高内容与表现层的分离度，使得网站维护和设计改版更为简便。

JavaScript交互:
JavaScript是一种脚本语言，用来增强网页的功能，如响应用户事件、动画、表单验证等。它既可以直接嵌入到HTML中，也可以作为单独的文件链接到网页。

多媒体元素:
网页可以嵌入多种多媒体元素，包括图片、音频、视频、动画等，以吸引用户并提供更加丰富的互动体验。

超链接:
网页通常包含超链接，可以指向同一网站的其他页面，或者连接到外部网站。这些链接可以通过点击进行快速跳转，构成了网络的互联性。

表单和输入:
网页可以包含表单，用户可以通过它输入数据，如登录信息、搜索词或个人资料等。

响应式和适配性:
响应式网页设计允许网页内容根据用户设备的屏幕大小和分辨率进行适配，包括电脑、平板和手机。

服务器端交互:
网页可以与服务器进行交云交互，比如通过AJAX技术请求数据，或发送数据到服务器进行处理。

访问控制:
某些网页可能需要用户登录，通过认证权限来获取访问特定内容的权限。

网页被存放在Web服务器上，并通过互联网使用HTTP或HTTPS协议来访问。用户通过Web浏览器输入网址或者通过搜索引擎找到并浏览网页。网页的集合组成了网站，而许多相关的网站则构成了互联网。

2.HTML概述

HTML，全称是超文本标记语言（HyperText Markup Language），是用于创建网页和网上应用的标准标记语言。HTML 不是一门编程语言，而是一种用于定义内容结构的标记语言。通过使用不同的标签和属性，HTML允许我们结构化内容，如段落、标题、链接、图像和其他多媒体元素。

以下是HTML的一些重要组成要素：

标签 (Tags):
HTML通过一系列的标签来组织内容，标签通常成对出现，如<p>和</p>用于定义一个段落。这些标签告诉浏览器如何格式化和显示内容。

元素 (Elements):
由一个开始标签，内容，和一个结束标签组成的整个结构称为一个元素。例如，<p>Hello World!</p> 是一个包含文本“Hello World!”的段落元素。

属性 (Attributes):
标签可以包含属性，属性提供了关于HTML元素更多的信息。比如<img src="image.jpg" alt="MyImage">中的src告诉浏览器图片文件的路径，而alt描述了图像的备用文本。

结构 (Structure):
HTML文档具有一定的结构，它以<!DOCTYPE html>开始来声明文档类型，接着是<html>标签，内含<head>和<body>两个部分。<head>通常包含元数据和链接到样式表的信息，而<body>则包含实际显示在网页上的内容。

超链接 (Hyperlinks):
使用<a>标签创建，允许用户点击跳转到另一个页面或页面的另一部分，如<a href="https://www.example.com">Visit Example.com</a>。

表单 (Forms):
通过<form>标签创建，允许用户输入数据并提交到服务器。

列表 (Lists):
有序列表<ol>和无序列表<ul>，用来组织列表项<li>。

多媒体 (Multimedia):
包括图像<img>、音频<audio>和视频<video>元素，用于嵌入媒体文件。

语义化 (Semantics):
HTML5引入了多种语义化标签，如<article>、<section>、<header>、<footer>和<nav>等，它们让网页结构更清晰，也有助于搜索引擎和辅助设备理解内容。

编写HTML代码时，一般使用纯文本编辑器或HTML编辑器，并保存为.html或.htm的文件扩展名。当这些文件通过网络服务器提供服务时，它们可以被浏览器访问并正确显示为网页。随着Web技术的发展，HTML也持续更新发布新的版本，其中HTML5是当前的主流标准。

3.HTML基本标签

HTML的基本标签构成了网页的框架和内容，以下是一些常用的HTML基本标签及其用途：

<!DOCTYPE html>:
声明文档类型，告诉浏览器这是一个HTML5文档。

<html>:
这个标签包裹了整个HTML文档的所有内容，是每个HTML页面的根元素。

<head>:
包含了所有的元数据（metadata），包括文档的标题、字符集声明以及链接到样式表和脚本的引用。

<title>:
定义网页的标题，这个标题会显示在浏览器的标题栏或页面的标签上。

<meta>:
定义页面的元数据，如指定页面的字符集（如 <meta charset="utf-8">）和为搜索引擎优化提供信息。

<body>:
包含了网页的所有可见内容，如文本、图像、视频、游戏等。

<h1> 至 <h6>:
定义标题，<h1> 是最高的等级，通常用于主要标题，而 <h6> 是最低的。

<p>:
定义一个段落。

<a>:
定义一个超链接，允许你链接到其他网页或页面内的某个部分。

<img>:
向网页插入一张图片。

<ul>:
定义一个无序列表，通常使用圆点作为列表项前的标记。

<ol>:
定义一个有序列表，使用数字或字母作为序列前缀。

<li>:
列出一个列表项，用于 <ol> 或 <ul> 标签内。

<br>:
插入一个换行符，用于文本内的换行而不开始新的段落。

<hr>:
插入一个水平线，通常用于内容分割。

<div>:
表示一个区块级容器，用于布局或分组内容，没有特定的语义含义。

<span>:
表示内联容器，用来标记文本的一部分或者文档的一小块内容，通常用于应用CSS样式或通过JavaScript实现某些效果。

<form>:
用于创建一个表单，用于用户输入和提交数据。

<input>:
创建输入字段，用户可以输入数据，如文本域、复选框、单选按钮等。

<button>:
定义一个按钮，用户可以点击进行操作。

这些标签是构建基本网页结构的要素，通过组合这些标签，可以创建丰富多样的网页内容和布局。

4.网站和主页

网站是指定位于互联网上的一组相关的网页，通常包含共享的域名或IP地址的集合，它们通过互联网公共访问。网站可以由个人、团体、企业或组织建立和维护，用于提供各种信息，如新闻、教育、商业、娱乐或社交等。

主页，又称为首页，特指一个网站中的默认或起始页面，它通常作为网站的门户，提供网站概览以及对其他网页的链接。用户在输入一个域名时，通常会首先看到这个页面。

以下是网站和主页的关键特点：

网站：

结构:
包括多个网页，分类归纳网站的内容。

互动性:
用户可以与网站交互，如浏览、搜索、购物、游戏玩乐或在论坛发帖等。

更新性:
网站内容可以定期或不定期更新，反映最新信息和动态。

托管:
网站需通过Web服务器进行托管，使得用户可以通过互联网来访问它。

域名:
每个网站通常都有一个独一无二的域名，方便用户访问。

导航:
设计有导航菜单帮助用户在不同的页面和内容之间进行导航。

主页：

门面:
作为网站的“面孔”，展示网站的品牌和核心价值。

导航中心:
包含指向网站其他部分的链接和导航元素。

概览:
提供网站内容的概要或引导，突出显示最紧要或最新的内容。

搜索功能:
主页常包含搜索栏，方便用户寻找网站上的特定内容。

用户引导:
可能包含特别提示、新闻滚动、特价信息或用户登陆入口。

优化:
为了提高用户体验，主页通常会进行搜索引擎优化（SEO）以及设备适配优化。

简而言之，网站可以被看作是一本书，而主页则相当于书的封面以及目录，它提供了对书内容的概括和链接到各个章节的途径。主页上的设计和信息组织对用户的第一印象以及网站的整体体验有很大影响

静态网页和动态网页

1.静态网页

静态网页是构成互联网的基础之一，它们是简单的、固定内容的网页。这些网页的内容在被创建时确定，并且除非手动编辑和更新HTML文件，否则每个用户访问时看到的都是相同的内容。静态网页通常使用HTML（超文本标记语言）、CSS（层叠样式表）和有时还包括JavaScript来增强页面的互动性和视觉效果。

特点

固定内容：静态网页显示的信息是预先编码好的，对所有用户都是相同的，不会根据用户的请求而发生变化。

快速加载：由于缺少后端处理，静态网页通常加载速度更快。

易于创建：相对于动态网站，静态网页更容易创建和托管，不需要数据库或服务器端脚本。

成本低廉：托管静态网页的成本一般比动态网页要低，因为它们不需要复杂的服务器或数据库支持。

易于缓存：静态网页方便被浏览器缓存，进一步提升访问速度。

适用场景
虽然静态网站功能有限，但它们非常适合以下用例：

个人或小型企业的展示页：当只需要展示基本信息如公司简介、联系方式、产品展示时，静态网站是一个成本有效的选择。
文档和手册：提供各种产品或服务的使用指南。
着陆页或营销活动页面：用于特定活动或产品的推广，这些页面通常不需要频繁更新。
博客或个人作品集：对于内容不经常更新的网站，静态页面可以很好地工作。

创建和维护
创建静态网页通常只需要HTML和CSS知识。HTML用于构建网页的结构，而CSS用于设计和布局。JavaScript可以增加页面的互动性，但并非必须。随着静态网站生成器（如Jekyll、Hugo、Gatsby）的出现，即使是非技术用户也可以轻松生成静态网页，这些工具可以自动从模板和标记语言（如Markdown）生成静态HTML页面。

静态网页的局限性在于它们无法提供像实时数据更新、用户登录、评论等动态网站的功能。为了更新网站内容，你需要编辑HTML文件并重新部署网站，这可能对需要频繁更新内容的网站来说不太实用。但对于许多用例来说，静态网页提供了一个简单、高效且成本低廉的解决方案。

2.动态网页

动态网页是一种可以根据用户的交互、输入或时间的变化提供不同内容的网页。与静态网页相比，内容不是固定的，而是可以动态生成和更新。在访问动态网页时，服务器上的应用程序会根据请求的需要实时生成HTML代码，然后发送给用户的浏览器。动态网页的表现力和功能通常要比静态网页丰富得多。

特点

交互性：允许用户参与内容的创造和修改，例如通过表单提交数据。

实时内容更新：可根据数据库中的数据变化或用户的输入动态显示内容。

个性化：能够根据用户的偏好、地理位置或使用历史提供个性化内容。

复杂功能：支持复杂的用户功能，如电子商务、在线账户管理、论坛、博客等。

技术组成
动态网站的构建通常涉及以下几个方面：

客户端脚本：运行在用户浏览器上的代码，如JavaScript和其框架（如React, Vue, Angular），用于提升用户体验。

服务器端脚本：处理服务器上应用程序的背后逻辑，如PHP, Ruby, Python, Node.js等。

数据库：用于存储网站数据，如MySQL, PostgreSQL, MongoDB等。

CMS（内容管理系统）：如WordPress、Joomla或Drupal，使非技术用户可以轻松管理和更新网站内容。

适用场景
动态网页非常适合以下情况：

需要用户注册和登录的网站：用户可以创建个人账户并接收定制化服务。

电子商务平台：可以根据库存和用户购物习惯提供实时信息。

论坛和社交网站：用户可以参与讨论并与其他用户互动。

需要频繁更新内容的网站：例如新闻网站或博客平台。

创建和维护
创建和维护动态网页通常比静态网页复杂。它涉及到服务器端编程，以及可能与数据库和用户接口的集成。随着时间推移，动态网站可能也需要更多的维护工作，比如更新系统、修补安全漏洞和优化数据库。

总之，动态网页为更深层次的用户参与和内容个性化提供了必要的技术支持。虽然它们的建设和维护成本更高，但动态网页的灵活性和强大功能是它们流行的关键所在。

3.动态网页语言

动态网页的开发通常依赖于多种编程语言和技术。这些语言可以分为两大类：客户端语言和服务器端语言。客户端语言主要运行在用户的浏览器上，而服务器端语言则在服务器上执行，用于处理应用程序的逻辑、与数据库交互等后端任务。

客户端（前端）语言:

JavaScript: 是动态网页开发中最重要的客户端脚本语言。它允许开发者在用户访问网页时，使页面动态改变内容、显示或隐藏信息、改变样式等。JavaScript还可以与HTML和CSS紧密集成，创建丰富的用户交互式体验。

HTML5: 虽不是编程语言，但作为网页内容的标准标记语言，HTML5引入了许多新特性，如支持音频和视频标签，更强的表单控件等，增强了网页的互动性。

CSS3: 同样不是编程语言，但它对于动态网页的布局和样式至关重要。CSS3引入了更多的样式选项和动画效果，使页面更加生动和响应式。

服务器端（后端）语言:

PHP: 一种广泛使用的开放源码脚本语言，主要用于服务器端的开发。PHP易于学习，且与多数数据库兼容，常用于动态内容、数据库操作和会话管理等。

Python: 由于其简洁的语法和强大的库支持，Python已成为Web开发的一个流行选择，特别是Django和Flask这样的框架让开发复杂的Web应用变得更简单。

Ruby: 以Ruby on Rails框架最为知名，它提倡“约定优于配置”的原则，使得开发速度加快，适合快速开发Web应用。

JavaScript (Node.js): Node.js让开发者可以使用JavaScript在服务器端运行代码，这意味着可以使用同一种语言同时编写客户端和服务器端代码，从而提高开发效率。

Java: 一种强类型的面向对象编程语言，因其高性能、跨平台能力被广泛应用于企业级网站和应用开发中。

.NET (C#): .NET是微软开发的一个平台，而C#是在该平台上开发Web应用的主要语言，广泛应用于企业级应用的开发。

选择哪种语言和技术栈主要取决于项目的具体需求、开发团队的熟悉程度和技术偏好。通常，一个动态网页的开发会结合使用多种技术和语言，以实现最佳的功能和性能。

moluxiangfenglo

关注

26
点赞
踩
22

收藏

觉得还不错? 一键收藏
0
评论
Web基础和HTTP协议

网页，通常被称为页面，是互联网上的基本构建块，它由标记语言（如HTML）编写而成，提供了网上信息和用户互动的平台。网页可以包含文本、图像、视频和其他多媒体内容，并且可以使用CSS（层叠样式表）进行美化和布局设计，以及JavaScript等脚本语言来实现交互功能。HTML结构HTML（超文本标记语言）是创建网页内容的标准标记语言。它定义了网页的结构，并允许作者使用超链接连接到其他页面。CSS样式CSS用于设置HTML元素的样式，控制布局和页面的外观。
复制链接

扫一扫