-
Page 生命周期:
-
onLoad: 页面加载时触发,只会触发一次。可以在该生命周期函数中进行页面初始化的操作。
-
onShow: 页面显示时触发,每次打开页面都会触发。可以在该生命周期函数中进行页面数据的刷新。
-
onReady: 页面初次渲染完成时触发,只会触发一次。可以在该生命周期函数中进行页面渲染完成后的操作。
-
onHide: 页面隐藏时触发,当页面被其他页面覆盖时会触发。可以在该生命周期函数中进行页面隐藏后的操作。
-
onUnload: 页面卸载时触发,当页面被关闭或跳转到其他非tab页时会触发。可以在该生命周期函数中进行页面卸载后的清理操作。
-
onPullDownRefresh: 下拉刷新时触发,用户下拉页面时可以触发该生命周期函数。可以在该生命周期函数中执行相关刷新操作。
-
onReachBottom: 上拉触底时触发,当页面滚动到底部时可以触发该生命周期函数,可用于加载更多数据。
-
onShareAppMessage: 用户点击分享按钮或右上角分享菜单时触发,可以返回自定义的分享信息。
-
onPageScroll: 页面滚动时触发,可以获取当前页面的滚动位置和滚动方向等信息。
-
onResize: 页面尺寸改变时触发,如屏幕旋转时会触发。
-
onTabItemTap: 当前是 tab 页时,点击 tab 时触发。
-
2.小程序页面跳转方式 以及传参
对于非底部tab页面跳转使用wx.navigateTo 跳转, 底部tab页面跳转使用 wx.switchTab,页面重定向使用wx.redirectTo 跳转,页面传参是在url后面拼接参数,然后在目标页面的onLoad生命周期函数中可以通过options获取参数:
3.小程序的存储方式有哪些
-
小程序缓存(wx.setStorageSync / wx.getStorageSync):
小程序提供了用于缓存数据的API,可以将数据以键值对的方式存储在本地缓存中。这些数据在小程序关闭后仍然可用,适用于存储较小且临时的数据。 -
小程序本地存储(wx.setStorage / wx.getStorage)
4.小程序登录授权流程
-
用户授权:小程序登录流程通常开始于用户点击登录按钮或需要登录的操作。在这一步骤中,小程序会向用户弹出授权请求,请求用户允许小程序获取其用户信息。用户可以选择授权或拒绝授权。
-
获取临时登录凭证:一旦用户授权,小程序会调用相应的API(如
wx.login()
)获取用户的临时登录凭证。该凭证的有效期较短,通常为5分钟左右。 -
服务器端验证:小程序将获取的临时登录凭证发送给自己的服务器。服务器端可以使用该凭证与微信服务器进行交互,以获取用户的唯一标识信息,例如OpenID、UnionID等。
-
登录态维护:一旦服务器端验证成功并获取到用户的唯一标识信息,小程序将在客户端维护一个登录态,通常使用本地存储方式(如
wx.setStorage()
)保存用户登录状态,以便后续使用。
5.小程序常用api有哪些
-
界面 API:
wx.showToast
:显示消息提示框。wx.showModal
:显示模态对话框。wx.showLoading
:显示加载提示框。wx.navigateTo
、wx.redirectTo
:页面跳转。wx.createAnimation
:创建动画。wx.createSelectorQuery
:创建选择器查询实例。
-
网络请求 API:
wx.request
:发起网络请求。wx.uploadFile
:上传文件。wx.downloadFile
:下载文件。wx.connectSocket
:创建一个 WebSocket 连接。
-
数据存储 API:
wx.setStorageSync
、wx.getStorageSync
:同步存储和读取本地数据。wx.setStorage
、wx.getStorage
:异步存储和读取本地数据。wx.removeStorageSync
、wx.clearStorageSync
:删除本地存储的数据。
-
位置和地图 API:
wx.getLocation
:获取当前的地理位置。wx.chooseLocation
:打开地图选择位置。wx.openLocation
:使用内置地图查看位置。
-
设备 API:
wx.getSystemInfo
:获取设备信息。wx.scanCode
:启动条码/二维码扫描。wx.vibrateShort
、wx.vibrateLong
:控制手机震动。wx.getNetworkType
:获取网络类型。
-
媒体 API:
wx.chooseImage
:选择图片。wx.previewImage
:预览图片。wx.createVideoContext
:创建视频上下文。
-
开放能力 API:
wx.login
:登录接口,获取用户登录凭证。wx.getUserInfo
:获取用户信息。wx.showShareMenu
:显示转发按钮。wx.getShareInfo
:获取转发详细信息。
6.小程序如何实现组件通信
全局数据或状态管理:使用小程序提供的全局数据或状态管理机制,如 getApp()
方法获取全局 App 实例,并在 App 实例中定义全局数据或状态,在不同组件之间可以通过共享这些数据或状态进行通信。
7.小程序有哪些常用组件
-
视图容器类组件:
- View:页面中的容器,类似于
<div>
标签。 - ScrollView:可滚动的视图容器。
- Swiper:滑块视图容器,用于展示轮播图等滑动内容。
- View:页面中的容器,类似于
-
基础内容类组件:
- Text:用于显示文本内容。
- Icon:图标组件,用于展示矢量图标。
- Progress:进度条组件,显示操作的进度状态。
-
表单组件:
- Button:按钮组件,用于触发用户交互操作。
- Input:输入框组件,用于接收用户输入。
- Checkbox:复选框组件。
- Radio:单选框组件。
- Picker:选择器组件,用于从列表中选择一个或多个值。
- Switch:开关组件,用于切换开关状态。
-
展示类组件:
- Image:图片组件,用于展示图片。
- Audio:音频组件,用于播放音频。
- Video:视频组件,用于播放视频。
- Map:地图组件,用于展示地理位置信息。
-
导航类组件:
- Navigator:导航组件,用于跳转到其他页面。
- TabBar:底部导航栏组件,用于切换主页面。
-
操作反馈类组件:
- Toast:轻提示组件,用于显示短时间的提示信息。
- Modal:模态框组件,用于显示弹窗信息。
- ActionSheet:操作菜单组件,用于展示多个操作选项。
8.小程序的open-type有哪些api?
-
open-type=“navigate”: 点击后跳转到指定页面。可以使用该属性将按钮或其他组件设定为跳转到其他页面的功能。
-
open-type=“redirect”: 点击后关闭当前页面,跳转到指定页面。与navigate不同的是,redirect会关闭当前页面,而navigate会保留当前页面在页面栈中。
-
open-type=“switchTab”: 点击后跳转到指定的tabBar页面。可以将按钮设定为跳转到tabBar页面的功能。
-
open-type=“reLaunch”: 点击后关闭所有页面,跳转到指定页面。与redirect类似,但reLaunch会关闭所有页面。
-
open-type=“navigateBack”: 点击后返回上一页面。可以设置按钮为返回上一页面的功能。
-
open-type=“getPhoneNumber”: 点击后获取用户手机号码,需要用户授权同意。用于实现获取用户手机号的功能。
-
open-type=“getUserInfo”: 点击后获取用户信息,需要用户授权同意。可以获取用户的昵称、头像等信息。
-
open-type=“contact”: 点击后打开客服会话界面,用于与客服进行对话。
-
open-type=“launchApp”: 点击后打开其他应用程序。可以是跳转到其他小程序、打开其他App等。
9.小程序上传遇到的难点是什么?
-
体积限制: 小程序平台对小程序的体积有一定的限制,超过限制会导致无法上传成功。开发者需要注意控制小程序的体积,确保在规定范围内。
-
小程序要求压缩包体积不能大于2M,否则无法发布
-
实际开发中小程序体积如果大于2M就需要使用分包机制进行发布上传
-
分包后可解决2M限制,并且能分包加载内容,提高性能
-
分包后单个包的体积不能大于2M
-
分包后所有包的体积不能大于20M
-
代码和资源优化: 小程序的代码和资源需要进行优化,以减小体积和提升性能。对于大型或复杂的小程序,可能需要精简代码和压缩资源,以达到上传要求。
-
代码压缩和合并:使用工具对代码进行压缩和合并,如使用 JavaScript 压缩工具(如 UglifyJS)来删除空格、注释和不必要的字符,同时可以将多个 JavaScript 文件合并为一个文件,减少 HTTP 请求次数,提高加载速度。
-
资源压缩和合并:对小程序中的图片、音频、视频等资源进行压缩和合并,以减小文件大小。可以使用图片压缩工具(如 TinyPNG)来压缩图片,使用音频和视频编码工具(如 ffmpeg)进行优化和压缩。
-
按需加载:将小程序中的功能模块进行按需加载,即在用户需要使用时再动态加载相应模块的代码和资源。通过按需加载可以延迟加载部分代码,减少初始加载体积,并提高小程序的启动速度。可以使用小程序提供的动态加载功能或自行实现按需加载逻辑。
-
懒加载:对于长页面或复杂页面,可以采用懒加载的方式,即延迟加载页面中的一些内容或组件。这样可以提高初始渲染速度,避免一次性加载过多的内容和组件,降低首次加载的体积。
-
资源缓存:合理利用小程序的资源缓存机制,将常用的资源文件缓存到本地,减少重复请求和加载。可以通过设置合适的缓存策略,如设置 Cache-Control 标头、使用 Service Worker 等,来实现资源的缓存和离线访问。
-
代码分包:将小程序的代码划分为多个分包,按照业务逻辑或功能进行划分。将一些冷门功能或页面放在分包中,使用时再进行动态加载。通过代码分包可以有效控制初始加载的体积,提高小程序的启动速度。
-
资源的延迟加载:对于一些非首次展示或交互不紧急的图片、音频、视频等资源,可以将其延迟加载,等页面渲染完成后再进行加载。这样可以减少页面初始加载的体积和时间,提高用户体验。
-
兼容性问题: 小程序需要兼容各种不同的设备和平台,包括不同版本的操作系统和不同分辨率的屏幕。确保小程序在各种环境下都可以正常运行,并提供良好的用户体验是一个挑战。
-
平台兼容性:小程序在不同的平台(如微信、支付宝、百度等)上运行,每个平台可能存在一些差异和特殊要求。开发者需要仔细阅读每个平台的文档和开发指南,了解其特性和限制,并做相应的适配和调整。在开发过程中,应尽量避免使用平台特有的 API 或特性,或提供相应的兼容处理。
-
操作系统和设备兼容性:小程序需要在不同的操作系统(如 iOS、Android)和设备上正常运行,包括不同版本的操作系统和不同分辨率的屏幕。开发者需要进行设备和系统的测试,在常见的设备和操作系统版本上进行兼容性验证,确保小程序在不同设备上都有良好的用户体验。
-
浏览器兼容性:小程序在微信客户端内运行,因此需要遵循微信环境的兼容性要求。开发者应使用微信开发者工具进行测试,并确保小程序的功能和样式在微信客户端上正常显示和运行。
-
Web 标准兼容性:小程序使用的是类似于 Web 开发的技术栈(如 HTML、CSS、JavaScript),因此需要考虑和遵循 Web 标准的兼容性要求。开发者应遵循最新的 Web 标准规范,在多个主流浏览器上进行测试,并使用适当的 Polyfill 或垫片库来填补一些标准或 API 的差异。
-
版本迭代和更新:小程序平台会不断迭代和更新,可能会引入新的功能、修复问题或改变规则和要求。开发者需要及时了解最新的版本更新内容,并对小程序进行相应的版本迭代和更新,以保持与平台的兼容性。
-
测试和用户反馈:进行充分的测试是解决兼容性问题的关键。开发者可以使用真实设备、虚拟机或云测试平台等工具进行多样化的测试,发现和解决兼容性问题。此外,还可以关注用户的反馈和问题报告,及时对用户遇到的兼容性问题进行修复和优化。
-
安全性要求: 小程序平台要求小程序具备一定的安全性,不允许包含恶意代码、违规内容或潜在的安全风险。开发者需要通过代码审查等方式来确保小程序的安全性,以通过上传审核。
-
用户数据保护:小程序必须保护用户的个人信息和隐私数据。开发者应遵循相关法律法规,如个人信息保护法(PIPA)、通信保密法等,对用户数据进行合规和安全的处理、存储和传输。敏感信息如密码等应进行加密存储。
-
权限管理:小程序需要合理管理和控制用户数据的访问权限。开发者应按照"最小权限原则",只收集和使用必要的数据,并在用户授权的范围内进行操作。同时,要确保用户清楚知晓授权的范围和目的,并提供相应的隐私政策和用户协议。
-
安全更新和漏洞修复:开发者应及时关注小程序平台的安全更新和漏洞修复通知,并及时更新小程序的版本,以修复已知的漏洞和安全问题。此外,开发者还应保持对第三方库和依赖组件的更新和维护,以避免因为第三方漏洞导致的安全问题。
-
接口安全:小程序与后端服务器间的数据传输应使用安全的通信协议(如 HTTPS),确保数据传输的机密性和完整性。开发者还应对网络请求进行校验和验证,防止恶意篡改或伪造数据。
-
防止恶意代码:开发者应避免在小程序中使用恶意代码或存在安全风险的功能。审查和限制用户上传的内容,避免恶意文件或恶意链接的传播。此外,对于小程序中使用的第三方组件和插件,要审查其安全性,并从可信的来源获取。
-
安全监控和日志记录:开发者应配置合适的安全监控和日志记录机制,及时发现和记录异常操作、攻击行为或系统漏洞,并采取相应的应对和处理措施。
-
网络请求限制: 小程序的网络请求也受到一定的限制,包括请求频率、并发连接数等。确保小程序在网络请求方面符合平台的规定,避免因为超出限制而导致上传失败。
-
跨域请求限制:小程序默认情况下只能请求自身域名下的接口,无法直接跨域请求其他域名下的接口。这是因为小程序使用了同源策略,为了保护用户数据和防止恶意攻击,默认禁止跨域请求。如果需要跨域请求,可以通过后台服务器设置 CORS(跨域资源共享)或通过小程序的接口代理功能来解决。
-
HTTPS安全要求:小程序要求所有的网络请求必须使用HTTPS协议进行传输,以保障数据的机密性和完整性。使用非HTTPS的请求将被屏蔽或拒绝访问。开发者需要确保后台服务器具备有效的SSL证书,以支持HTTPS请求。
-
限制的域名和IP访问列表:小程序有一个白名单机制,开发者需要在小程序管理后台配置允许的域名列表,访问限制仅限于白名单中的域名和IP地址。这是为了防止恶意请求和保护用户数据安全。
-
限制的并发请求数量:为了避免网络请求过多导致应用性能下降,小程序对同时发起的网络请求做了限制。具体的限制会根据小程序的版本和场景而有所不同,开发者需要参考官方文档以获取最新的限制信息。
-
请求超时限制:小程序对网络请求的超时时间有限制。如果请求时间超过设定的超时时间,请求将被中断并自动失败。开发者需要合理设置网络请求的超时时间,以确保及时响应和避免请求被中断。
-
依赖和插件管理: 如果小程序依赖于第三方库或插件,在上传小程序时需要确保依赖的正确版本和不违反平台的规定。管理依赖和插件的使用和更新也是一个挑战。
-
npm 依赖管理:
- 小程序开发者工具基于 Node.js 环境,可以使用 npm(Node Package Manager)进行依赖管理。
- 开发者可以在小程序项目中创建一个名为
package.json
的文件,并在其中定义项目所需的依赖项。 - 使用 npm 能够方便地引入、更新和管理第三方库或工具,例如网络请求库、日期处理库等。
- 小程序开发者工具会自动将 npm 依赖构建到小程序项目中的
miniprogram_npm
目录下,可以直接在小程序代码中使用。
-
小程序插件:
- 小程序提供了插件机制,允许开发者在小程序中引入第三方的功能模块,以扩展小程序的功能。
- 开发者可以通过在小程序后台申请并配置插件,然后在小程序代码中引用插件提供的 API。
- 插件可以是公共插件(由其他开发者开发并发布的)或私有插件(开发者自己开发并在自己的小程序中使用)。
- 引入插件后,可以像使用普通的小程序组件一样,在页面中使用插件提供的功能。