移动软件开发-实验1

一、实验目标

1、学习使用快速启动模板创建小程序的方法;2、学习不使用模板手动创建小程序的方法。

 

二、实验步骤

列出实验的关键步骤、代码解析、截图。

1.注册小程序账号,获取AppID

登陆微信小程序官网,按照指引注册账号(一个邮箱只能注册一个小程序/公众号账号)

之后填写小程序基本信息,如果选择类型选择了游戏则会直接注册为小游戏账号切不能改为小程序。

image-20220817115926869

填写好基本信息后就可以到设置里查看appid了

image-20220817115953203

本次实验使用测试号,不使用云服务

2.自动创建小程序

image-20220817135244806

3.手动创建小程序

image-20220817120134163

(1)删除无用代码及布局调整

目录

image-20220817132925915

index.wxml

截图:

image-20220817133038783

代码解析:

<!--index.wxml--> <view class='container'> <image src="{{src}}" mode="widthFix"></image>图片链接 <text>{{name}}</text> <button open-type="getUserInfo" bindtap="getMyInfo">点击获取头像和昵称</button>注意是单击事件 </view>

index.wxss

截图:

image-20220817133330567

代码解析:

image-20220817133418773

效果:

image-20220817133531572

(2)添加单击事件,获取微信头像

index.js

image-20220817133729644

通过getUserProfile获取用户信息,代码分析见注释。

三、程序运行结果

列出程序的最终运行结果及截图。

image-20220817134016735image-20220817134035653

真机调试:

image-20220817134443934image-20220817134509006image-20220817134542010

 

四、问题总结与体会

描述实验过程中所遇到的问题,以及是如何解决的。有哪些收获和体会,对于课程的安排有哪些建议。

无法获取微信用户信息

img

img

小程序用户头像昵称获取规则调整公告 | 微信开放社区. Developers. https://developers.weixin.qq.com/community/develop/doc/00022c683e8a80b29bed2142b56c01?blockType=1&page=8#comment-list

getUserProfile(e) {

// 推荐使用wx.getUserProfile获取用户信息,开发者每次通过该接口获取用户个人信息均需用户确认,开发者妥善保管用户快速填写的头像昵称,避免重复弹窗

wx.getUserProfile({

desc: '展示用户信息', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写

success: (res) => {

console.log(res)

this.setData({

userInfo: res.userInfo,

hasUserInfo: true

})

}

})

},

getUserInfo(e) {

// 不推荐使用getUserInfo获取用户信息,预计自2021年4月13日起,getUserInfo将不再弹出弹窗,并直接返回匿名的用户个人信息

console.log(e)

this.setData({

userInfo: e.detail.userInfo,

hasUserInfo: true

})

}

微信小程序开发技术迭代更新非常快,需要不断学习。限制用户信息的获取在一定程度上保护了用户的信息安全。

posted @ 2022-08-17 13:55  satellite&  阅读(59)  评论(0)    收藏  举报