微信小程序-button opentype

最新推荐文章于 2025-10-16 13:03:21 发布
原创 最新推荐文章于 2025-10-16 13:03:21 发布 · 2.9k 阅读 · 7 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#小程序 #js

本文概述了微信小程序中open-type属性的最新发展，包括获取用户手机号、加密用户信息处理、getUserProfile方法的使用，以及授权页面和反馈功能。重点讲解了从2021年4月13日后信息加密和权限获取的注意事项。

文章目录

open-type=“contact”：打开客服会话窗口

在这里插入图片描述

open-type="share"触发用户转发：不能发送朋友圈

在这里插入图片描述

open-type="getPhoneNumber"获取用户手机号，配合bindgetphonenumber事件使用

我这边的id没认证，暂时不能获取。
获取到的手机号数据是加密后的数据，需要到服务端进行解密，解密后返回

在这里插入图片描述

open-type="getUserInfo"获取用户信息，配合bindgetuserinfo事件进行使用

ps:从21年4.13号之后返回的数据是加密的
在这里插入图片描述

新的获取用户信息方法，任意控件绑定监听事件，调用 wx.getUserProfile方法

官方文档

https://developers.weixin.qq.com/miniprogram/dev/api/open-api/user-info/wx.getUserProfile.html

  getinfo(){
    wx.getUserProfile({
      desc:"完善个人信息",
      success(e){
          console.log(e);
      }
    })
  },

在这里插入图片描述

open-type="openSetting"打开授权页面

在这里插入图片描述

open-type="feedback"打开意见反馈页面，目前只在真机可以

深入探究微信小程序button组件open - type 的开放能力
前端基地
03-04 1590
本文介绍微信小程序中按钮的 open-type 微信开放能力，包括 contact 打开客服会话、liveActivity 获取订阅消息 code 等多种类型，可实现转发、获取手机号、用户信息等功能，还能打开 APP、授权页、反馈页等，部分功能有回调或参数设置，含案例分析。
关于自定义客服会话contact同时兼容自动和人工客服使用
destinyego的专栏
11-28 5497
首先，我们知道，可以通过button中的属性open-type="contact"，实现小程序用户和小程序所有者客服对话。 <button open-type="contact">客服</button> 在没有任何程序干预的情况下， 客服消息可直接在网页版客服工具（https://mpkf.weixin.qq.com/）和小程序版客服工具（客服小助 手）查看并回复用户消息。 但是，有时有特殊需求，比如： 1、用户打开客服会话，默认给出提示信息 2、需要自定义客服消
微信小程序button标签open-type属性原理解析
10-15
主要介绍了微信小程序button标签open-type属性原理解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
微信小程序 Button 组件 open-type 完全指南：从用户信息获取到客服分享的实战应用
随喜
10-16 1180
全面讲解微信小程序 button 组件的 open-type 属性，涵盖用户信息获取、手机号授权、头像选择、分享转发、客服接入等核心功能。提供完整代码示例，解析最新隐私政策要求，分享实际开发中的注意事项和最佳实践，助你快速掌握小程序开放能力的正确使用方式。
微信小程序——button中的open-type
weixin_61972561的博客
05-15 3173
微信小程序——button中的open-type
小程序02/小程序 button组件与open-type属性介绍、rich-text组件介绍与属性描述
m0_64494670的博客
12-24 1911
小程序02/小程序 button组件与open-type属性介绍、rich-text组件介绍与属性描述、
微信小程序-绘制图片并分享下载（painter）
04-09
5. **下载功能**：微信小程序目前不直接支持图片下载，但可以通过跳转至一个预览页面，并利用`<button>`组件的`open-type="saveFile"`属性，让用户手动保存图片到本地。需要注意的是，要确保图片的URL是持久化的，...
微信小程序--open-type无法弹出授权框
lp-Strive的博客
07-07 4655
一、问题： 微信开发者工具中，调试基础库为2.15.0版本时，能弹出授权提示框，但发布后，在手机上查看就未弹出授权提示框？ 二、思考： 1、手机上调试基础库版本应是最新的，授权弹框getUserInfo方法可能在不同版本库中存在不支持问题。 2、查看小程序官网，发现在​2021年4月13日起，getUserInfo将不再弹出弹窗，并直接返回匿名的用户个人信息。也就是说open-type 和 getuserInfo 已经不会弹出授权框了 3、官方推荐使用wx.getUserProfile获取用户信.
微信小程序中添加客服按钮contact-button功能
12-10
小程序的客服系统，是微信做的非常成功的一个功能，开发者可以很方便的通过一行代码，就可实现客服功能。 1. 普通客服按钮添加 <button open-type='contact' session-from=''>客服-联系我们</button> ...
36|表单组件Button组件的open-type
weixin_43846020的博客
09-10 1273
button的open-type <button bindgetuserinfo="getUserInfo" open-type="getUserInfo"> 获取当前登录用户的信息</button> <button bindopensetting="openSetting" open-type="openSetting"> openSetting</button> // pages/form2/form2.js Page({ /**
小程序中button标签的open-type属性
yj_xy的博客
10-13 5510
小程序中button标签的open-type属性 open-type (微信开放能力)：合法值中的其中之一： 　　getUserInfo说明：引导用户授权 而获取用户信息，可以从bindgetuserinfo回调中获取到用户信息 而按钮的bindgetuserinfo属性 说明：用户点击该按钮时，会返回获取到的用户信息，回调的detail数据与wx.getUserInfo返回的一致，open-type="getUserInfo"时有效 如： 一： wxml...
关于微信小程序 navigator 的opentype的选择
m0_69934806的博客
07-19 1058
关于微信小程序制作中链接跳转的打开方式的详解.
关于open-type
lyy的博客
02-14 5568
原文：小程序新方法 open-type获取头像昵称 https://www.jianshu.com/p/e4657f16a82c 小程序自上线以来，官方一直在调整API，因此也出现了一批被废弃的接口，作为程序员的我们，此时此刻千万不能为这不断的变化而感到头疼，应当与时俱进，不断的更新自己的知识储备和应用技能。 参考文档：https://developers.weixin.qq.com/mi...
微信小程序上传头像 open-type=“chooseAvatar“
weixin_57575133的博客
02-27 3392
open-type="chooseAvatar" 获取微信头像上传图片
uni-app小程序button按钮的open-type有哪些好用的API
ggq53219的博客
08-31 1108
值的功能实现都依赖于微信小程序的API，因此在使用前需要确保已经正确地引入了微信小程序的SDK，并且在小程序的管理后台进行了相应的配置。：打开“意见反馈”页面，用户可提交反馈内容并上传日志，开发者可以登录小程序管理后台后进入左侧菜单“客服反馈”页面获取到反馈内容。的值可能会随着微信小程序的更新而发生变化，因此建议在使用前查阅最新的微信小程序官方文档以获取最准确的信息。：打开授权设置页，调起客户端小程序设置界面，返回用户设置的操作结果。：弹出授权弹窗，请求用户授权获取用户信息，可以从。回调中获取到用户信息。
微信按钮android代码实现原理,微信小程序button标签open-type实现原理
weixin_33019827的博客
05-27 338
这篇文章主要介绍了微信小程序button标签open-type属性原理解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下open-type (微信开放能力)：合法值中的其中之一：getUserInfo说明：引导用户授权 而获取用户信息，可以从bindgetuserinfo回调中获取到用户信息而按钮的bindgetuserinfo属性 说明：用户点...
小程序自定义实现open-type
kirinlau的专栏
12-17 4809
有个需求是重构小程序的某些页面，比如以下这种列表，之前都是支持copy的，导致代码比较臃肿，占用有限的空间且不好维护 我把组件库写好后，准备直接使用时发现有用到分享和反馈这种小程序原生button才有的属性即： open-type='feedback' open-type='share' 本来准备直接复用以前的来着，但是看代码很乱，就想着把它的功能在组件中直接实现好了，开始想着把已有的逻辑贴进去再加个if的属性就可以，臃肿得很， 最终理性战胜了我，试试其他实现方式，以下是我的ui组件库效果： 试着点了
微信小程序navigator的open-type跳转问题
瑞新の博客：bennyrhys
03-17 4891
值 说明 navigate 保留当前页面，跳转到应用内的某个页面 redirect 关闭当前页面，跳转到应用内的某个页面 reLaunch 关闭所有页面，打开到应用内的某个页面 switchTab 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面 navigator的open-type属性 可选值 ‘navigate’、‘redirect’、‘switchTab’，对应于wx.na...
微信小程序button open-type=chooseAvatar 图片路径转化为二进制到后端
最新发布
11-06
在微信小程序里，要把使用 `button open-type=chooseAvatar` 选择的图片路径转化为二进制数据并发送到后端，可按以下步骤实施： ### 1. 获取图片路径 借助 `button open-type=chooseAvatar` 让用户选择图片，同时在 `bindchooseavatar` 事件里获取图片路径。 ```html <button open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar"></button> ``` ### 2. 把图片路径转化为二进制数据 使用 `wx.getFileSystemManager().readFile` 方法将图片路径转化为二进制数据。 ### 3. 把二进制数据发送到后端 利用 `wx.request` 方法把二进制数据发送到后端。 以下是完整的代码示例： ```javascript Page({ data: { avatarUrl: '' }, onChooseAvatar(e) { const avatarUrl = e.detail.avatarUrl; this.setData({ avatarUrl }); this.sendAvatarToBackend(avatarUrl); }, sendAvatarToBackend(avatarUrl) { wx.getFileSystemManager().readFile({ filePath: avatarUrl, success: res => { const binaryData = res.data; wx.request({ url: 'https://your-backend-api-url', method: 'POST', data: binaryData, header: { 'Content-Type': 'application/octet-stream' }, success: response => { console.log('图片上传成功', response); }, fail: err => { console.error('图片上传失败', err); } }); }, fail: err => { console.error('读取图片失败', err); } }); } }); ``` ### 代码解释 1. **获取图片路径**：在 `onChooseAvatar` 方法中，通过 `e.detail.avatarUrl` 获取用户选择的图片路径。 2. **转化为二进制数据**：运用 `wx.getFileSystemManager().readFile` 方法读取图片文件，成功后得到二进制数据 `res.data`。 3. **发送到后端**：使用 `wx.request` 方法把二进制数据发送到后端，设置 `Content-Type` 为 `application/octet-stream`。
评论 2
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值