用戶登錄接口
[Access Authorization]
在咱們的設備固件製做過程當中，咱們使用了與大多數電信運營商相同的 Portal認證 技術，其中系統架構上主要由 AP無線訪問接入點（Wireless Access Point）、AC接入控制器（Wireless Access Point Controller）、認證頁面服務器（Captive Portal Server）、認證計費服務器（Cloud Radius Server）構成，而在雲端，咱們完成了Portal頁面的雲存儲，Captive Portal頁面在線編輯，Portal靜態文件CDN加速，以及上網用戶數據的分析展現，同時radius服務器也經過Oauth2.0協議與第三方帳戶系統的打通。html
Portal認證:java
您須要作什麼？
您只須要完成 Portal頁面 與 AC接入控制器（路由器） 的局域網通訊便可，而在路由器固件中咱們配置的 Radius客戶端 將代替網絡接入請求者向 認證計費服務器 發送認證請求，返回認證結果。android
Portal頁面 與 AC接入控制器（路由器） 之間的通訊是經過json Api 完成的，爲了方便您的快速開發，咱們提供了Javascript Library，您只須要引入制定JS文件，經過簡單的編寫Javascript代碼便可自定義您的帳戶認證，而這一切均可以經過 在線編輯代碼 完成。web
您應該怎樣去作？
1、 編輯認證頁面模板，引入JS文件ajax
<script src="http://s.anywifi.com/resources/anywifiLibrary.js"></script>
注意：請不要下載保存該文件，咱們將不按期更新完善該Library.json
2、 幾種經常使用認證方式api
一、匿名登錄（訪客模式）瀏覽器
匿名登錄接口函數：anonymousLogin();服務器
在上網用戶未經過認證前，能夠經過 訪客模式 獲取短暫的網絡接入權限，或者您只須要訪客 點擊某連接便可上網 ，在這裏便可使用匿名登錄實現（匿名登錄獲取的網絡接入 時常、帶寬 都可在管理平臺上網用戶-用戶組 中進行設置）。
示例
<!doctype html>
<html>
<head>
<title>{title}</title>
<script src="http://s.anywifi.com/resources/anywifiLibrary.js"></script>
</head>
<body>
<a href="anonymousLogin();">匿名登錄</a>
<p>點擊上面連接，便可免費上網。</p>
</body>
</html>
固然，你也能夠利用JS的定時器來顯示打開頁面（點擊按鈕）N秒後自動登錄，效果以下：
代碼以下：
<!doctype html>
<html>
<head>
<title>{title}</title>
<script src="http://s.anywifi.com/resources/anywifiLibrary.js"></script>
<script type="text/javascript">
function timer(){
var i = 10;
$("#dt2").show();
$("#dt1").hide();
var ttt = window.setInterval(function(){
i--;
$("#time").html(i);
if(i==0){
clearInterval(ttt);
anonymousLogin();
}
}, 1000);
}
</script>
</head>
<body>
<dl>
<dt id="dt1">
<a href="javascript:void(0)" onclick="timer();"><span>1</span><span>點擊試用免費WIFI</span></a>
</dt>
<dt id="dt2" style="display:none;">
<a href="javascript:void(0)"><span>1</span><span>上網配置中<em id="time">10</em></span></a>
</dt>
</dl>
</body>
</html>
二、微信登錄
微信登錄接口地址：http://c.anywifi.com/api/weixinlogin?uid=<平臺帳戶UID>（「<平臺帳戶UID>」須要 <a "http:="" c.anywifi.com="" user="" login.html"="" target="_blank">登錄平臺 後顯示）
上述微信登錄接口地址，適用於在上網 認證頁面 提示用戶 關注某微信帳戶，而後微信帳戶在用戶關注後自動回覆 該地址連接，用戶使用微信點擊此連接時，則將自動調用JS微信登錄接口函數，完成 微信一鍵關注上網 ，若是不是在微信中訪問的此API地址，則將會出現請打開微信客戶端的 提示。
微信一鍵關注上網：
微信登錄接口函數：webchatLogin();
獲取頁面推廣微信帳戶：http://c.anywifi.com/api/weixinname?nasid=[NASID](NASID 參數能夠從URL的GET查詢字符串中獲取)
微信登錄接口函數 是區別於 匿名登錄接口的，主要是由於管理平臺能夠對兩種用戶組分別設置不一樣的 時常、帶寬組別屬性，微信登錄接口，咱們一般利用微信瀏覽器的UA（ 微信瀏覽器User-Agent ）的特殊性，來判斷是不是在微信瀏覽器中點擊此連接，查看此頁面，決定是否予以網絡接入，上面提到的 微信關注一鍵上網接口 就是採用該思路實現的。
示例
<!doctype html>
<html>
<head>
<title>{title}</title>
<script src="http://s.anywifi.com/resources/anywifiLibrary.js"></script>
<script type="text/javascript">
//經過查詢字符串中的NASID判斷查詢該設備認證頁面須要推廣的微信帳號
var nasId = getQueryString('nasid');
ajaxLoad("GET","http://c.anywifi.com/api/weixinname?nasid="+nasId+"&t="+Math.random(),function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
getel('wx_name').innerHTML = xmlhttp.responseText;
}
});
});
</script>
</head>
<body>
<div class="gridContainer clearfix" id="forpc" style="display:none;">
<div id="div1" class="fluid wrapper test transition">
<h1 id="logo" class="test"><img class="lo_ico" src="http://s.anywifi.com/resources/template/1/webchatonekeylogin/warnico.png"></h1>
<div class="notecont transition">
<h2>WebChat Only</h2>
<a class="golink" href="weixin://qr/gEx_Zm-EdTlKrSsF9xmS">關注微信<span id="wx_name"></span>認證上網</a>
</div>
</div>
</div>
<div class="gridContainer clearfix" id="forweixin" style="display:none;">
<div id="div1" class="fluid wrapper test transition">
<h1 id="logo" class="test"><img class="lo_ico" src="http://s.anywifi.com/resources/template/1/webchatonekeylogin/successico.png"></h1>
<div class="notecont transition">
<h2>登錄成功</h2>
</div>
</div>
</div>
<script type="text/javascript">
//根據UA判斷
var ua = navigator.userAgent.toLowerCase();
var url = window.location.href;
if(ua.indexOf("android")!=-1 || ua.indexOf("iphone")!=-1 || ua.indexOf("ipad")!=-1 || ua.indexOf("phone")!=-1){ //mobile end
//micromessenger
if(ua.indexOf("micromessenger")!=-1){
getel('forweixin').style.display='block';
setTimeout("webchatLogin()",2000);
}else {
getel('forpc').style.display='block';
}
}else{
getel('forpc').style.display='block';
}
</script>
</body>
</html>
三、手機號碼登錄
手機號登錄接口函數：userLogin(mobilephone,password);
獲取登錄驗證碼：http://c.anywifi.com/api/mobilephone?nasid=[NASID]&mobilephone=[MOBILEPHONE]&mac=[MAC]&ap=[AP]
（其中NASID、MOBILEPHONE、MAC、AP參數都可從表單或者查詢字符串中獲取）
使用手機號碼做爲帳號登錄，上網用戶須要填寫 手機號碼，經過請求獲取手機號碼驗證密碼，而後填入 驗證密碼 便可登錄（獲取驗證密碼須要下行短信，註冊帳戶默認贈送50條，能夠經過平臺帳戶購買短信，上網用戶手機號碼信息能夠從後臺瀏覽查看）
手機號碼登錄：
示例代碼：
<!doctype html>
<html>
<head>
<title>{title}</title>
<script src="http://s.anywifi.com/resources/anywifiLibrary.js"></script>
<script type="text/javascript">
//登錄按鈕
function doLogin(){
userLogin(getel("phone").value,getel("code").value);
};
//獲取短信驗證密碼
function getPhoneCode(){
var nasId = getQueryString('nasid');
var mac = getQueryString('mac');
var ap = getQueryString('called');
var mobilePhone = getel("phone").value;
if(/^1\d{10}$/g.test(mobilePhone)){
ajaxLoad("GET","http://"+adminDomain+"/api/mobilephone?nasid="+nasId+"&mobilephone="+mobilePhone+"&mac="+mac+"&ap="+ap+"&t="+Math.random(),function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
if(xmlhttp.responseText=="SUCCESS"){
alert('短信驗證碼已發送');
}else if(xmlhttp.responseText=="OVERLOAD"){
alert('短信發送中,請稍等...');
}else{
alert(xmlhttp.responseText);
}
}
});
}else{
alert('手機號碼格式不正確');
getel("phone").value = '';
}
}
</script>
</head>
<body>
<div >
<input type="text" id="phone" placeholder="輸入手機號" />
<button id="codeButton" onclick="getPhoneCode();" >獲取驗證碼</button>
</div>
<div >
<input type="text" id="code" placeholder="輸入驗證碼" />
<button id="accordion-longinBtn2" onclick="doLogin();" >登 錄</button>
</div>
</body>
</html>