详解用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 相关文章推荐
jquery的颜色选择插件实例代码
Oct 02 Javascript
javascript 处理事件绑定的一些兼容写法
Dec 24 Javascript
浏览器解析js生成的html出现样式问题的解决方法
Apr 16 Javascript
js字符串日期yyyy-MM-dd转化为date示例代码
Mar 06 Javascript
jQuery.extend()、jQuery.fn.extend()扩展方法示例详解
May 08 Javascript
jQuery 3.0十大新特性
Jul 06 Javascript
Google 地图获取API Key详细教程
Aug 06 Javascript
浅谈移动端之js touch事件 手势滑动事件
Nov 07 Javascript
js实现自动轮换选项卡
Jan 13 Javascript
webpack3之loader全解析
Oct 26 Javascript
使用 vue 实例更好的监听事件及vue实例的方法
Apr 22 Javascript
vue实现选中效果
Oct 07 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
弄了个检测传输的参数是否为数字的Function
2006/12/06 PHP
phpmyadmin导入(import)文件限制的解决办法
2009/12/11 PHP
PHP MVC模式在网站架构中的实现分析
2010/03/04 PHP
浏览器无法运行JAVA脚本的解决方法
2008/01/09 Javascript
jQuery中append、insertBefore、after与insertAfter的简单用法与注意事项
2020/04/04 Javascript
JavaScript实现页面滚动图片加载(仿lazyload效果)
2011/07/22 Javascript
html中使用javascript调用本地程序(exe、doc等)实现代码
2013/04/26 Javascript
jquery高效反选具体实现
2013/05/05 Javascript
Js中的onblur和onfocus事件应用介绍
2013/08/27 Javascript
自己写的Javascript计算时间差函数
2013/10/28 Javascript
js中小数转换整数的方法
2014/01/26 Javascript
jQuery 动态云标签插件
2014/11/11 Javascript
详解JavaScript中jQuery和Ajax以及JSONP的联合使用
2015/08/13 Javascript
jQuery实现可关闭固定于底(顶)部的工具条菜单效果
2015/11/06 Javascript
基于chosen插件实现人员选择树搜索自动筛选功能
2016/09/24 Javascript
基于Node.js + WebSocket打造即时聊天程序嗨聊
2016/11/29 Javascript
angularjs点击图片放大实现上传图片预览
2017/02/24 Javascript
解决vue+webpack打包路径的问题
2018/03/06 Javascript
详解vue2.6插槽更新v-slot用法总结
2019/03/09 Javascript
vue实现百度搜索功能
2020/12/28 Javascript
[06:07]刀塔密之二:攻之吾命受之吾幸
2014/07/03 DOTA
python自定义解析简单xml格式文件的方法
2015/05/11 Python
python3 破解 geetest(极验)的滑块验证码功能
2018/02/24 Python
Python模拟键盘输入自动登录TGP
2020/11/27 Python
美国电视购物:QVC
2017/02/06 全球购物
瑞典时尚耳机品牌:Urbanears
2017/07/26 全球购物
英国和爱尔兰的自炊式豪华度假小屋:Rural Retreats
2018/06/08 全球购物
美国智能家居专家:tink
2019/06/04 全球购物
描述Cookie和Session的作用,区别和各自的应用范围,Session工作原理
2015/03/25 面试题
相亲大会策划方案
2014/06/05 职场文书
小学捐书活动总结
2014/07/05 职场文书
小学“向国旗敬礼”网上签名寄语活动总结
2014/09/27 职场文书
2015年音乐教研组工作总结
2015/07/22 职场文书
青年联谊会致辞
2015/07/31 职场文书
高一军训感想
2015/08/07 职场文书
Java循环队列与非循环队列的区别总结
2021/06/22 Java/Android