教程 超简易网页认证 扫二维码上网两用认证方案..docVIP

[教程] 超简易的网页认证/扫码上网两用认证方案(wiwiz实现) 这个方案是用之前给某连锁酒店做的认证系统改的。 既能实现网页认证推送页面广告，通过客人自己输入身份证号尾号上网，也能实现入住客人扫码自动上网。 目前反馈效果不错。这里无偿把经验分享给大家。 以下是实现步骤： 第1步，设置好wiwiz热点，不会安装的去wiwiz官网看教程。注意一定要启用电子招待券和自定义认证页面两项功能。 第2步，在wiwiz后台添加一个电子招待券，最好设的长一些（30字符以内）。我这里的例子是：wifivoucher999 把招待券的内容先做base64编码，然后再做url编码，得到转码以后的文字：[color=Red]d2lmaXZvdWNoZXI5OTk%3D[/color]。 [u]如果自己不会转码，可以用附件里的文件Base64UrlEncode.rar。[/u] 第3步，在百度里随便找一个二维码生成器，用以下网址生成二维码： [url=/?a=]/?a=[/url][color=Red]d2lmaXZvdWNoZXI5OTk%3D[/color] 可以用你自己转码后的招待券替换“a=”后面的部分。 我用的二维码图片是： [attachimg]463424[/attachimg] 第4步，在wiwiz后台里把“认证页面类型”设置为“自定义认证页面HTML”。 把“自定义HTML”按以下的内容填写：[code]!doctype html html head meta http-equiv=Content-Type content=text/html; charset=UTF-8 meta http-equiv=Content-Language content=zh meta http-equiv=Pragma content=no-cache meta http-equiv=Cache-Control content=no-cache meta name=viewport content=width=device-width; initial-scale=1.0 style type=text/css .fontfamily {font-family: Microsoft YaHei, SimHei; color: #043307} .footerlink {font-family: Microsoft YaHei, SimHei; color: #ffffff; text-decoration:none;} .wiwizinputbox { height:32px; font: 18px/1.25 Microsoft YaHei, SimHei, arial, \5b8b\4f53; margin-top:10px; border:3px #d7d7d7 solid; background:#fff; } .wiwizbtn1 { margin-top:10px; background-color: #ffffff; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; /*IE 7 AND 8 DO NOT SUPPORT BORDER RADIUS*/ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = #736db4, endColorstr = #404288); /*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*/ /*Element must have a height (not auto)*/ /*All filters must be placed together*/ -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = #736db4, endColorstr = #404288); /*Element must have a height (not auto)*/ /*All filters must be placed together*/ background-image: -moz-linear-gradient(top, #736db4, #404288); background-image: -ms-linear-gradient(top, #736db4, #404288); background-image: -o-linear-gradient(top, #736db4, #4