Merge remote-tracking branch 'origin/feature/captchapng' into feature/captchapng

@@ -10,6 +10,7 @@ const _ = require('lodash');
 const helpers = global.yoho.helpers;
 
 const service = require('../models/back-service');
+const captchaService = require('../models/captcha-service');
 
 const SIGN_IN = helpers.urlFormat('/passport/login');
 
@@ -150,18 +151,86 @@ const indexMobilePage = (req, res, next) => {
                 isPassportPage: true,
                 backMobile: true,
                 countrys: result.data,
-                areaCode: '+86'
+                areaCode: '+86',
+                verifySrc: helpers.urlFormat('/passport/back/generatecodeimg.png', {t: Date.now()})
             }));
         })
         .catch(next);
 };
 
 /**
+ * 生成验证码
+ * @param req
+ * @param res
+ */
+const generateCodeImg = (req, res) => {
+    let verifyCodeImg = captchaService.generateCaptcha(109, 50, 4);
+
+    if (verifyCodeImg) {
+
+        if (req.session.backupCaptch) {
+            req.session.backupCaptch.code = verifyCodeImg.text;
+        } else {
+            req.session.backupCaptch = {
+                code: verifyCodeImg.text,
+            };
+        }
+
+        res.set('Cache-Control', 'no-cache').send(verifyCodeImg.image);
+    }
+};
+
+/**
  * 发送手机验证码
  */
 const sendCodeToMobileAPI = (req, res, next) => {
+    let verifyCode = req.body.verifyCode || '';
     let phoneNum = req.body.phoneNum || '';
     let areaCode = req.body.areaCode || '86';
+
+    /* 如果设置了冻结时间，验证 */
+    if (_.has(req.session, 'backupCaptch.timeout')) {
+        let untilTime = (parseInt(req.session.backupCaptch.timeout, 10) -
+            parseInt(Date.now(), 10)) / 1000 / 60;
+
+        if (parseInt(Date.now(), 10) < parseInt(req.session.backupCaptch.timeout, 10)) {
+            return res.json({
+                code: 401,
+                message: '请' + (parseInt(untilTime, 10) + 1) + '分钟后尝试！'
+            });
+        }
+    }
+
+    /* 如果有设置验证次数，验证是否合法，验证次数减 1；没有，设置验证次数 */
+    if (_.has(req.session, 'backupCaptch.useTime')) {
+        if (parseInt(req.session.backupCaptch.useTime, 10) <= 0) {
+
+            /* 如果超过验证次数，冻结 5 分钟，更新验证次数 */
+            req.session.backupCaptch.timeout = Date.now() + 5 * 60 * 1000;
+            req.session.backupCaptch.useTime = 5;
+            return res.json({
+                code: 401,
+                message: '请5分钟后尝试！'
+            });
+        }
+        req.session.backupCaptch.useTime = req.session.backupCaptch.useTime - 1;
+    } else {
+        req.session.backupCaptch.useTime = 5;
+    }
+
+    /* 只校验一次，校验验证码 */
+    if (_.get(req.session, 'backupCaptch.useTime', 0) === 5 &&
+        !verifyCode || verifyCode.toString() !== _.get(req, 'session.backupCaptch.code', '').toString()) {
+        req.session.backupCaptch.code = null;
+
+        return res.json({
+            code: 400,
+            message: '验证码输入错误'
+        });
+    } else {
+        req.session.backupCaptch.code = null;
+    }
+
     let ERR = {
         code: 400,
         message: '输入手机号码出错'
@@ -183,7 +252,8 @@ const sendCodeToMobileAPI = (req, res, next) => {
                     code: 200,
                     data: helpers.urlFormat('/passport/back/mobilecode', {
                         phoneNum: phoneNum,
-                        areaCode: areaCode
+                        areaCode: areaCode,
+                        verifyCode: verifyCode
                     })
                 });
             }
@@ -208,8 +278,8 @@ const verifyCodeByMobilePage = (req, res) => {
         isPassportPage: true,
         backCode: true,
         areaCode: areaCode,
-        phoneNum: phoneNum
-
+        phoneNum: phoneNum,
+        verifySrc: helpers.urlFormat('/passport/back/generatecodeimg.png', {t: Date.now()})
     }));
 };
 
@@ -309,5 +379,6 @@ module.exports = {
     verifyCodeByMobilePage,
     verifyCodeByMobileAPI,
     setNewPasswordByMobilePage,
-    setNewPasswordByMobileAPI
+    setNewPasswordByMobileAPI,
+    generateCodeImg
 };

@@ -102,6 +102,7 @@ router.get('/passport/back/success', back.backSuccessByEmailPage);// 邮箱找
 
 router.get('/passport/back/mobile', back.indexMobilePage);// 输入手机号找回密码页面
 router.get('/passport/back/mobilecode', back.verifyCodeByMobilePage);// 输入手机验证码页面
+router.get('/passport/back/generatecodeimg.png', back.generateCodeImg);// 生成图片验证码
 router.post('/passport/back/sendcode', back.sendCodeToMobileAPI);// 发送手机验证码
 router.post('/passport/back/verifycode', back.verifyCodeByMobileAPI);// 校验手机验证码
 

@@ -6,6 +6,10 @@
             <span id="area-code" class="area-code">{{areaCode}}</span>
             <input id="phone-num" class="input phone-num" type="text" placeholder="手机号">
         </div>
+        <div class="passport-captcha row">
+            <input id="verify-code" type="text" placeholder="验证码">
+            <div class="passport-captcha-img"><img id="verify-code-img" src="{{verifySrc}}" alt="verify code"></div>
+        </div>
         <span id="btn-next" class="btn btn-next disable row">下一步</span>
     </div>
 </div>

@@ -9,6 +9,8 @@ var $ = require('yoho-jquery');
 var $phoneNum = $('#phone-num'),
     $countrySelect = $('#country-select'),
     $areaCode = $('#area-code'),
+    $verifyCode = $('#verify-code'),
+    $verifyCodeImg = $('#verify-code-img'),
     $btnNext = $('#btn-next');
 
 var api = require('../api');
@@ -33,21 +35,29 @@ $countrySelect.change(function() {
     $areaCode.text($countrySelect.val());
 });
 
+$verifyCodeImg.on('touchstart', function() {
+    var oldSrc = $verifyCodeImg.attr('src').split('=');
+
+    $verifyCodeImg.attr('src', oldSrc[0] + '=' + Date.now());
+});
+
 $btnNext.on('touchstart', function() {
     var pn = trim($phoneNum.val()),
-        area = trim($countrySelect.val());
+        area = trim($countrySelect.val()),
+        verify = trim($verifyCode.val());
 
     if ($btnNext.hasClass('disable')) {
         return;
     }
 
-    if (area && pn && api.phoneRegx[area].test(pn)) {
+    if (verify && area && pn && api.phoneRegx[area].test(pn)) {
         $.ajax({
             url: '/passport/back/sendcode',
             type: 'POST',
             data: {
                 areaCode: area.replace('+', ''),
-                phoneNum: pn
+                phoneNum: pn,
+                verifyCode: verify
             },
             success: function(data) {
                 if (data.code === 200) {
@@ -59,6 +69,8 @@ $btnNext.on('touchstart', function() {
         });
     } else if (!area) {
         showErrTip('出错了，请重新刷新页面');
+    } else if (!verify) {
+        showErrTip('请输入验证码');
     } else {
         showErrTip('手机号格式不正确，请重新输入');
     }

@@ -120,6 +120,7 @@ body.passport-body {
     .phone-container {
         padding-left: 55PX;
     }
+
     .input {
         width: 100%;
         line-height: 26PX;