IT评测·应用市场-qidao123.com

标题: 前端web安全 [打印本页]
作者: 金歌    时间: 2025-2-21 09:12
标题: 前端web安全
一、黑盒扫描和白盒扫描

白盒扫描和黑盒扫描都是针对网络安全和应用程序安全的常用测试方法。
1、白盒扫描指的是测试人员具有关于体系内部结构和代码的全部或部分信息，是基于源代码的安全检测方法，它可以对源代码举行深度分析，从而发现潜伏的安全漏洞，因此可以更加精准地辨认安全问题。
2、黑盒扫描则是在没有体系内部结构和代码信息的环境下举行的测试，是一种不依赖源代码的安全检测方法。通过模拟攻击者举动并观察应用程序的相应来发现安全漏洞。黑盒测试更侧重于模拟实际攻击，以评估体系的抵御能力。
综合使用这两种方法可以更全面地评估体系的安全性，包括内部代码逻辑和外部攻击面。
二、浏览器缓存工作原理

浏览器缓存（Web caching）是一种技术，它答应浏览器暂存网页资源，如HTML页面、图片、JavaScript文件和样式表等。如许，当用户再次访问同一网页或跳转至使用相同资源的差别页面时，浏览器可以直接从本地缓存中读取数据，而不是每次都从服务器重新下载，从而加快页面加载速率，淘汰服务器的负载和带宽使用。

浏览器缓存的工作原理可以分为以下几个步骤：
此中的缓存过程具体可以分为两个部分：强制缓存和协商缓存。
强缓存

强缓存不会向服务器发送请求，直接从缓存中读取资源。通过设置相应头中的Expires或Cache-Control字段来控制资源的缓存时间。当资源的缓存时间未逾期时，浏览器直接从缓存中获取资源，不发送请求到服务器。
   Expires: HTTP/1.0的产品，值为一个绝对时间的GMT格式的时间字符串，代表资源的逾期时间。
Cache-Control: HTTP/1.1引入，优先级高于Expires，可以设置多个字段值：
● max-age: 资源在客户端缓存的最大时间（秒）。
● public: 可以被全部效户缓存。
● private: 只能被单个用户缓存。
● no-cache: 需要使用协商缓存来验证逾期资源。
● no-store: 全部内容都不会被缓存到缓存或Internet临时文件中。

  由于Cache-Control的优先级比expires高，那么直接根据Cache-Control的值举行缓存，意思就是说在600秒内再次发起该请求，则会直接使用缓存结果，强制缓存见效。
注：在无法确定客户端的时间是否与服务端的时间同步的环境下，Cache-Control相比于expires是更好的选择，以是同时存在时，只有Cache-Control见效。

状态码为灰色的请求则代表使用了强制缓存，请求对应的Size值则代表该缓存存放的位置，分别为from memory cache和 from disk cache。

协商缓存

当强缓存失效时，浏览器会发送请求到服务器，由服务器决定是否使用缓存的资源。通过设置相应头中的Last-Modified和ETag字段来控制资源的缓存。当资源的缓存时间逾期时，浏览器发送请求到服务器，服务器根据资源的Last-Modified或ETag值判断资源是否有更新，假如没有更新，则返回304状态码，告诉浏览器可以使用缓存。
     Last-Modified和If-Modified-Since

服务器收到该请求，发现请求头含有If-Modified-Since字段，则会根据If-Modified-Since的字段值与该资源在服务器的末了被修改时间Last-Modified做对比，若服务器的资源末了被修改时间Last-Modified大于If-Modified-Since的字段值，则重新返回资源，状态码为200；否则则返回304，代表资源无更新，可继续使用缓存文件。

ETag 和 If-None-Match

服务器收到该请求后，发现该请求头中含有If-None-Match，则会根据If-None-Match的字段值与该资源在服务器的Etag值做对比，一致则返回304，代表资源无更新，继续使用缓存文件；不一致则重新返回资源文件，状态码为200。

   注：Etag / If-None-Match优先级高于Last-Modified / If-Modified-Since，同时存在则只有Etag / If-None-Match见效
  缓存控制策略


实践建议

在JavaScript中，我们可以通过设置HTTP请求头来控制缓存策略。例如，使用fetch API时，可以如许设置：
  1. fetch('example.json', {
  2.   headers: {
  3.     'Cache-Control': 'no-cache'
  4.   }
  5. }).then(response => {
  6.   // 处理响应
  7. });
复制代码
在这个例子中，我们通过设置Cache-Control头为no-cache来确保请求不会被强缓存。
  1. fetch('example.json', {
  2.   headers: {
  3.     'Cache-Control': 'max-age=3600'
  4.   }
  5. }).then(response => {
  6.   // 处理响应
  7. });
复制代码
在这个例子中，我们通过设置Cache-Control头为max-age=3600，告诉浏览器该资源可以缓存一小时。

三、浏览器缓存安全问题

浏览器缓存是一种在本地保存资源副本的技术，用以加快网页的加载速率并淘汰服务器的负载。然而，不当的缓存管理可能会导致一系列安全问题。以下是对浏览器缓存安全问题的详细分析和防备措施。
敏感数据泄漏

当用户通过浏览器访问网站时，敏感信息如密码、个人信息、财务数据等可能被存储在本地缓存中。假如设备丢失或被恶意软件感染，这些信息可能会落入不法分子之手。
防备措施:


缓存诱骗

缓存诱骗是一种攻击，攻击者将恶意内容注入到缓存中，使得其他用户在访问时接收到篡改的资源。这种攻击可能导致用户下载恶意软件或被重定向到钓鱼网站。
防备措施:


缓存穿透

缓存穿透是指攻击者故意请求不在缓存中的资源，导致请求绕过缓存直接到达服务器，可能会造成服务器资源的太过斲丧。
防备措施:


旧版本资源的使用

假如浏览器缓存的资源没有及时更新，用户可能会继续使用包含安全漏洞的旧版本资源，从而使体系易受攻击。
防备措施:


四、其他常见漏洞

Web应用程序可能存在多种漏洞，下面列举一些常见的Web漏洞：
跨站脚本攻击 (XSS)

1、XSS的阐明

Cross-Site Scripting（跨站脚本攻击）简称 XSS，是一种代码注入攻击。攻击者通过在目的网站上注入恶意脚本，使之在用户的浏览器上运行。使用这些恶意脚本，攻击者可获取用户的敏感信息如 Cookie、SessionID 等，进而危害数据安全。
XSS 的本质是：用户提交的数据未经过滤，渲染到了HTML上，结果被浏览器当成了代码，浏览器无法分辨哪些代码是可信的，导致恶意代码被执行。在部分环境下，由于输入的限制，注入的恶意代码比较短。但可以通过引入外部的js文件，并由浏览器执行，来完成比较复杂的攻击策略。
全部效户输入的信息，都有可能成为注入的入口。在处置处罚输入时，以下内容需要注意：

2、XSS的危害

攻击者可以或许在用户的页面上运行恶意 JS ，就相当于取得了整个页面的浏览器上的控制权，攻击者通过XSS干的事变包括但不限于以下：
3、XSS的分类

根据攻击的泉源，XSS 攻击可分为存储型、反射型和 DOM 型三种。
4、防备XSS的方法

跨站请求伪造 (CSRF)

1、CSRF的阐明

CSRF（Cross-site request forgery）跨站请求伪造：攻击者诱导受害者进入第三方网站，在第三方网站中，向被攻击网站发送跨站请求。使用受害者在被攻击网站已经获取的注册凭证，绕过背景的用户验证，达到冒充用户对被攻击的网站执行某项操作的目的。

2、CSRF的危害

跨站请求伪造（CSRF）攻击具有多种危害，这些危害包括：
3、防备CSRF的方法

  1. <form action="/process" method="post">
  2.   <!-- 添加CSRF令牌 -->
  3.   <input type="hidden" name="csrf_token" value="随机生成的令牌">
  4.   <!-- 其他表单字段 -->
  5.   <input type="text" name="username" placeholder="用户名">
  6.   <input type="password" name="password" placeholder="密码">
  7.   <button type="submit">提交</button>
  8. </form>
复制代码
  1. app.post('/process', (req, res) => {
  2.   // 获取请求的来源
  3.   const origin = req.headers.origin;
  5.   // 检查请求的来源是否合法
  6.   if (origin === 'https://example.com') {
  7.     // 执行敏感操作
  8.     // ...
  9.     res.send('操作成功');
  10.   } else {
  11.     res.status(403).send('拒绝访问');
  12.   }
  13. });
复制代码
  1. app.get('/set-cookie', (req, res) => {
  2.     // 创建一个带有HttpOnly标志的Cookie
  3.     res.cookie('myCookie', 'cookieValue', {
  4.         httpOnly: true,
  5.         // 其他Cookie属性，如过期时间，域，路径等，可以在这里设置
  6.     });
  8.     res.send('HttpOnly Cookie已设置');
  9. });
复制代码
点击挟制

1、点击挟制的阐明

点击挟制又称UI-覆盖攻击，通过引诱用户举行鼠标点击操作，但结果实际的操作并不是用户本身的意愿，以是被称为点击挟制。攻击者使用 iframe 作为目的网页载体。iframe 是 HTML 标准中的一个标签，可以创建包含别的一个页面的内联框架，在点击挟制漏洞使用中重要用来载入目的网页。

2、点击挟制的危害

3、防备点击挟制的方法

  1. const express = require('express');
  2. const app = express();
  4. app.use((req, res, next) => {
  5.     res.setHeader('X-Frame-Options', 'DENY');
  6.     next();
  7. });
  9. // 其他路由和中间件
复制代码
  1. Content-Security-Policy: frame-ancestors 'self' example.com
复制代码
注入漏洞

1、注入漏洞阐明

注入漏洞是一种常见的网络安全漏洞，它答应攻击者将恶意数据或指令插入应用程序的输入，从而绕过正常的安全机制，执行恶意操作。以下是一些常见范例的注入漏洞：
2、注入漏洞的危害

注入漏洞具有严重的危害，因为攻击者可以使用这些漏洞执行恶意操作，导致以下问题：
3、防备注入漏洞的方法

服务器端请求伪造

1、服务器端请求伪造的阐明

服务器端请求伪造（Server-Side Request Forgery，SSRF）是一种安全漏洞，攻击者可以使用该漏洞来发送伪造的请求，使服务器发起对内部资源的请求，甚至攻击内部网络。
以下是服务器端请求伪造的一些特点和危害：
2、防备服务器端请求伪造的方法

为了防备服务器端请求伪造漏洞，可以采取以下措施：

五、常见安全漏洞处置处罚


1、代码混淆（Code Obfuscation）

代码混淆是一种通过改变源代码的结构和逻辑以增长代码复杂性、低落可读性，从而防止代码被轻松逆向工程或分析的技术。代码混淆旨在增长攻击者的难度，使其更难以理解和破解代码，代码混淆可以增长逆向工程的难度。
  1. var uglify = require('gulp-uglify');
  2. var ngAnnotate = require('gulp-ng-annotate')
  3. gulp.task('uglify-js',['root'],function(){
  4.     return gulp.src('src/**/*.js')  //指定混淆的文件路径
  5.                .pipe(ngAnnotate())  //处理angular依赖注入确保不受影响
  6.                .pipe(uglify())      //执行代码混淆
  7.                .pipe(gulp.dest('dist'))
  8. });
复制代码

2、加密算法：

加密算法是用于将数据转换为不可读或不可解密情势的数学方法，可以使用加密算法来加密源代码或关键数据。常见的算法包括AES、RSA等。这种方法需要在运行时解密代码，然后执行。
当涉及加密算法时，有许多差别的算法可供选择，具体取决于安全性需求、应用场景和性能要求。以下是几种常见的加密算法
  1. // 使用 CryptoJS 库进行对称加密
  2. const CryptoJS = require('crypto-js');
  4. const plaintext = 'Hello, World!';
  5. const secretKey = 'mySecretKey123';
  7. // 加密
  8. const ciphertext = CryptoJS.AES.encrypt(plaintext, secretKey).toString();
  10. // 解密
  11. const decryptedText = CryptoJS.AES.decrypt(ciphertext, secretKey).toString(CryptoJS.enc.Utf8);
  13. console.log('Original Text:', plaintext);
  14. console.log('Encrypted Text:', ciphertext);
  15. console.log('Decrypted Text:', decryptedText);
复制代码
  1. // 使用 Node.js 的 crypto 模块进行非对称加密
  2. const crypto = require('crypto');
  4. const plaintext = 'Hello, World!';
  6. // 生成密钥对
  7. const { publicKey, privateKey } = crypto.generateKeyPairSync('rsa', {
  8.     modulusLength: 2048,
  9. });
  11. // 加密
  12. const encryptedBuffer = crypto.publicEncrypt(publicKey, Buffer.from(plaintext));
  13. const encryptedText = encryptedBuffer.toString('base64');
  15. // 解密
  16. const decryptedBuffer = crypto.privateDecrypt(privateKey, encryptedBuffer);
  17. const decryptedText = decryptedBuffer.toString('utf8');
  19. console.log('Original Text:', plaintext);
  20. console.log('Encrypted Text:', encryptedText);
  21. console.log('Decrypted Text:', decryptedText);
复制代码
  1. const jsrsasign = require('jsrsasign');
  3. // 生成SM2密钥对
  4. const keypair = jsrsasign.KEYUTIL.generateKeypair("SM2");
  6. // 将公钥转换为Hex字符串
  7. const publicKeyHex = jsrsasign.KEYUTIL.getPEM(keypair.pubKeyObj, "PKCS8PUB").replace(/[\r\n]/g, '');
  9. // 加密
  10. const plaintext = "Hello, World!";
  11. const ciphertext = jsrsasign.KJUR.crypto.Cipher.encrypt(plaintext, publicKeyHex, "SM2");
  13. // 解密
  14. const decryptedText = jsrsasign.KJUR.crypto.Cipher.decrypt(ciphertext, keypair.prvKeyObj, "SM2");
  16. console.log("Plaintext:", plaintext);
  17. console.log("Ciphertext:", ciphertext);
  18. console.log("Decrypted text:", decryptedText);
复制代码
  1. // 使用 Node.js 的 crypto 模块进行哈希
  2. const crypto = require('crypto');
  4. const data = 'Hello, World!';
  6. // 创建哈希对象
  7. const hash = crypto.createHash('sha256');
  9. // 更新哈希对象
  10. hash.update(data);
  12. // 获取哈希值
  13. const hashValue = hash.digest('hex');
  15. console.log('Original Data:', data);
  16. console.log('Hash Value:', hashValue);
复制代码
3、依赖包问题

应用程序依赖的第三方库或组件可能包含已知的安全漏洞，下载依赖时，假如使用了不可信的或未经验证的源，可能会导致应用程序安装恶意依赖，从而引入漏洞。 攻击者可以使用这些漏洞来入侵应用程序， 使用过期或不安全的依赖版本可能暴露应用程序于已知漏洞的风险。开发团队应该定期更新依赖，并监控漏洞公告。
   lodash是一个现代的JavaScript实用程序库，提供模块化，性能和附加功能。 该软件包的受影响版本轻易受到原型污染。
函数defaultsDeep可能被诱骗使用构造函数有效负载添加或修改Object.prototype的属性。
  4.17.12版本之前的lodash 中 defaultsDeep 方法存在隐患：
  1. const payload = '{"constructor": {"prototype": {"test": "abc" }}}'
  2. _.defaultsDeep({}, JSON.parse(payload))
复制代码
如此一来，就触发了原型污染，原型中添加了自定义字段，修改了JavaScript 对象的原型（prototype）

要减轻依赖导致的Web安全漏洞问题，可以采取以下措施：

安全扫描漏洞需要更新项目依赖，我们可以通过以下命令查看版本



   注意：升级依赖要查看是否会影响项目功能，若升级后影响过大，需要评估升级本钱

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。



欢迎光临 IT评测·应用市场-qidao123.com (https://dis.qidao123.com/) Powered by Discuz! X3.4