简介：参考文档链接：csdn使用说明：文章中的用法是放在图片和文本上传中，我的用处是微信授权头像和昵称后记：感觉自己nc了，微信头像本来就是经过验证的，多过一遍没有意义，具体问题下方会说明。代码实例： <template> <view v if="openModal" class="wx authorization modal"> <view class="wam__mask" @touchmove.prevent="" @tap.stop="closeModal"></view> <! 内容区域 > <view class="wam__wrapper"> <! 关闭按钮 > <view class="wam__close btn" @tap.stop="closeModal"> <text class="tn icon close"></text> </view> <! 标题 > <view class="wam__title">获取您的昵称、头像</view> <! tips > <view class="wam__sub title"> 获取用户头像、昵称，主要用于向用户提供具有辨识度的用户中心界面 </view> <! 头像选择 > <view class="wam__avatar"> <view class="button shadow"> <button class="button" open type="chooseAvatar" @chooseavatar="chooseAvatarEvent"> <view v if="userInfo.avatar" class="avatar__image"> <image class="image" :src="userInfo.avatar" mode="aspectFill"></image> </view> <view v else class="avatar__empty"> <image class="image" src="https://cdn.nlark.com/yuque/0/2022/jpeg/280373/1668928062708 assets/web upload/764843cf 055a 4cb6 b5d3 dca528b33fd4.jpeg" mode="aspectFill"></image> </view> <view class="avatar icon"> <view class="tn icon camera fill"></view> </view> </button> </view> </view> <! 昵称输入 > <view class="wam__nickname"> <view class="nickname__data"> <input class="input" type="nickname" v model="inputNickname" placeholder="请输入昵称" placeholder style="color: #AAAAAA;" @change="handleNicknameChange"> </view> </view> <! 保存按钮 > <view class="wam__submit btn" :class="[{ 'disabled': !userInfo.avatar || !userInfo.nickname }]" hover class="tn btn hover class" :hover stay time="150" @tap.stop="submitUserInfo"> 保 存 </view> </view> </view> </template> <script> export default { options: { // 在微信小程序中将组件节点渲染为虚拟节点，更加接近Vue组件的表现(不会出现shadow节点下再去创建元素) virtualHost: true }, props: { value: { type: Boolean, default: false } }, data() { return { openModal: false, userInfo: { avatar: '', nickname: '' }, inputNickname: '' } }, watch: { value: { handler(val) { this.openModal = val }, immediate: true }, }, methods: { //选择昵称 handleNicknameChange(e) { const newNickname = e.detail.value; // 保存当前上下文的 this var that = this; wx.cloud.init({ env: "", }) if(newNickname){ console.log(newNickname) wx.cloud.callFunction({ name: 'checkTextSec', data: { content:newNickname }, success: (res) => { if (res.result.errCode === 0) { if (res.result.result.label === 100) { console.log('合法文本') that.userInfo.nickname = newNickname; } else { console.log('违法文本') } } else { console.log('其他异常') } }, fail: (e) => { console.log(e) } }) } }, // 头像选择 chooseAvatarEvent(e) { var imageUrl = e.detail.avatarUrl console.log(imageUrl) // 保存当前上下文的 this var that = this; //调用云函数checkIploadInfo，检测头像 uni.getImageInfo({ src: imageUrl, success: function(info) { // 使用 uni.request 获取图片数据 uni.request({ url: imageUrl, responseType: 'arraybuffer', success: function(response) { // 图片数据转换为 ArrayBuffer 格式的二进制数据 var arrayBuffer = response.data; wx.cloud.init({ env: "", }) wx.cloud.callFunction({ name: "checkUploadInfo", data: { contentType: `image/jpeg`, arrayBuffer: arrayBuffer }, success: (res) => { if (res.result.errCode === 0) { console.log('合法图片') that.userInfo.avatar = e.detail.avatarUrl } else if (res.result.errCode === 87014) { console.log('违法图片') uni.showToast({ title: '违规图片，请重新上传', icon: 'error', duration: 2000 }); } }, fail: () => { console.log('检测失败') uni.showToast({ title: '上传失败，请重新选择图片', icon: 'error', duration: 2000 }); } }) }, fail: function(error) { console.error("加载图片失败:", error); } }); }, fail: function(error) { console.error("获取图片信息失败:", error); } }); }, // 更新用户信息 submitUserInfo() { // 判断是否已经选择了用户头像和输入了用户昵称 if (!this.userInfo.avatar || !this.userInfo.nickname) { return uni.showToast({ icon: 'none', title: '请选择头像和输入用户信息' }) } // 更新完成事件 this.$emit('updated', this.userInfo) }, // 关闭弹框 closeModal() { this.$emit('input', false) }, } } </script>使用的是图鸟的微信授权组件，实际使用后发现了几个问题：首先第一个头像授权，我添加头像验证的原因就是会涉及到上传本地图片，然后实际实验之后发现如果是违规图片，压根不会触发@chooseavatar，会报错，没有任何返回值；而合规图片就可以正常触发，得到返回值。查看了请求接口，并不是本地上传接口，应该是先上传到微信那边检测没过。第二个文本检测，需要使用@change事件，其他事件都无法获得值；并且change会调用两次，第一次无返回值，第二次才会有值，不做判断会浪费验证次数。

简介：一、获取长短坐标​ 1.首先要去微信公众平台更新隐私协议，不然无法通过uni.getLocation获取长短坐标，协议更新审核完再次进入小程序会弹出位置授权​ 2.在manifest.json中更新授权信息和接口"mp weixin": { "permission": { "scope.userLocation": { "desc": "你的位置信息将用于小程序位置接口的效果展示" }, "scope.userFuzzyLocation": { "desc": "你的位置信息将用于小程序位置接口的效果展示" } }, "requiredPrivateInfos": ["chooseAddress","chooseLocation","getLocation"] },​ 3.通过uni.getLocation获取坐标​ 3.1.首先通过uni.authorize判断是否授权，未授权需要再次授权​ 3.2.使用国测局坐标gcj02获取ip所在地getLocation() { //验证是否有授权 console.log("开始获取授权") const that = this uni.authorize({ scope: 'scope.userLocation', // 获取地理信息必填的参数，其它参数见文档 success(res) { that.getLocationFn() }, // 授权失败 fail(err) { uni.showModal({ title: '温馨提示', content: '此功能需要授权后使用!', confirmText: '前去授权', success: (res) => { if (res.confirm) { uni.openSetting({ success: (res) => { console.log(res); that.getLocationFn() } }) } else { console.log('取消'); return false; } } }) return false; } }) }, getLocationFn() { const that = this console.log("获取地址了") uni.getLocation({ type: 'gcj02', // <map> 组件默认为国测局坐标gcj02 altitude: true, success(res) { // console.log('返回的位置信息', res) that.latitude = res.latitude that.longitude = res.longitude console.log(that.latitude + "," + that.longitude) that.getAddress() }, fail(res) { console.log('失败原因', res) } }) },二、使用腾讯地图api坐标逆解析申请开发者密钥（key）：申请密钥开通webserviceAPI服务：控制台 >应用管理 > 我的应用 >添加key > 勾选WebServiceAPI > 保存(小程序SDK需要用到webserviceAPI的部分服务，所以使用该功能的KEY需要具备相应的权限)下载微信小程序JavaScriptSDK，微信小程序JavaScriptSDK v1.1 JavaScriptSDK v1.2安全域名设置，在小程序管理后台 > 开发 > 开发管理 > 开发设置 > “服务器域名” 中设置request合法域名，添加https://apis.map.qq.com三、完整代码示例注2：官方和网上搜到的案例里都说把sdk放在onload中，实际操作后发现放在onload里面会导致出现reverseGeocoder方法找不到，直接放在请求上方更好import QQMapWX from '@/common/qqmap wx jssdk.min.js' let qqmapsdk; export default { data() { return { latitude: 0, longitude: 0 }; }, onLoad() { // qqmapsdk = new QQMapWX({ // key: '你的KEY' // }); // this.getLocation() }, mounted() { this.getLocation() }, methods: { getLocation() { //验证是否有授权 console.log("开始获取授权") const that = this uni.authorize({ scope: 'scope.userLocation', // 获取地理信息必填的参数，其它参数见文档 success(res) { that.getLocationFn() }, // 授权失败 fail(err) { uni.showModal({ title: '温馨提示', content: '此功能需要授权后使用!', confirmText: '前去授权', success: (res) => { if (res.confirm) { uni.openSetting({ success: (res) => { console.log(res); that.getLocationFn() } }) } else { console.log('取消'); return false; } } }) return false; } }) }, getLocationFn() { const that = this console.log("获取地址了") uni.getLocation({ type: 'gcj02', // <map> 组件默认为国测局坐标gcj02 altitude: true, success(res) { // console.log('返回的位置信息', res) that.latitude = res.latitude that.longitude = res.longitude console.log(that.latitude + "," + that.longitude) that.getAddress() }, fail(res) { console.log('失败原因', res) } }) }, getAddress() { console.log("获取城市") qqmapsdk = new QQMapWX({ key: '你的KEY' }); qqmapsdk.reverseGeocoder({ //必须要有这个，获取方式为选择WebServiceAPI后签名校验 sig:'你的SDK', location: { latitude: this.latitude, longitude: this.longitude }, success(res) { console.log(res.result.address_component.city) }, fail: (error) => { console.error(error); } }) },

简介：一、获取长短坐标​ 1.首先要去微信公众平台更新隐私协议，不然无法通过uni.getLocation获取长短坐标，协议更新审核完再次进入小程序会弹出位置授权​ 2.在manifest.json中更新授权信息和接口"mp weixin": { "permission": { "scope.userLocation": { "desc": "你的位置信息将用于小程序位置接口的效果展示" }, "scope.userFuzzyLocation": { "desc": "你的位置信息将用于小程序位置接口的效果展示" } }, "requiredPrivateInfos": ["chooseAddress","chooseLocation","getLocation"] },​ 3.通过uni.getLocation获取坐标​ 3.1.首先通过uni.authorize判断是否授权，未授权需要再次授权​ 3.2.使用国测局坐标gcj02获取ip所在地getLocation() { //验证是否有授权 console.log("开始获取授权") const that = this uni.authorize({ scope: 'scope.userLocation', // 获取地理信息必填的参数，其它参数见文档 success(res) { that.getLocationFn() }, // 授权失败 fail(err) { uni.showModal({ title: '温馨提示', content: '此功能需要授权后使用!', confirmText: '前去授权', success: (res) => { if (res.confirm) { uni.openSetting({ success: (res) => { console.log(res); that.getLocationFn() } }) } else { console.log('取消'); return false; } } }) return false; } }) }, getLocationFn() { const that = this console.log("获取地址了") uni.getLocation({ type: 'gcj02', // <map> 组件默认为国测局坐标gcj02 altitude: true, success(res) { // console.log('返回的位置信息', res) that.latitude = res.latitude that.longitude = res.longitude console.log(that.latitude + "," + that.longitude) that.getAddress() }, fail(res) { console.log('失败原因', res) } }) },二、使用腾讯地图api坐标逆解析申请开发者密钥（key）：申请密钥开通webserviceAPI服务：控制台 >应用管理 > 我的应用 >添加key > 勾选WebServiceAPI > 保存(小程序SDK需要用到webserviceAPI的部分服务，所以使用该功能的KEY需要具备相应的权限)下载微信小程序JavaScriptSDK，微信小程序JavaScriptSDK v1.1 JavaScriptSDK v1.2安全域名设置，在小程序管理后台 > 开发 > 开发管理 > 开发设置 > “服务器域名” 中设置request合法域名，添加https://apis.map.qq.com三、完整代码示例注2：官方和网上搜到的案例里都说把sdk放在onload中，实际操作后发现放在onload里面会导致出现reverseGeocoder方法找不到，直接放在请求上方更好import QQMapWX from '@/common/qqmap wx jssdk.min.js' let qqmapsdk; export default { data() { return { latitude: 0, longitude: 0 }; }, onLoad() { // qqmapsdk = new QQMapWX({ // key: '你的KEY' // }); // this.getLocation() }, mounted() { this.getLocation() }, methods: { getLocation() { //验证是否有授权 console.log("开始获取授权") const that = this uni.authorize({ scope: 'scope.userLocation', // 获取地理信息必填的参数，其它参数见文档 success(res) { that.getLocationFn() }, // 授权失败 fail(err) { uni.showModal({ title: '温馨提示', content: '此功能需要授权后使用!', confirmText: '前去授权', success: (res) => { if (res.confirm) { uni.openSetting({ success: (res) => { console.log(res); that.getLocationFn() } }) } else { console.log('取消'); return false; } } }) return false; } }) }, getLocationFn() { const that = this console.log("获取地址了") uni.getLocation({ type: 'gcj02', // <map> 组件默认为国测局坐标gcj02 altitude: true, success(res) { // console.log('返回的位置信息', res) that.latitude = res.latitude that.longitude = res.longitude console.log(that.latitude + "," + that.longitude) that.getAddress() }, fail(res) { console.log('失败原因', res) } }) }, getAddress() { console.log("获取城市") qqmapsdk = new QQMapWX({ key: '你的KEY' }); qqmapsdk.reverseGeocoder({ //必须要有这个，获取方式为选择WebServiceAPI后签名校验 sig:'你的SDK', location: { latitude: this.latitude, longitude: this.longitude }, success(res) { console.log(res.result.address_component.city) }, fail: (error) => { console.error(error); } }) },

简介：1、运行小程序出现Enable IDE Service (y/N) ESC[27DESC[27C解决方法：打开微信开发者工具 设置 >安全 >服务器端口

简介： var imgSrc = this.base64Img;//base64编码 var save = wx.getFileSystemManager(); var number = Math.random(); save.writeFile({ filePath: wx.env.USER_DATA_PATH + '/pic' + number + '.png', data: imgSrc, encoding: 'base64', success: res => { wx.saveImageToPhotosAlbum({ filePath: wx.env.USER_DATA_PATH + '/pic' + number + '.png', success: function (res) { wx.showToast({ title: '保存成功', }) }, fail: function (err) { console.log(err) } }) console.log(res) }, fail: err => { console.log(err) } })注：base64Img要去掉data:image/png;base64找到个文章写的一种解决方案，不过不是我这个问题的解决方案，码一下方便之后看看文章链接