Web Day 1

Web Day 1

基本了解

1.前端的开发工具：vscode, vim

2.设计语言：HTML,css以及JavaScript

3.前后端分离：性能问题&学习成本

4.前后端的走向：

  • ​ 前端：页面表现，速度流畅，兼容性，用户体验等等

  • ​ 后端：三高（高并发，高可用，高性能），安全，存储，业务等等

HTML（构建页面的标记性语言）

1.标签：

它不是HTML标签，而是指示Web浏览器关于使用哪个HTML版本进行编写的指令

2.HTML头部部分：标签

涉及页面标题，字符集，样式，链接等内容

 <!doctype>
<html>
 <head>
  <meta charset="utf-8" /> 
  <title>Hello world</title>  
 </head>

 <body>
     
     <h1>我是标题1</h1>
     <h2>我是标题2</h2>
     <h3>我是标题3</h3>

 </body>
    
</html

title:页面标题必须存在

base：为所有链接指定默认地址

link：定义文档与外部资源直接的关系

style:定义样式信息

script：定义客户端脚本，比如JavaScript

meta：定义关于HTML文档的元数据，用于规定页面的描述，关键词。文档的作者等。搜索引擎会利用meta元素的name和content属性来索引页面

3.HTML主体部分：标签body

浏览器展示给用户的内容，包括标题，文本，段落，链接，图片，媒体等，所有的页面内容都有HTML主体部分标签来实现

<p>hello</p>                                       标识一个段落
<a href= "url" >text</a>                           标识一个链接文本
<ol><ul><li>                                       列表项相关
<table><tr><td>                                    表格项相关
<img>                                              标识一个图片信息
<b><i>                                             字体相关标签
<form><input>                                      表单相关标签

标签之间可按照规则嵌套。

4.HTML标签/元素/属性/

  • 标签

    HTML页面由标签和内容组成，标签一般是成对出现，由开始和结束标签组成

<p></p>
<img/>

  • 元素

    HTML元素指的是开始标签到结束标签的所有代码，包括开始结束标签

<p>hello</p>

  • 属性

    属性一般描述于开始标签中，用于对元素提供附加信息

<img src="image/snake.png" width=30% height=30% alt="图片加载失败"/>

css

  1. 表示或者渲染HTML

  2. 按下f12,debug窗口里的style，为css文件

javascript

  1. 是一种可以插入HTML页面的语言，和前端安全有着重要的联系

  2. 作为一种脚本语言，由它引申出的xss攻击，文件上传漏洞，常年占据OWASP TOP 10

    OWASP TOP 10（OWASP十大应用安全风险）

    • TOP1-注入

    • TOP2-失效的身份认证和会话管理（破损认证）

    • TOP3-XSS（跨站脚本攻击）

    • TOP4-不安全的对象直接引用

    • TOP5-跨站请求伪造（CSRF）

    • TOP6-安全配置错误

    • TOP7-限制URL访问失败（缺少功能级访问控制）

    • TOP8-未验证的重定向和转发

    • TOP9-应用已知漏洞的组件

    • TOP10-敏感信息暴露

  3. Node.js

    简单的来说，node.js就是运行在服务端的javascript

HTTP协议

HTTP协议定义了Web客户端如何从Web服务器请求Web页面，以及服务器如何把Web页面传送给客户端

1.客户端连接到WEB服务器

一个HTTP客户端，通常是浏览器，与Web服务器的HTTP端口（默认为80）建立一个TCP套接字连接

2.发送HTTP请求

通过tcp套接字，客户端向Web服务器发送一个文本的请求报文，一个请求报文由请求行，请求头部，空行和请求数据四部分组成

3.服务器接受请求并返回Http响应

web服务器解析请求，定位请求资源，服务器将资源复本写到TCP套接字，由客户端读取，一个响应由状态行，响应头部，空行（请求空行）和响应数据（请求体）4部分组成

4.释放连接TCP连接

若connection模式为close,则服务器主动关闭TCP连接，客户端被动关闭连接，释放·TCP连接。

若connection模式为keep active,则该连接会保持一段时间，在该时间内可以继续接收请求。

5.客户端浏览器解析HTML内容

HTTP协议概述

HTTP 对 TCP 连接的使用，分为两种方式：俗称“短连接”和“长连接” ；HTTP/1.1 默认使用长连接(持久化连接)

与HTTPS的主要区别

HTTP是明文传输；HTTPS是SSL加密传输

HTTP是无状态的，简单但不安全；HTTPS需要身份认证，加密传输，比HTTP安全

当你输入一个网址，点击访问，会发生什么？ #

查找DNS记录

  1. 查看浏览器缓存
  2. 查看系统缓存
  3. 查看路由器缓存
  4. 查找ISP DNS缓存
  5. 递归搜索。根据网址，发送一个DNS请求，UDP请求，端口为543，会请求一个DNS服务器，DNS服务器会不断递归查找这个网址的IP

建立连接

  1. 跟获取到的IP建立TCP连接，在TCP连接(80端口)上发送HTTP报文；根据规则， 只有低层协议建立之后才能，才能进行高层协议的连接
  2. 发送请求行，GET /dir/xx.php HTTP/1.1
  3. 发送请求头，浏览器发送一行空白行来告知服务器结束请求头信息发送
  4. 服务器响应， HTTP/1.1 200 OK（协议版本号和HTTP状态码）
  5. 服务器发送响应头，服务器自己的相关信息（同样用空白行表示结束响应头）
  6. 服务器向浏览器发送数据， 以Content-Type响应头信息所描述的格式发送用户所请求的实际数据
  7. 服务器关闭TCP连接，如果请求头或响应头加了这行 Connection:keep-alive 代码，会保持连接

请求方法

GET：用于请求已被URL识别的资源

POST：用于向服务器传输数据，例如提交表单、文件上传

OPTIONS：查询相应URL支持的HTTP方法

HEAD： 获得报文首部，与GET方法类似，只是不返回报文主体，一般用于验证URI是否有效

PUT： 上传文件，报文主体中包含文件内容，保存到对应URL位置

DELETE：删除文件，与PUT方法相反，删除对应URI位置的文件

TRACE： 用于诊断，响应中返回收到请求消息的具体内容

get与post都是最常见的HTTP方法，从本质上说，都为TCP连接

  1. 对于访问资源，通常为get
  2. 登陆行为（隐私性）post

Web安全溯源

  • Web安全的本质是信任问题，换句话说，来自前端的输入是不可信的

Web渗透工具

  • 客户端应用：
  1. Burpsuite:攻击Web应用程序的集成平台框架
  2. Curl：使用url的形式传输数据
  3. Postman：网页调试工具，发送网页

  • 浏览器插件：

    1. HAckBar：火狐浏览器插件
    2. Wappalyzer：了解网站架构

    ​

任务：下载这些工具并学会使用

posted @ 2021-01-23 18:50  薛动谔  阅读(99)  评论(0)    收藏  举报