详解用vue.js和laravel实现微信授权登陆


Posted in Javascript onJune 23, 2017

在laravel框架我们使用安正超的package

网址:https://easywechat.org/

有专门的针对laravel的安装包,请参见如下网址:https://github.com/overtrue/laravel-wechat

下面来说说具体的安装:

1.安装package

composer require overtrue/wechat

2.在app/config/app.php 中注册 ServiceProvider

Overtrue\LaravelWechat\ServiceProvider::class,

3.创建配置文件

php artisan vendor:publish --provider="Overtrue\LaravelWechat\ServiceProvider"

请修改应用根目录下的 config/wechat.php 中对应的项即可

4.添加外观到 config/app.php 中的 aliases 部分:

'wechat' => Overtrue\LaravelWechat\Facade::class,

5.添加路由

Route::any('/wechat', 'WechatController@serve');//控制器请按自己的实际情况填写

特别注意:因为laravel自带token验证,建议使用laravel-cors解决跨域问题,具体安装见github地址:https://github.com/barryvdh/laravel-cors

6.控制器添加如下代码:

/**
   * 处理微信的请求消息
   *
   * @return string
   */
  public function serve()
  {
    $wechat = app('wechat');
    $wechat->server->setMessageHandler(function($message){
      return "欢迎关注 overtrue!";
    });

    return $wechat->server->serve();
  }

7.配置好了路由和控制器,就得到了微信授权所需的URL,此时打开微信公众平台,在“开发—基本配置”页面,点击“修改配置”按钮,得到:

详解用vue.js和laravel实现微信授权登陆

修改配置页面

1) 将刚才的URL填入URL输入框内

2) token可自定义

3) EncodingAESKey 可随机生成

4) 消息加密用安全模式

8.在.env文件中配置以下参数

#微信配置,若不知道WECHAT_TOKEN和WECHAT_AES_KEY请继续往下看
WECHAT_APPID=
WECHAT_SECRET=
WECHAT_TOKEN=
WECHAT_AES_KEY=
#微信支付用
WECHAT_PAYMENT_MERCHANT_ID=
WECHAT_PAYMENT_KEY=

最后一步,填写完成后提交,微信将会调用此URL接口来验证,如果验证成功,就通过配置。

在公众平台,还有一项重要配置,如下:

在微信公众平台“接口权限”—“网页授权”—“网页授权域名”,填上服务器端域名(注:请仔细阅读平台上要求,特别注意得是,这里是服务器域名,不是客户端域名!)

接下来就可以实现微信授权登陆的功能了

10.在 app/Http/Kernel.php 中添加路由中间件:

protected $routeMiddleware = [
  // ...
  'wechat.oauth' => \Overtrue\LaravelWechat\Middleware\OAuthAuthenticate::class,
];

10.在路由中添加授权登陆的路由

Route::group(['middleware' => ['wechat.oauth']], function () {
  Route::get('/auth','UsersController@wechatAuth');
});

11.在以上路由相应的控制器中添加wechatAuth方法

public function wechatAuth(Request $request)
  {
    $userinfo = session('wechat.oauth_user')->original; // 拿到授权用户资料

    //这里写用户注册到mysql的相关逻辑代码,请自行补充

  }

12.在微信中打开此路由下的url就发现出现微信认证的界面,如未成功请自行检查你的配置和代码。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
如何实现浏览器上的右键菜单
Jul 10 Javascript
JS 时间显示效果代码
Aug 23 Javascript
妙用Jquery的val()方法
Jun 27 Javascript
js中的referrer返回上一页使用介绍
Sep 26 Javascript
jQuery中triggerHandler()方法用法实例
Jan 19 Javascript
html的DOM中document对象images集合用法实例
Jan 21 Javascript
JavaScript数据结构与算法之栈详解
Mar 12 Javascript
使用ngView配合AngularJS应用实现动画效果的方法
Jun 19 Javascript
在jQuery中使用$而避免跟其它库产生冲突的方法
Aug 13 Javascript
利用webstrom调试Vue.js单页面程序的方法教程
Jun 06 Javascript
Javascript中prototype与__proto__的关系详解
Mar 11 Javascript
openlayers4.6.5实现距离量测和面积量测
Sep 25 Javascript
妙用Angularjs实现表格按指定列排序
Jun 23 #Javascript
VUE中v-model和v-for指令详解
Jun 23 #Javascript
JavaScript正则表达式简单实用实例
Jun 23 #Javascript
js中的事件委托或是事件代理使用详解
Jun 23 #Javascript
JS判断非空至少输入两个字符的简单实现方法
Jun 23 #Javascript
详解Vue.js之视图和数据的双向绑定(v-model)
Jun 23 #Javascript
微信小程序组件 marquee实例详解
Jun 23 #Javascript
You might like
thinkphp路由规则使用示例详解和伪静态功能实现(apache重写)
2014/02/24 PHP
功能强大的php分页函数
2016/07/20 PHP
PHP7 安装event扩展的实现方法
2019/10/08 PHP
yii2.0框架多模型操作示例【添加/修改/删除】
2020/04/13 PHP
比较简单实用的使用正则三种版本的js去空格处理方法
2007/11/18 Javascript
js封装的textarea操作方法集合(兼容很好)
2010/11/16 Javascript
javascript图像处理—仿射变换深度理解
2013/01/16 Javascript
JavaScript定义类的几种方式总结
2014/01/06 Javascript
JS实现鼠标经过好友列表中的好友头像时显示资料卡的效果
2014/07/02 Javascript
jQuery匹配文档链接并添加class的方法
2015/06/26 Javascript
ionic3+Angular4实现接口请求及本地json文件读取示例
2017/10/11 Javascript
vue路由跳转时判断用户是否登录功能的实现
2017/10/26 Javascript
11个教程中不常被提及的JavaScript小技巧(推荐)
2019/04/17 Javascript
easyUI 实现的后台分页与前台显示功能示例
2020/06/01 Javascript
[55:16]Mski vs VGJ.S Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
python快速排序代码实例
2013/11/21 Python
Python中的Numeric包和Numarray包使用教程
2015/04/13 Python
Python聊天室实例程序分享
2016/01/05 Python
python3新特性函数注释Function Annotations用法分析
2016/07/28 Python
获取django框架orm query执行的sql语句实现方法分析
2019/06/20 Python
详解python解压压缩包的五种方法
2019/07/05 Python
Django框架组成结构、基本概念与文件功能分析
2019/07/30 Python
Python字符串格式化输出代码实例
2019/11/22 Python
python飞机大战pygame碰撞检测实现方法分析
2019/12/17 Python
Python 跨.py文件调用自定义函数说明
2020/06/01 Python
通过代码简单了解django model序列化作用
2020/11/12 Python
详解利用python识别图片中的条码(pyzbar)及条码图片矫正和增强
2020/11/17 Python
使用OpenCV校准鱼眼镜头的方法
2020/11/26 Python
HTML5拖放效果的实现代码
2016/11/17 HTML / CSS
北美主要的汽车零部件零售商:AutoShack.com
2019/02/23 全球购物
判断单链表中是否存在环
2012/07/16 面试题
护士自我介绍信
2014/01/13 职场文书
单位提档介绍信
2014/01/17 职场文书
人才市场接收函
2015/01/30 职场文书
MySQL分区表实现按月份归类
2021/11/01 MySQL
HttpClient实现文件上传功能
2022/08/14 Java/Android