前端安全相关

发布时间:2024年01月17日
  1. 请求后端接口必须带上sign

在这里插入图片描述
以上主要是解决:除了数据泄露外,一些重要功能的接口如果没有做好保护措施也会被恶意调用造成DDoS、条件竞争等攻击效果

一些营销活动类的Web页面,领红包、领券、投票、抽奖等活动方式很常见。此类活动对于普通用户来说应该是“拼手气”,而对于非正常用户来说,可以通过直接刷活动API接口的这种“作弊”方式来提升“手气”。这样对普通用户来说就很不公平

  1. 登录密码使用sha256加密后传给后端

首先我们先说一下为什么选择sha256,而不是Aes,md5:

sha256Aes
对称加密算法哈希算法
不可逆性可逆性
不需要存储密钥需要存储密钥

对密码进行加密时,通常使用哈希函数而不是对称加密算法。因此,对密码进行加密选择SHA-256这样的哈希算法更为常见和推荐。这是因为哈希算法是单向的(不可逆),而对称加密算法是可逆的。

安全性比较:

AES加密:安全性主要依赖于密钥的保密性和密钥长度。较长的密钥长度提供更高的安全性。目前,AES-256被认为是非常安全的。

SHA-256哈希:SHA-256是一个强大的哈希算法,提供较高的抗碰撞性,即相同的哈希值几乎不可能由不同的输入产生。然而,哈希碰撞攻击的发展可能对其安全性产生一定影响。

MD5:是一种哈希函数,它生成128位(16字节)的散列值,通常以32个十六进制数字的形式表示。MD5 曾经是广泛使用的哈希算法,但由于其存在碰撞(collision)漏洞和对抗性较弱,已经不再被推荐用于安全性要求较高的场景。

前端目前主要用crypto-js来实现加解密:

Crypto-JS是一个纯JavaScript编写的密码学库,提供了许多常见的加密算法,如AES、DES、Triple DES、Rabbit、MD5、SHA-1、SHA-256等。它的目标是在浏览器中提供安全的加密算法实现。

以下是Crypto-JS的一些主要特点和用法:

  1. 多种算法支持: Crypto-JS支持多种对称和哈希算法,使其成为一个全面的密码学工具库。

  2. 简单易用: 它提供了简单易用的API,使得在JavaScript中使用密码学算法变得相对容易。这对于在浏览器中进行客户端加密或在Node.js环境中进行服务器端加密都很有用。

  3. 模块化: Crypto-JS采用模块化设计,你可以选择性地只引入需要的模块,减小库的体积。

  4. 与标准兼容: 它的API设计与Web Crypto API标准相似,这使得在各种环境下进行加密操作更加一致。

  5. 容易集成: 由于是纯JavaScript实现,可以轻松地在浏览器中嵌入,也可以在Node.js环境中使用。

以下是一个简单的Crypto-JS使用示例,演示了在浏览器中使用AES加密:

// 引入 CryptoJS 库
var CryptoJS = require("crypto-js");

// 定义密钥和明文
var key = CryptoJS.enc.Utf8.parse("1234567890123456");
var plaintext = CryptoJS.enc.Utf8.parse("Hello, Crypto-JS!");

// 进行 AES 加密
var ciphertext = CryptoJS.AES.encrypt(plaintext, key, {
    mode: CryptoJS.mode.ECB,
    padding: CryptoJS.pad.Pkcs7
});

// 输出加密后的结果
console.log("Ciphertext: " + ciphertext.toString());
  1. vue.config.js中配置防爬虫文件

	{
	   from: path.resolve(__dirname, './public/robots.txt'), //防爬虫文件
	   to: './' //到根目录下
	}

虽然这样能防止爬取,但我们的代码还是能被调试,接下来我们要防止调试:

  1. 禁用开发者工具

监听是否打开开发者工具,若打开,则直接调用JavaScript的window.close( )方法关闭网页

① 监听F12按键、监听Ctrl+Shift+I(Windows系统)组合键、监听右键菜单,监听Ctrl+s禁止保存至本地,避免被Overrides。


<script>
 
    //监听F12、Ctrl+Shift+i、Ctrl+s
    document.onkeydown = function (event) {
        if (event.key === "F12") {
            window.close();
            window.location = "about:blank";
        } else if (event.ctrlKey && event.shiftKey && event.key === "I") {//此处I必须大写
            window.close();
            window.location = "about:blank";
        } else if (event.ctrlKey && event.key === "s") {//此处s必须小写
            event.preventDefault();
            window.close();
            window.location = "about:blank";
        }
 
    };
 
    //监听右键菜单
    document.oncontextmenu = function () {
        window.close();
        window.location = "about:blank";
    };
</script>

② 监听窗口大小变化


<script>
 
    var h = window.innerHeight, w = window.innerWidth;
    window.onresize = function () {
        if (h !== window.innerHeight || w !== window.innerWidth) {
            window.close();
            window.location = "about:blank";
        }
    }
</script>

③ 利用Console.log

<script>
 
    //控制台打开的时候回调方法
    function consoleOpenCallback(){
        window.close();
        window.location = "about:blank";
        return "";
    }
 
    //立即运行函数,用来检测控制台是否打开
    !function () {
        // 创建一个对象
        let foo = /./;
        // 将其打印到控制台上,实际上是一个指针
        console.log(foo);
        // 要在第一次打印完之后再重写toString方法
        foo.toString = consoleOpenCallback;
    }()
</script>

无限debugger反调试


<script>
 
    function consoleOpenCallback() {
        window.close();
        window.location = "about:blank";
    }
 
    setInterval(function () {
        const before = new Date();
        (function(){}).constructor("debugger")();
        // debugger;
        const after = new Date();
        const cost = after.getTime() - before.getTime();
        if (cost > 100) {
            consoleOpenCallback();
        }
    }, 1000);
</script>

好了,今天就分享到这了,觉得博主写的有帮助的麻烦点个赞!!!

文章来源:https://blog.csdn.net/m0_46365130/article/details/135642410
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。