自定义找密页面

找密流程

步骤1：用户输入邮箱，然后滑动验证码，如果邮箱格式正确并且存在，则发送找密邮件

步骤2：提示用户已经发送找密邮件到用户输入的邮箱

步骤3：用户登录邮箱点击找密链接，设置新的登录密码，点击完成，找密成功

实现

1.在页面加入预留的div区块

<div id="alibaba-email-resetpwd-iframe">
    <div id="alibaba-email-resetpwd-iframe-loading"></div>
</div>

2.引入js脚本

<script type="text/javascript" charset="utf-8" src="https://login-openaccount.taobao.com/assets/js/mini-login-embedderV3.js?v=579228"></script>

3.通过引入的js，初始化配置信息、监听找密完成事件

<script>
var miniLoginEmbedder = new window.MiniLoginEmbedder();
    miniLoginEmbedder.addEvent('onMessage', function(args) {
        //监听找密完成的消息
        if(args.action && args.action == "emailResetPwd" && args.resultCode=='100'){
            location.href = ("$callbackUrl?email=" + encodeURIComponent(args.email) + "&token=" + encodeURIComponent(args.token)) ;
        }
    });

miniLoginEmbedder.init({
        targetId    : 'alibaba-email-resetpwd-iframe',
        appKey : '$!appKey',//业务方在淘宝开放平台申请的appKey
        iframeUrl   : 'https://login-openaccount.taobao.com/login/$currUrl',
        notLoadSsoView:'',
        notKeepLogin:'true',
        iframeWidth:'1000px',
        iframeHeight:'500px',
        email: '$email',
        emailToken: '$emailToken',
        hostUrl: '$hostUrl'
    });
</script>

相关参数

1.callbackUrl 是找密成功后的回调地址
2.currUrl 邮箱找密第二步找密链接的iFrameUrl参数
邮箱找密第一步的值=emailResetPwdStep1.htm
3.email 邮箱找密第二步找密链接的email参数
4.emailToken 邮箱找密第二步找密链接的emailToken参数
5.hostUrl 邮箱找密第二步找密链接访问的url（业务方提供）
6.token，用户找密成功后，会返回token，可以添加在回跳的URL后，跳转到接入应用，应用拿到该token，ISV的服务端需要使用taobao.open.account.validate进行Token的校验，获得当前的用户的账号。拿到本次登陆用户的ID信息，然后建立应用的登录态 (见服务端集成介绍）

FAQ