网页安全之页面禁用复制粘贴

最新推荐文章于 2024-04-22 16:16:50 发布

19年，重新开始写

最新推荐文章于 2024-04-22 16:16:50 发布

阅读量1k

点赞数 1

分类专栏： web安全文章标签：安全

本文链接：https://blog.csdn.net/qq_27905183/article/details/62236077

版权

web安全专栏收录该内容

7 篇文章 0 订阅

订阅专栏

类似于百度文库这样的网站，都是将复制粘贴功能禁用的，只有登录的用户才能够使用。在开发中，为了网页的安全，我们也可以设置页面禁用复制和粘贴的功能

实现的方式很简单，就是自定义页面的复制和粘贴事件，取消默认事件即可

实现代码

<html>
    <head>
        <title>个人网页</title>
        <meta .../>
    </head>
    <body>
        <!--核心代码-->
        <script>
            window.onload = function(){
                document.body.oncopy = function(){
                    prompt("需要登录才能够使用复制功能");
                    return false;
                };
                document.body.onpaste = function(){
                    prompt("需要登录才能够使用粘贴功能");
                    return false;
                };
                //当选中页面中的任何对象时触发onselectstart事件
                //对FF浏览器不起作用，但是QQ浏览器倒是起作用的说
                document.body.onselectstart = function(){
                    console.log("未登录，无法选中目标");
                    return false;
                };
</html>

oncopy和onpaste比较少见的两个事件，但是又比较实用，相关的另一个使用的地方就是密码框的安全性增强，虽然h5针对密码输入新增了type=”password”的密码输入框，不过还是可以将这些掩码复制过来，然后放在外面显示，当用户在一个网站记住密码时，而这个网站又被别人用同一个电脑去登录，就会暴露了用户的密码，因此这时候我们可以取消密码输入框的复制和粘贴

<form method="post" action="...">
    <label for="username">username:</label>
    <input type="text" name="username" placeholder="please input your username:" /><br />
    <label for="password">password:</label>
    <input type="password" name="password" placeholder="please input your password:" oncopy="return false;" onpaste="return false;" style="font-family:wingwangs;" /><br />
    <button type="submit" onclick="this.disabled=true;this.form.submit();">登录</button>
    <span>  </span>
    <button type="reset">重置</button>
</form>

19年，重新开始写

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
网页安全之页面禁用复制粘贴

类似于百度文库这样的网站，都是将复制粘贴功能禁用的，只有登录的用户才能够使用。在开发中，为了网页的安全，我们也可以设置页面禁用复制和粘贴的功能实现的方式很简单，就是自定义页面的复制和粘贴事件，取消默认事件即可实现代码<html> <head> <title>个人网页</title> <meta .../> </head> <body>
复制链接

扫一扫