广告
返回顶部
首页 > 资讯 > 前端开发 > VUE >微信小程序中如何实现用户授权以及判断登录是否过期
  • 277
分享到

微信小程序中如何实现用户授权以及判断登录是否过期

2024-04-02 19:04:59 277人浏览 泡泡鱼
摘要

小编给大家分享一下微信小程序中如何实现用户授权以及判断登录是否过期,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!初始界面:判断用

小编给大家分享一下微信小程序中如何实现用户授权以及判断登录是否过期,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

初始界面:

微信小程序中如何实现用户授权以及判断登录是否过期

判断用户是否过期(如果未过期则重新登录):

微信小程序中如何实现用户授权以及判断登录是否过期

获取用户信息:

微信小程序中如何实现用户授权以及判断登录是否过期

获取用户的信息并在前台显示:

微信小程序中如何实现用户授权以及判断登录是否过期

主要实现两个功能:

①判断登录是否过期,如果过期则就重新登录,如果没过期就提示未过期

②获取用户的信息,并在前台显示

index.wxml

<button bindtap="login">登录</button>
<button bindtap="checksession">登录是否过期</button>
<button open-type="getUserInfo" bindgetuserinfo="info">点击授权</button>
<text>{{city}}</text>
<text>{{country}}</text>
<text>{{nickName}}</text>
<text>{{province}}</text>

index.js

//index.js
//获取应用实例
const app = getApp()
 
Page({
 data: {
  city:'',
  country:'',
  nickName:'',
  province:''
 },
 //发起Http请求
 login:function(){
  wx.login({
   success:function(res){
    console.log(res.code)
    //发送请求
    wx.request({
     url: '自己的域名', //仅为示例,并非真实的接口地址
     data: {
      code:res.code
     },
     header: {
      'content-type': 'application/JSON' // 默认值
     },
     success(res) {
      console.log(res)
     }
    })
   }
  })
 },
 //验证登录是否过期
 checksession:function(){
  wx.checkSession({
   success:function(res){
    console.log(res,'登录未过期')
    wx.showToast({
     title: '登录未过期啊',
    })
   },
   fail:function(res){
    console.log(res,'登录过期了')
    wx.showModal({
     title: '提示',
     content: '你的登录信息过期了,请重新登录',
    })
    //再次调用wx.login()
    wx.login({
     success: function (res) {
      console.log(res.code)
      //发送请求
      wx.request({
       url: '自己的域名', //仅为示例,并非真实的接口地址
       data: {
        code: res.code
       },
       header: {
        'content-type': 'application/json' // 默认值
       },
       success(res) {
        console.log(res)
       }
      })
     }
    })
   }
  })
 },
 //获取用户的信息
 info:function(){
  var that=this
  wx.getUserInfo({
   success:function(res){
    console.log(res.userInfo)
    var city = res.userInfo.city
    var country = res.userInfo.country
    var nickName = res.userInfo.nickName
    var province = res.userInfo.province
    that.setData({
     city:city,
     country:country,
     nickName:nickName,
     province:province
    })
   }
  })
 }
})

index.PHP

<?php
//声明code,用来接收前台传过来的code
$code=$_GET['code'];
 
//获取到appid
$appid="xxxxxxxxxxx"; //自己的appid
$secret="xxxxxxxxxxxx";  //自己的secret
$api="https://api.weixin.qq.com/sns/jscode2session?appid={$appid}&secret={$secret}&js_code={$code}&grant_type=authorization_code";  //可去小程序开发文档中查看这个链接
 
//发送的代码
function httpGet($url){
	$curl=curl_init();
	curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
	curl_setopt($curl, CURLOPT_TIMEOUT, 500);
	curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, true);
	curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, true);
	curl_setopt($curl, CURLOPT_URL, $url);
	$res= curl_exec($curl);
	curl_close($curl);
	return $res;
}
 
$str=httpGet($api);
 
echo $str;
?>

关于这个php文件的说明:

①获取appid和secret:

微信小程序中如何实现用户授权以及判断登录是否过期

②当你点击登录的时候,出现这些东西就说明php文件调用成功

微信小程序中如何实现用户授权以及判断登录是否过期

③登录凭证校检地址(该里面的参数即可):

微信小程序中如何实现用户授权以及判断登录是否过期

④域名要合法

在小程序平台上:

微信小程序中如何实现用户授权以及判断登录是否过期

web开发工具里:

微信小程序中如何实现用户授权以及判断登录是否过期

以上是“微信小程序中如何实现用户授权以及判断登录是否过期”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注编程网VUE频道!

--结束END--

本文标题: 微信小程序中如何实现用户授权以及判断登录是否过期

本文链接: https://www.lsjlt.com/news/73885.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 微信小程序中如何实现用户授权以及判断登录是否过期
    小编给大家分享一下微信小程序中如何实现用户授权以及判断登录是否过期,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!初始界面:判断用...
    99+
    2022-10-19
  • 微信小程序中如何获取用户手机号授权登录
    随着微信小程序的普及,许多应用程序需要用户登录才能提供更好的服务。而获取用户手机号码是验证用户身份和确保账户安全的重要步骤之一。因此,在本文中,我们将介绍如何在微信小程序中实现手机号授权登录。 步骤一:在小程序后台添加手机号授权 首先,在小...
    99+
    2023-08-17
    微信小程序 小程序 前端 javascript vue.js
  • 微信小程序中如何实现用户登录与登录态维护
    小编给大家分享一下微信小程序中如何实现用户登录与登录态维护,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!在微信小程序中,我们大致...
    99+
    2022-10-19
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作