随着微信用户群体不断扩大，微信已经成为每个人必不可少的手机软件。由此而生了多种登录模式：关注公众号获取验证码登录、扫描二维码关注公众号自动登录、扫描二维码进入小程序自动登录等等。本文今天带来的是利用公众号的网页授权功能，实现微信网页内获取用户授权自动登录的效果。具体的实现效果可以在微信端打开慕旋博客进行体验。

1.检测网站是否在微信网页打开

（1）PHP版本

<?php
// 判断是否是微信网页    
function is_wechat() {
    $user_agent = strtolower($_SERVER['HTTP_USER_AGENT']);
    return strpos($user_agent, 'micromessenger') !== false;
}
?>

（2）js版本

function isWechat() {
  var userAgent = window.navigator.userAgent.toLowerCase();
  return userAgent.indexOf('micromessenger') !== -1;
}

2.微信网页内弹出授权提醒

微信公众号网页授权相关文档：网页授权
在进行代码编写之前，需要先前往微信公众平台添加网页授权域名。
实现原理：在进入网站的同时首先检查当前是否是微信网页且账号为未登录状态，如果满足条件则弹出授权提示框。

<?php
function show_auth_alert() {
    // is_user_logged_in() 为检测用户是否登录的函数  可以根据自己的网站规则编写
    if (is_wechat() && !is_user_logged_in()) {
        ?>
        <style>
            /* 省略弹窗美化样式 */
        </style>

       <div class="auth-overlay" onclick="closeAuthDialog()">
            <div class="auth-dialog" onclick="event.stopPropagation()">
                <h3>检测到您当前环境可以进行微信授权登录，是否前往授权？</h3>
                <p>请点击下方按钮进行授权登录。</p>
                <button onclick="showAuthDialog()">授权登录</button>
                <button onclick="closeAuthDialog()" class="cancel">取消</button>
                <button onclick="refreshPage()" class="confirm">我已授权</button>
            </div>
        </div>

        <script>
            function showAuthDialog() {
                // 构造授权链接
                var appid = "填写自己的公众号 appid ";
                var redirect_uri = encodeURIComponent('填写自己的回调地址');
                var authUrl = "https://open.weixin.qq.com/connect/oauth2/authorize";
                authUrl += "?appid=" + appid;
                authUrl += "&redirect_uri=" + redirect_uri;
                authUrl += "&response_type=code";
                authUrl += "&scope=snsapi_userinfo";   
                authUrl += "&state=STATE#wechat_redirect";
                // 跳转到微信授权页面
                window.location.replace(authUrl);
}

            function closeAuthDialog() {
                var authOverlay = document.querySelector('.auth-overlay');
                authOverlay.parentNode.removeChild(authOverlay);
            }

            function refreshPage() {
                location.reload(); // 刷新当前页面
            }
        </script>
    <?php
    }
}
show_auth_alert();
?>

3.获取到授权用户的信息

在回调地址中获取到用户的code，进而换取到用户的access_token和openid，如果需要获取到用户的头像和昵称信息，还需要通过access_token和openid进行换取。