当前位置:   article > 正文

【微信小程序学习笔记】

【微信小程序学习笔记】

微信小程序学习笔记

环境介绍

uni-app,vue
文档:https://zh.uniapp.dcloud.io/

分包加载

  • 为什么要分包加载
    分包加载是小程序的加载速度手段
    小程序的单个包不能超过2m
  • 启用分包加载
    subPackages:下载app.json文件中
    root:分包所在的目录
    pages:分包包含的页面
        "subPackages": [
   {
     "root": "pkg_building",
     "pages": [
       "detail/detail",
       "list/list"
     ]
   },
   {
     "root": "pkg_repair",
     "pages": [
       "detail/detail",
       "list/list"
     ]
   }
原文链接:https://blog.csdn.net/sinat_34896766/article/details/136213103
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16

小程序用户登录

知识重点

uni.login(OBJECT)
是uni-app 框架的一部分,它可以编译到多个小程序平台,在微信小程序环境中,uni.login 实际上是调>用了底层的 wx.login API,但它提供了更统一的接口,使得在不同平台间切换时代码能保持一致性
常用参数
scopes:授权类型,默认 auth_base。支持 auth_base(静默授权)/ auth_user(主动授权) / auth_zhima(芝麻信用)
success:接口调用成功的回调
fail:接口调用失败的回调函数
后端
SKIT.FlurlHttpClient.Wechat.Api;微信官方api

步骤

  • 通过uni.login成功获取用户的code信息
  • 请求后端接口获取code
  • 调用微信API换取access_token和openid:使用接收到的code
  • 微信服务器会响应包含access_token、openid、以及可选的unionid等信息。后端需要解析这个响应,提取出这些关键信息。
  • 使用openid作为用户唯一标识,可以在数据库中查找或创建用户记录。
  • 最后,后端会返回一个登录成功的响应给前端

处理过程中要确保安全性,比如AppSecret不应暴露在前端,且敏感数据传输应加密。

前端获取用户code

//前端获取用户code
 getCode: function (callback) {
                let _this = this
                uni.login({
                    // #ifdef MP-ALIPAY
                    scopes: 'auth_user',
                    // #endif
                    success: function (res) {
                        console.log(res);
                        if (res.code) {
                            return callback(res.code)
                        } else {
                            //login成功,但是没有取到code
                            _this.$refs.uToast.show({ title: '未取得code,请重试', type: 'error', })
                        }
                    },
                    fail: function (res) {
                        console.log(res);
                        _this.$refs.uToast.show({ title: '用户授权失败wx.login,请重试', type: 'error', })
                    }
                })
            },
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22

请求微信api

在后端接口中通过微信api验证用户需要配置微信小程序的AppId,AppSecret,生成WechatApiClient对象

   var WechatApiClient = new WechatApiClient(new WechatApiClientOptions()
            {
                AppId = _weChatOptions.WxOpenAppId,
                AppSecret = _weChatOptions.WxOpenAppSecret
            });
  • 1
  • 2
  • 3
  • 4
  • 5

尝试从缓存中获取微信用户凭证accessToken
使用code以及accesToken创造一个用于微信请求的SnsJsCode2SessionRequest对象
执行ExecuteSnsJsCode2SessionAsync(request, HttpContext.RequestAborted)请求
可以用返回值中的OpenId做相关操作,将OpenId的值返回前端以作登录判断

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/小桥流水78/article/detail/744001
推荐阅读
相关标签
  

闽ICP备14008679号