微信授权登录(PHP + vue)

1申请微信测试号
 申请微信测试号地址
 http://mp.weixin.qq.com/debug/cgi-bin/sandboxinfo?action=showinfo&t=sandbox/index
2配置微信测试号
配置需要用到公网地址 没有的 可以下载内网穿透工具 
内网下载方式以及代理:https://natapp.cn/ 
这里用的是natapp 具体用法---Google、百度

1在这里插入图片描述在这里插入图片描述

3前端:
vue :
	$('.list-box').on('click', '#goBind', function() {
		//appid 可以从后端传过来 也可以写死 
        var APPID = $('#wx_app_id').val(); 
        // 跳转回调redirect_uri 可以从后端传过来 也可以写死 但是url必须是公网可访问的
        var REDIRECT_URI = $('#wx_url').val();
        // 返回类型
        var code = 'code';
        // 应用授权作用域,snsapi_base (不弹出授权页面,直接跳转,只能获取用户openid),snsapi_userinfo (弹出授权页面,可通过openid拿到昵称、性别、所在地。并且, 即使在未关注的情况下,只要用户授权,也能获取其信息 )
        var SCOPE = 'snsapi_userinfo';
        var STATE = '123';//随便写
        var url = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' + APPID + '&redirect_uri=' + REDIRECT_URI + '&response_type=' + code + '&scope=' + SCOPE + '&state=' + STATE + '#wechat_redirect';
        window.location.href = url;
	});
4后端:
PHP:
 public function indexAction()
    {
    	//未登录时授权
    	$wx_code = $this->getRequest()->getQuery('code', '');
    	$state = $this->getRequest()->getQuery('state', '');
    	if($wx_code && $state == '123' )
    	{
    		 $oauth = new WeChatAuth();
        	 $wx_info = $oauth->getUserOpentId($wx_code);
        	 //获取信息后存入数据库
        	 $openid = $wx_info['openid'];
	         $accountOauth = new accountOauthModel();
	         $check_member = $accountOauth->findUserInfo($openid);
    	}
    	
    }
class WeChatAuth
{

	private $appid = '';
    private $appsecret = '';

    public function __construct()
    {
        $globalConfig = \Yaf\Registry::get('globalConfig');
        $config = $globalConfig['weixinpay_config'];
        $this->appid = $config["app_id"];
        $this->appsecret = $config["app_secret"];
    }

    //获取用户授权信息
    public function getUserOpentId($code = ''){
        //回调地址会传回一个code,根据code去获取openid和授权获取到的access_token
        if(!$code) return [];
        $appid = $this->appid;
        $secret = $this->appsecret;
        $url = "https://api.weixin.qq.com/sns/oauth2/access_token?appid=".$appid."&secret=".$secret."&code=".$code."&grant_type=authorization_code";
        $res = $this->http_curl($url);
        $access_token = $res['access_token'];
        $getopenid = $res['openid'];
        //获取用户授权信息
        $urltoc = "https://api.weixin.qq.com/sns/userinfo?access_token=".$access_token."&openid=".$getopenid."&lang=zh_CN";
        $resinfos = $this->http_curl($urltoc);
        return $resinfos;
    }

	//curl
	public function http_curl($url,$type='get',$res='json',$arr='')
    {
        //1.初始化curl
        $ch = curl_init();
        //2.设置curl的参数
        curl_setopt($ch, CURLOPT_URL, $url);
        curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false); //不验证证书
        curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false); //不验证证书
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
        if ($type == 'post') {
            curl_setopt($ch, CURLOPT_POST, 1);
            curl_setopt($ch, CURLOPT_POSTFIELDS, $arr);
        }
        //3.采集
        $output = curl_exec($ch);
        //4.关闭
        curl_close($ch);
        if ($res == 'json') {
            return json_decode($output, true);
        }
    }
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
课程概述: 本课程是一个小型的vue周边技术+以php为基础的+微信接口开发的小型项目。本项目以微信扫码关注公众号实现网站自动登陆这一功能为载体,将会讲解如下主要核心知识点:前端你将学习到: 一、vue-cli4进行前端项目的创建 二、如何使用vuex进行登陆信息的管理与同步 三、如何使用axios进行接口请求的封装与拦截 四、在脚手架里使用Element-UI 五、学习组件化编程的思想 六、如何解决接口前后端分离引起的跨域问题以及在跨域下使用cookie凭证进行会话维护 后端你讲学习到: 一、如何申请微信公众号测试账号,如何进行相关参数的配置,如何进行微信相关接口的开发 二、如何使用微信接口开发,如获取临时二维码,获取用户基础信息,监听公众号关注以及扫描事件 三、如何使用redis对数据进行缓存 四、如何使用php原生代码进行接口的开发 五、如何使用laralvel 7.x 框架进行接口的开发 六、学习到laravel 中核心概念的使用方法,如什么是依赖注入,如何使用服务容器解决依赖注入、服务提供者、中间件的使用,如何处理请求数据,如何进行用户认证,以及如何使用Eloquent ORM进行数据库操作 七、开发过程中遇到的问题,如何进行排查 八、git远端仓库的建立与配置,如何在配置多仓库下的公钥,服务器端部署公钥的配置,如何进行代码部署,本地与服务器代码的开发实时同步 九、如何使用composer帮助我们进行第三方依赖包的安装 本课程的设计思路随笔: 从业务层面上来讲,扫码关注公众号,实现网站端自动登陆是一个非常实用的功能,可以为微信公众号引流。 技术层面上来说,使用前后端分离进行制作,可以将前端以及后端的知识都涵盖到。对于前端的路由,信息维护,脚手架的搭建,ui组件的使用,接口的请求与封装都能够讲解到。 对于后端,本课程对php原生代码以及工作中使用频率比较高的同时也很优雅的laravel框架都会进行讲解,分别予以代码的实现。让同学们能够看到原生开发与框架开发的区别,原生开发使得基础比较弱的同学能够慢慢上手,也知道此功能实现的核心要点,在进行原生代码开发后,再进行框架开发,会有个循序渐进的过程,同时在框架里面我们会降到主流框架都会用到的一些核心思想,比如依赖注入,服务容器,中间件等等,同时对于想学习laravel框架的同学,学习过这个案例后,再去看文档就知道该如何去看,如何去学了。 对于整个代码的管理与部署,我们也会引入git仓库进行项目代码管理,如何在服务器进行网站环境的搭建与代码部署等等实用技巧。 相信本课程会给大家带来十足的收获,大家加油。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值