html静态网站登陆验证,静态页面js加密URL密码验证
随手写的一个静态HTML页面JS加密URL,密码验证的jQuery插件
点击查看演示
HTML部分:
- 密码为passcode的链接测试
- 密码为mm2的链接测试
增加mrel属性,写入真实页面地址前缀,如真实页面地址为shang_mmpage0.html ,mrel里的地址写为shang.html.
CSS部分(主要为密码验证框的样式):
/* 密码框样式 */
.mm{cursor:pointer; position:relative;}
.passbox{position:relative; background:#f8f9fe; border:1px solid #e2e2e2; display:block; width:180px; height:80px; padding:10px 20px; z-index:999; border-radius:4px; font-size:12px;}
.passbox input{display:inline; width:120px; margin-top:10px; padding:3px 0px; background-color:transparent; border:1px solid #ccc;}
.passbox .btn{ display:inline-block; padding:0px 15px; height:25px; border:1px solid #ccc; background-color:#000; color:#fff; cursor:pointer; margin-top:3px; position:relative; top:-3px; border-radius:7px; }
.passbox .close{position:absolute; top:2px; right:10px; left:auto; cursor:pointer; font-family:Arial; color:#d92020; font-weight:bold; font-size:15px;}
.mpop{padding-left:5px; color:#ff0101;}
/* 密码框样式结束*/
JS部分:
(function($){
$.fn.jsPass=function(options){
var defaults={
passtag:".mm",
passcode:"passcode",
pagetagname:"_mmpage0.html"
};
var opts=$.extend(defaults,options);
var win_href=window.location.href;
var win_searchnum=win_href.lastIndexOf("/");
var win_path=win_href.substr(0,win_searchnum+1);
var mmcode=opts.passcode,ele=this.find(opts.passtag);
ele.each(function(i){
$(this).click(function(e){
var ele_url=$(this).attr("mrel");
var ele_sublength=ele_url.length-5;
var ele_href=win_path+ele_url.substr(0,ele_sublength)+opts.pagetagname;
var ele_passbox=$(".passbox");
if(ele_passbox.length==0){
var ele_parent=$(this).parent("li");
ele_parent.append("输入密码:确定X");
};
$(".passbox").find(".close").click(function(){
$(".passbox").detach();
});
$(".passbox").find(".btn").click(function(){
var input_val=$(".passbox").find("input").val();
if(input_val==mmcode){
$(".passbox").detach();
window.open(ele_href);
}else{
$(".passbox").find(".tip").html("密码错误!");;
}
});
});
});
}
})(jQuery)
使用方法:
$(function(){
$("body").jsPass();
$("body").jsPass({
passtag:".mm2", //加密码的元素可选(jQ选择器名)
passcode:"mm2", //密码(字符串)
pagetagname:"_page2.html" //加密码页面后缀
});
/*
以上参数都为可选,以下为默认的参数
passtag:".mm",
passcode:"passcode",
pagetagname:"_mmpage0.html" */
})
主要实现方式为页面内隐藏真实URL,由JS代码拼接后缀字符串组合为真实URL地址。通过密码验证成功打开真实URL地址。
最后将所有的JS代码加密压缩,达到静态页密码验证功能。
当然用JS来进行加密验证并不可能达到真正的加密,以上代码只作试验。
html静态网站登陆验证,静态页面js加密URL密码验证相关推荐
- MD5加密及密码验证
MD5加密是常用的加密算法.可以对任意字符串的进行加密.生成16位字符数组. 密码验证:将输入的密码进行MD5加密转换后的字符串与数据库的密码进行比对.相等则验证通过. 1 package utils ...
- html js验证登录页面,js判断登录与否并确定跳转页面的方法
本文实例讲述了js判断登录与否并确定@R_384_404@面的方法.分享给大家供大家参考.具体如下: 使用session存储,确定用户是否登录,从而确定页面跳转至哪个页面. 判断本地有无custome ...
- php中js验证表单,js实现表单验证
直接上代码/** * 验证表单内容 * required 必填项 * email 邮箱 * number 数字 * chinese 汉字 * idcode * phone 电话 * mobi ...
- js根据url获取html页面,JS 通过url地址栏获取html页面名称
有的时候需要获取页面名称,为此我在这里封装了一个方. 一.分别根据传递不同的参数,获取到html页面的名称. 通过传递参数,获取到html页面的名称:参数params 以下是参数解释说明 (1)par ...
- js 加密url java_js 对 URL 参数进行 加密 解密
1.我从这个页面 ,通过以下URL跳转到另一个页面,把参数加密,下面对参数 aid=970 进行加密 var aid=970; window.location.href="/apply ...
- python最简单的账号密码验证_Python之简单的用户名密码验证
#Author jack # _*_ coding: utf-8 _*_ #date 2019-08-14 ''' 作业一:编写登录接口 输入用户名密码 认证成功后显示欢迎信息 输错三次后锁定 ''' ...
- html5什么是动态页面,举例说明什么是动态网站、静态网站
记得有一次和一朋友散步,他问到什么是动态网页.什么是静态网页.动态网页与静态网页有什么区别.当时我的回答似乎并没有让他真的明白到底什么是动态.什么是静态,所以今天想在这篇文章中详细的举例说明什么是动态 ...
- 页面静态化优缺点_静态网站生成器的优缺点
页面静态化优缺点 很久以前,人们在遥远的互联网上手工建造自己的网站,将每个HTML标签都放在工匠的精心照顾下. 他们花了一整天的时间思考诸如"我应该使用<b>还是完全使用< ...
- hexo静态网站部署到腾讯云cos
hexo支持很多部署方案,最直接的就是部署在GitHub Pages服务上,国内gitee.coding等代码托管平台也都支持静态网站服务,而且免费. 但是GitHub在国内访问不太稳定,国内的代码托 ...
最新文章
- HDU 1853 MCMF
- python多线程爬虫 爬取多个网页_Python 多线程抓取网页
- 在 windows 命令行下快速检测与排除网络故障
- mysql load data into_MySQL 之 LOAD DATA INFILE 快速导入数据
- C# 基础知识 (二).独特的知识及用法篇
- WPF-003 popup实现下拉列表的问题
- ASP.NET 服务器控件授权
- mysql开启慢查询日志及查询--windows
- MySql索引的原理
- 动态新增表字段_制作动态的数据透视表(一):定义名称法创建数据透视表
- 机器人码垛手持式编程_FANUC机器人码垛编程讲解
- 董明珠自媒体:格力口罩今日开售 上午预约下午抢购
- 最新编程语言排行榜出炉:Swift和Kotlin好像开始凉了
- 配置druid的过程以及问题
- Postgresql语句持续更新
- HTML+JS+websocket 实现联机“游戏王”对战(一)
- Java微服务框架一览
- 树莓派4B之声音传感器模块(python3)
- 如何使用Windows自带的“diskpart”工具制作系统启动盘
- 算法笔记--极大极小搜索及alpha-beta剪枝
热门文章
- 我的本科回忆录:从迷茫自卑到保送华科
- 从“领域变迁”的视角,来看钉钉的“退让”与“进取”
- 《MATLAB 神经网络43个案例分析》:第25章 基于MIV的神经网络变量筛选----基于BP神经网络的变量筛选
- chrome 安装插件(无需翻墙)
- 过程之美——过程让结果更精彩
- 启发式路径搜索算法介绍
- 修改C盘下的用户名(适合win10和win11)
- 【论文阅读】LOKI-Practical Data Poisoning Attack against Next-Item Recommendation
- 图片怎么转文字?这些方法值得收藏
- Linux下qt/C++全局键盘监控,处理键盘事件,输出按键码