微信小程序两种不同的用户登录方式

已于 2024-07-05 13:16:17 修改
阅读量654 收藏 15
点赞数 5
文章标签： 微信小程序 小程序
于 2024-07-04 23:38:15 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Tom_yangyang/article/details/140191670
版权

目录

一、微信授权登录

微信授权登录，无需过多操作一键式登录

微信授权按钮组件如下图

js文件代码如下

关键点总结 

二、账号密码登录 

 账号密码登录，需要后台进行判断，正确后跳转

账号密码登录按钮组件如下图 

关键点总结 

一、微信授权登录

        微信授权登录，无需过多操作一键式登录

           

微信授权按钮组件如下图

         其中在button标签中open-type属性有一个关于获取用户信息的gerUserInfo的属性，微信开发团队还为我们封装好了一个关于获取微信个人信息的API：wx.getUserProfile，我们可以在按钮的bind:tap事件中加入其组件获取微信信息。

        js文件代码如下

关键点总结 

        button标签中open-type属性详情介绍网址微信开发文档 

 wx.getUserProfile属性详情介绍网址微信开发文档 

        获取用户信息。页面产生点击事件（例如 button 上 bindtap 的回调中）后才可调用，每次请求都会弹出授权窗口，用户同意后返回

二、账号密码登录 

         账号密码登录，需要后台进行判断，正确后跳转

        账号密码登录按钮组件如下图 

         在按钮中需要设置一个form-type="submit"提交方式，并且表单需要设置一个bindsubmit属性

js文件代码如下

        此处做的是模拟登录操作，其中文本框的获取方式：e.detail.value."文本框定义的name属性值"

关键点总结 

 form标签的bindsubmit属性详情介绍网址微信开发文档

button标签的form-type属性详情介绍网址 微信开发文档

Tom_yangyang
关注
微信小程序登录流程，双登录，手机号登录和账户密码登录
qq_42661587的博客
02-15 1万+
一、第一步： 在app.js文件中调用wx.login方法发送res.code和appid给后台，后台返回openid和session_key，把openid和session_key存入storage中。因为之后获取解码的手机号码需要用到session_key。 app.js文件中 // 登录 wx.login({ success: res => { // 发送 res.code 到后台换取 openId, sessionKey, unionId ..
1.微信小程序--登录流程
最新发布
weixin_58738870的博客
01-29 1154
Api层：service内部实现：Api：service：Client远程调用：Web对外接口：（1）从请求头中获取到token字符串的两种方式：（2）Api（3）Service。
微信小程序-登录弹窗授权（组件）
12-01
在调用页面 json： "usingComponents": { "wx_empower": "/Component/wx_empower/wx_empower" } wxml： <!-- 微信授权 --> <wx_empower id="wx_empower" show="{{show_empower}}" force="{{true}}" bind:return_login="return_login"></wx_empower> js： 1、先判断是否已经登录，未登录直接调用show_empower:true即可弹出登录授权框 2、点击授权会请求获取手机号码，通过手机号码请求后台数据，若登录成功后 3、在页面调用return_login(e)方法，判断e携带的值是否请求成功。 4、若成show_empower变为false，弹窗会消失 注意： 1、force参数是控制是否强制登录。若非强制，点击组件空白处会关闭弹窗 2、里面已经封装好请求后端的登录数据，调用即可
详解小程序常见的登录方式
qq_16593939的博客
12-05 1万+
基于 openid 或 手机号码快捷登录获取手机号码前置条件如何解决多账号的问题讲解前端、后端、微信登录过程中完整交互流程，方便更好去理解小程序登录。
【微信小程序开发】之微信授权登陆
weixin_74352229的博客
10-23 1万+
微信授权登录是指用户通过微信账号登录第三方应用或网站的一种身份验证方式。当用户在第三方应用或网站上选择使用微信登录时，该应用或网站会跳转到微信登录页面，用户在此页面输入微信账号和密码进行登录。一旦用户成功登录并授权，第三方应用或网站就能够获得用户在微信上的基本信息，如昵称、头像等，并用于用户在应用或网站上的个性化服务。这种授权登录的方式方便用户快速登录第三方平台，同时减少了用户填写注册信息的麻烦。
小程序同一用户怎么会出现两个_微信小程序注册问题:名称问题
weixin_39862985的博客
12-04 5699
　 最近很多客户问到这个问题，我之前注册了公众号，现在又想注册一个小程序，小程序名称可以和公众号一样吗？下面我们就来说说这个问题。 小程序发布初期，小程序名称和公众号名称是不可以一样的，注册的时候会提示你名字已经注册，这也导致出现了一大堆奇奇怪怪的小程序名字，对用户而言很不方便查找到自己想要的小程序。 为了解决这一问题，目前微信官方又宣布，公众号、小程序在名称唯一的前提下，支持同主体的公众号与小程...
微信小程序不同身份登录，显示不同的tabbar（导航栏）
热门推荐
GQ_666的博客
03-29 2万+
微信小程序，不同身份登录不同的底部导航栏。初次遇到这个问题，菜鸟的我没有一丝丝头绪，看了几篇博客后，终于明白了。下面是总结的模板，拿去直接用就欧克。 比如一个小程序需要两个版本（用户版、商家版），并且能通过一个按钮在两个版本间进行切换，可能会用到这种方式。 此处以两个页面（index，logs）显示两种tabbar样式为例，通过切换按钮进行切换。 首先建一个template的文件夹，...
微信小程序 两种为对象属性赋值的方式详解
08-31
在微信小程序开发中，我们经常需要操作对象属性，特别是当数据绑定到视图时，对象属性的赋值显得尤为重要。本文将详细介绍两种为对象属性赋值的方法，并通过实例进行对比分析，帮助开发者更好地理解这两种方式。 ##...
优雅实现微信小程序动态tabBar，根据不同用户角色显示不同底部导航-更新版（支持自由组合总数超过5个tabBar菜单）
01-03
2、使用自定义底部导航custom-tab-bar优雅实现微信小程序动态tabBar。 3、实现自由组合tabBar菜单项目，支持自由组合总数超过5个tabBar菜单。 4、本示例是7个底部导航，分2种权限，权限1显示1，2，3；权限2显示4，5...
微信小程序前端解密获取手机号
06-03
微信小程序是一种轻量级的应用开发平台，由腾讯公司推出，主要应用于移动端，提供丰富的API接口和组件，使得开发者可以快速构建具有原生体验的应用。在微信小程序中，获取用户手机号是一项重要的功能，它涉及到用户...
微信小程序的刻度尺组件开发，体重计算，页面显示，底部弹窗两种用法
06-01
这些知识点对于提升微信小程序的用户体验至关重要。 首先，我们需要了解微信小程序的基本结构。一个小程序由多个页面组成，每个页面包含五个基本文件：json（配置文件）、wxss（样式表）、wxml（结构文件）、js...
微信小程序-微信小程序组件化解决方案
08-06
wx-component 一种微信小程序组件化解决方案 使用 拷贝文件 拷贝src路径下的所有文件到项目里，例如到libs/目录下 引用 在app.js中引用wx-component组件 app.js require("/libs/wx-component/index") ... App({ onLaunch() { }, globalData: { ... } }) 推荐的目录结构 ├─project 小程序前端 ├─components 业务功能组件 ├─login 登录组件 ├─index.wxss ├─index.wxml ├─index.js ├─pages 小程序页面 定义component /components/login/index.js module.exports = { // 组件名 // 也可以不填，不填写会用`components/X/index.js`中的X命名
微信小程序Go、微信小程序OpenCV。.zip
09-30
Go语言和OpenCV是两个不同的技术领域，但在这个场景下，它们被整合到微信小程序的开发中，以实现更高级的功能。 Go（Golang）是Google推出的一种静态类型、编译型、并发型且具有垃圾回收功能的编程语言。Go语言以其...
微信小程序登录界面的代码html,微信小程序用户登录组件
weixin_39929687的博客
06-05 2318
I 效果：每个需要判断登录的页面只需引入该组件，即可知道显示登录按钮还是页面信息。注意：这里不是登录页面，只是写的一个按钮组件，通过判断显示和隐藏按钮。流程图如下image.png效果图如下image.png登录过程html代码小程序授权登录主要通过button按钮绑定bindgetuserinfo方法实现。我们这边把登录按钮封装成了组件，所以通过isShowLogin变量控制按钮显示隐藏。使用微...
【微信小程序｜组件库】简易用户登录页面（1）
海到无边天作岸 山登绝顶我为峰
05-05 2604
<view class="login-box"> <view class="title"> <text>Login</text></view> <form> <view class="user-box"> <input type="text" name="" required="" placeholder="Username" /> </view> &l..
微信小程序前端登录模块设计
weixin_44719258的博客
09-13 1573
微信小程序登录基本上是每个小程序都必备的功能，但是随着业务的逐渐复杂，需要考虑的情况会越来越多，所以登录功能的健壮和高效是值得重点关注的，我会按照以往经验实现一个较优雅的登录方案
微信小程序实现一个简单的登录功能
weixin_71893790的博客
12-20 2399
微信小程序实现一个简单的登录功能
微信小程序实现微信和账号密码同时登录
Front_Yue的博客
01-07 1366
微信小程序是一种轻量级的应用程序，可以在微信中直接使用，无需下载和安装。在微信小程序中，用户可以使用微信账号登录，也可以使用账户密码登录。本文将介绍如何在微信小程序中实现微信和账户密码同时登录。在微信小程序中实现微信和账户密码同时登录，需要创建登录页面，使用微信提供的 API 获取用户的 OpenID 和 SessionKey，使用账户密码登录时需要验证用户的用户名和密码，保存登录凭证时需要注意安全性问题。通过以上步骤，可以实现微信和账户密码同时登录的功能。
微信小程序的登录（详细）
weixin_48210599的博客
08-12 689
微信小程序的登录（详细） 1，还是先从button按钮来开始实现的，button按钮弹框是一个组件，在组件中触发事件 <view class="xhy_btns" v-show={{isShow}}> <button type="primary" open-type="getUserInfo" bindgetuserinfo="getUserinfo">允许</button> <button type="default" catcht
微信小程序用户登录注册功能实现
- **什么是微信小程序**：微信小程序是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。小程序也可以看作是一种新的连接用户与服务的方式，它将微信的社交属性...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值