杭州群游科技网站做的魔域,石家庄专业做网站,深圳网站建设服务平台,定制产品去哪个平台目录
JS原生开发-DOM树-用户交互
JS导入库开发-编码加密-逆向调试
思维导图 JS知识点#xff1a; 功能#xff1a;登录验证#xff0c;文件操作#xff0c;SQL操作#xff0c;云应用接入#xff0c;框架开发#xff0c;打包器使用等 技术#xff1a;原生开发#x…目录
JS原生开发-DOM树-用户交互
JS导入库开发-编码加密-逆向调试
思维导图 JS知识点 功能登录验证文件操作SQL操作云应用接入框架开发打包器使用等 技术原生开发DOM常见库使用框架开发VueNodeJS打包器(Webpack)等 安全原生开发安全NodeJS安全Vue安全打包器Webpack安全三方库安全问题等 JS原生开发-DOM树-用户交互 DOM 文档操作对象 浏览器提供的一套专门用来操作网页代码内容的功能实现自主或用户交互动作反馈 在Web开发中浏览器将HTML文档解析为DOM树的结构。DOM树由节点Nodes组成节点可以是元素节点、文本节点、注释节点等。每个节点都有与之相关联的属性、方法和事件。通过使用DOM您可以通过JavaScript或其他支持DOM的编程语言来访问和操作HTML文档的内容、结构和样式。您可以使用DOM提供的方法和属性来选择元素、修改元素的属性和内容、添加或删除元素以及响应用户交互等。 安全问题本身的前端代码通过DOM技术实现代码的更新修改但是更新修改如果修改的数据可以由用户来指定就会造成DOM-XSS攻击 1、获取对象 标签直接写 Class加上符号. id加上符号# h1 idmyHeader onclickgetValue()这是标题/h1
document.querySelector(h1)
document.querySelector(.id)
document.querySelector(#myHeader) 2、获取对象属性 h1 idmyHeader onclickgetValue()这是标题/h1
const h1document.querySelector(h1)
const idh1.id
console.log(id) 2、操作元素数据 innerHTML 解析后续代码 innerText 不解析后续代码 3、操作元素属性 可以通过 js 修改页面元素的内容属性文本等如下修改了页面中图片的 src实现了图片的变换 className src id等
img srciphone.jpg width300 height300/img
const srcdocument.querySelector(img)
src.srchuawei.png 随便下载两张照片放到之前的 js 目录下
创建 dom.html, 内容如下演示获取图片 src 和标签文本
h1 idmyHeader onclickupdate1()这是H1/h1
img srciphone.jpg width300 height300br
button onclickupdate()刷新/button
scriptfunction update(){const imgdocument.querySelector(img);console.log(img.src);}function update1(){const h1document.querySelector(h1);console.log(h1.innerText);}
/script 这里开始演示点击刷新修改图片和点击文本修改标签文本
!--h1 idmyHeader onclickupdate1()这是标题/h1--!--img srciphone.jpg width300 height300br--!--button onclickupdate()刷新/button--!--script--
!-- function update(){--
!-- const sdocument.querySelector(img)--
!-- s.srcjavascript:alert(‘XSS’);--
!-- //如果这里huawei.png为一个变量由用户传递决定那么就会造成DOM XSS--
!-- }--!-- function update1(){--
!-- const sdocument.querySelector(h1)--
!-- //s.innerText这是小迪br--
!-- s.innerHTMLimg src# onerroralert(1)--
!-- console.log(str)--
!-- }--
!--/script--!--h1 idmyHeader onclickupdate1()这是H1/h1--!--img srciphone.jpg width300 height300br--!--button onclickupdate1()刷新/button--!--script--
!-- function update(){--
!-- const imgdocument.querySelector(img);--
!-- console.log(img.src);--
!-- }--
!-- function update1(){--
!-- const h1document.querySelector(h1);--
!-- console.log(h1.innerText);--
!-- }--!--/script--
h1 idmyHeader onclickupdate1()这里是SuYou/h1img srciphone.jpg width300 height300brbutton onclickupdate()刷新/buttonscriptfunction update(){const imgdocument.querySelector(img);img.src huawei.png;console.log(img.src);}function update1(){const h1document.querySelector(h1);const str h1.innerText;console.log(str);// 迪总是置换了文本我让它点一下左移一下小把戏见笑见笑const first str[0];var remain str.substring(1,str.length);var new_str remain first;h1.innerText new_str; // innerText不解析后续代码只是当文本// h1.innerHTML h3 new_str /h3; // innerHTML不解析后续代码只是当文本}/script
此时点击 h1 刷新标题内容点击刷新按钮刷新照片 安全问题本身的前端代码通过DOM技术实现代码的更新修改但是更新修改如果修改的数据可以由用户来指定就会造成DOM-XSS攻击
如 update 中的 img.src, 如果这里的 huawei.png 为一个变量可以由用户传递决定那么就可能会造成 DOM XSS, 如下
h1 idmyHeader onclickupdate1()这是标题/h1img srciphone.jpg width300 height300brbutton onclickupdate()刷新/buttonscriptfunction update(){const sdocument.querySelector(img)s.srcjavascript:alert(‘XSS’);//如果这里huawei.png为一个变量由用户传递决定那么就会造成DOM XSS}function update1(){const sdocument.querySelector(h1)//s.innerText这是小迪brs.innerHTMLimg src# onerroralert(1)console.log(str)}
/script
点击刷新可见浏览器进行了过滤拦截 点击标题绕过
update1 函数通过 innerHTML 插入带有 onerror 事件的 img 元素这可能导致 XSS跨站脚本攻击漏洞。在实际应用中需要谨慎处理用户提供的内容以防止安全漏洞。 实测网易云翻译可以使用带外dns造成数据库ip泄露 发现输入后即使不点翻译页面仍然发生变化猜测有 js 参数可控并且做了替换怀疑可以是DOM XSS 测试时使用 dnslog在输入内容中添加。dnslog.cn 是 dnslog 生成的域名自行替换 img srchttp://dnslog.cn 在浏览器开发者工具 network 中发现页面确实向 dnslog.cn 发送了请求。 在 source 中搜索关键字 querySelector 发现可疑 js 文件 translate.js 直接在翻译中输入 img 标签会被实体化即被过滤但是当鼠标放到右侧滑过之后左侧 img 标签成功执行可能是使用了 js 鼠标滑过事件 (盲猜一波类似 mouseover 之类的事件)从左到右被过滤了从右到左没有所以导致了成功执行 JS导入库开发-编码加密-逆向调试 md5 !-- 引入 md5.js 脚本 --
script srcjs/md5.js/script!-- JavaScript 代码 --
script// 定义字符串变量var str1 xiaodi jichu No1;// 使用 md5.js 中的 md5 函数对字符串进行加密var str_encode md5(str1);// 输出加密后的字符串到控制台console.log(str_encode);
/script输出afe5119ec0ab46b55432fc5e24f1dc62 SHA1 !-- 引入 crypto-js.js 脚本 --
script srcjs/crypto-js.js/script!-- JavaScript 代码 --
script// 定义字符串变量var str1 xiaodisec;// 使用 CryptoJS.SHA1 函数对字符串进行 SHA-1 加密并将结果转为字符串var str_encode CryptoJS.SHA1(str1).toString();// 输出加密后的字符串到控制台console.log(str_encode);
/script输出ce22eaa1c5ebd3dfb3f4474b66f6d3612d4cb3ee HMAC !-- 引入 crypto-js.js 脚本 --
script srcjs/crypto-js.js/script!-- JavaScript 代码 --
script// 定义密钥和字符串变量var key key;var str1 xiaodisec;// 使用 CryptoJS.HmacSHA256 函数生成 HMAC-SHA256 散列var hash CryptoJS.HmacSHA256(key, str1);// 将散列结果转为十六进制字符串var str_encode CryptoJS.enc.Hex.stringify(hash);// 输出加密后的字符串到控制台console.log(str_encode);// 输出示例11a7960cd583ee2c3f1ed910dbc3b6c3991207cbc527d122f69e84d13cc5ce5c
/script输出08ac6dc8773bd34dcadeffb2b90a8b8f5be9453a9dce7cf09d4da2fcb363d9e7 AES script srcjs/crypto-js.js/script
script typetext/javascriptvar aseKey 12345678 // 定制秘钥长度必须为8/16/32位, 长度不一致也没问题var message xiaodisec; // 需要加密的内容// 加密 DES/AES切换只需要修改 CryptoJS.AES CryptoJS.DESvar encrypt CryptoJS.AES.encrypt(message, CryptoJS.enc.Utf8.parse(aseKey), // 参数1密钥, 参数2加密内容{mode: CryptoJS.mode.ECB, // 为DES的工作方式padding: CryptoJS.pad.Pkcs7 // 当加密后密文长度达不到指定整数倍(8个字节、16个字节)则填充对应字符}).toString(); // toString转字符串类型console.log(encrypt);var decrypt CryptoJS.AES.decrypt(encrypt, CryptoJS.enc.Utf8.parse(aseKey), // 参数1密钥, 参数2解密内容{mode: CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7}).toString(CryptoJS.enc.Utf8); // toString转字符串类型,并指定编码console.log(decrypt); // xiaodisec
/script输出g4ohopaiYA34XXLsV92Udw xiaodisec DES script srcjs/crypto-js.js/script
script typetext/javascriptvar aseKey 12345678 // 定制秘钥长度必须为8/16/32位 长度不一致也没问题var message xiaodisec; // 需要加密的内容// 加密 DES/AES切换只需要修改 CryptoJS.AES CryptoJS.DESvar encrypt CryptoJS.DES.encrypt(message, CryptoJS.enc.Utf8.parse(aseKey), // 参数1密钥, 参数2加密内容{mode: CryptoJS.mode.ECB, // 为DES的工作方式padding: CryptoJS.pad.Pkcs7 // 当加密后密文长度达不到指定整数倍(8个字节、16个字节)则填充对应字符}).toString(); // toString转字符串类型console.log(encrypt); // 控制台打印 CDVNwmEwDRM//解密var decrypt CryptoJS.DES.decrypt(encrypt, CryptoJS.enc.Utf8.parse(aseKey), // 参数1密钥, 参数2解密内容{mode: CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7}).toString(CryptoJS.enc.Utf8); // toString转字符串类型,并指定编码console.log(decrypt); // 控制台打印 i am xiaozhou ?/script输出WVSwdlodMcV2n1FH72uXgw xiaodisec RSA script srcjs/jsencrypt.js/script
script typetext/javascript// 公钥 私匙是通过公匙计算生成的不能盲目设置var PUBLIC_KEY -----BEGIN PUBLIC KEY-----MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBALyBJ6kZ/VFJYTV3vOC07jqWIqgyvHulv6us/8wzlSBqQ2eOTX7s5zKfXY40yZWDoCaIGktP/sc0D6dQzjaxECAwEAAQ-----END PUBLIC KEY-----;//私钥var PRIVATE_KEY -----BEGIN PRIVATE KEY-----MIIBVQIBADANBgkqhkiG9w0BAQEFAASCAT8wggE7AgEAAkEAvIEnqRn9UUlhNXe84LTuOpYiqDK8e6W/q6z/zDOVIGpDb545NfuznMp9djjTJlYOgJogaT60/xzQPp1DONrEQIDAQABAkEAu7DFsqQEDDnKJpiwYfUE9ySiIWNTNLJWZDN/Bu2dYIV4DO2A5aHZfMe48rga5BkoWq2LALlY3tqsOFTe3M6yoQIhAOSfSAU3H6jIOnlEiZabUrVGqiFLCb5Ut3Jz9NN5p59AiEA0xQDMrxWBBJ9BYq6RRY4pXwa/MthX/8Hy3GnvNw/yUCIG/3Ee578KVYakq5pih8KSVeVjO37C2qj60d3Ok3XPqBAiEAqGPvxTsAuBDz0kcBIPqASGzArumljkrLsoHHkakOfU0CIDuhxKQwHlXFDO79ppYAPcVO3bph672qGD84YUaHFpQ-----END PRIVATE KEY-----;//使用公钥加密var encrypt new JSEncrypt();//实例化加密对象encrypt.setPublicKey(PUBLIC_KEY);//设置公钥var message xiaodisec // 需要加密的数据var encrypted encrypt.encrypt(message);//对指定数据进行加密console.log(encrypted) // JQ83h8tmJpsSZcb4BJ3eQvuqIAs3ejepcUUnoFhQEvum8fA8bf1Y/fGDO1bSIVNJF6EOZKe4wa0njv6aOar9w//使用私钥解密var decrypt new JSEncrypt(); // 创建解密对象decrypt.setPrivateKey(PRIVATE_KEY); //设置私钥var uncrypted decrypt.decrypt(encrypted); //解密 xiaodisecconsole.log(uncrypted);
/script输出Fw1H5KoC6zZnwAzLee8z5ubmQYSqaVqu711VINBavYT9bkWpzxUtZHmbSUvLbuCblPO96NdfoQHtPe9TURo6A xiaodisec ‘admin’ OR 11 — ‘的含义 首先让我们逐步解析这个语句的含义。在MySQL中’admin’表示一个字符串常量OR关键字表示逻辑或运算符而11是一个恒定为真的条件。最后的’– ‘表示注释使得引号后的内容成为注释而不被解析。 换句话说这个语句在条件中使用了11这个条件总是为真因此结果总是返回真。这就可以绕过许多条件验证让用户以admin的身份执行相关操作。 举个例子假设SQL语句如下 SELECT * FROM users WHERE username admin OR 11 -- AND password 123456这个语句的意图是从users表中选择username为’admin’且password为’123456’的记录。然而由于’admin’ OR 11 — ‘这个条件恒为真实际上会选择所有的记录而不仅仅是admin账户。 若 payload 的测试数据为 admin ‘11, 但网站接受的是加密数据你直接发明文过去肯定是没用效果的需要将 payload 也以相同的加密算法加密发送才会有效 逆向调试加密算法 打开页面选择密码右击鼠标打开检查,找到相关id值edtPassWord并进行搜索$(#btnPost).click(function() 加#后证明是想取id值中的edtPassWord 加密方式 分析代码过程发出疑问如果加密格式不显示出来怎样判断加密的方式是什么 可以借助检查的控制台尝试输入获取加密后的密码值再和提交表单的加密值进行比对若一致则证明识别出。一般安全防护比较强的不会把运行的所以东西全加载到浏览器上 断点调试一般安全防护比较强的不会把运行的所有东西全加载到浏览器上所以要执行断点调试 https://my.sto.cn/ 打开页面选择密码右击鼠标打开检查找到相关id值numPassword并进行搜索 找到密码的加密格式但是没有明文展现出来 采用之前的方式在控制台中输入相应的代码encodeURI(encrypt.encrypt(numPassword))报错encrypt is not defined有一些文件只在服务器本地执行不会加载到浏览器中 说明这部分文件是放在浏览器上的并不是在本地的只有用到的时候才会传输到本地执行 必须采用调试断点的方式来通过服务器获取其执行文件然后修改对应的返回密文即可 对应地方打上断点点击登录进入断点调试发现右侧出现输入的账号密码内容 点击最右侧按钮进入调试再次打开控制台并输入encodeURI(encrypt.encrypt(numPassword))发现成功回显加密后的密码 这时候可以执行是因为加密的文件已经被放入浏览器的内存中 思维导图
