小程序学习笔记

1. 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.小程序的存储方式有哪些

1. 小程序缓存（wx.setStorageSync / wx.getStorageSync）：
   小程序提供了用于缓存数据的API，可以将数据以键值对的方式存储在本地缓存中。这些数据在小程序关闭后仍然可用，适用于存储较小且临时的数据。

2. 小程序本地存储（wx.setStorage / wx.getStorage）

4.小程序登录授权流程

1. 用户授权：小程序登录流程通常开始于用户点击登录按钮或需要登录的操作。在这一步骤中，小程序会向用户弹出授权请求，请求用户允许小程序获取其用户信息。用户可以选择授权或拒绝授权。

2. 获取临时登录凭证：一旦用户授权，小程序会调用相应的API（如wx.login()）获取用户的临时登录凭证。该凭证的有效期较短，通常为5分钟左右。

3. 服务器端验证：小程序将获取的临时登录凭证发送给自己的服务器。服务器端可以使用该凭证与微信服务器进行交互，以获取用户的唯一标识信息，例如OpenID、UnionID等。

4. 登录态维护：一旦服务器端验证成功并获取到用户的唯一标识信息，小程序将在客户端维护一个登录态，通常使用本地存储方式（如wx.setStorage()）保存用户登录状态，以便后续使用。

5.小程序常用api有哪些

1. 界面 API：

   • wx.showToast：显示消息提示框。
   • wx.showModal：显示模态对话框。
   • wx.showLoading：显示加载提示框。
   • wx.navigateTo、wx.redirectTo：页面跳转。
   • wx.createAnimation：创建动画。
   • wx.createSelectorQuery：创建选择器查询实例。

2. 网络请求 API：

   • wx.request：发起网络请求。
   • wx.uploadFile：上传文件。
   • wx.downloadFile：下载文件。
   • wx.connectSocket：创建一个 WebSocket 连接。

3. 数据存储 API：

   • wx.setStorageSync、wx.getStorageSync：同步存储和读取本地数据。
   • wx.setStorage、wx.getStorage：异步存储和读取本地数据。
   • wx.removeStorageSync、wx.clearStorageSync：删除本地存储的数据。

4. 位置和地图 API：

   • wx.getLocation：获取当前的地理位置。
   • wx.chooseLocation：打开地图选择位置。
   • wx.openLocation：使用内置地图查看位置。

5. 设备 API：

   • wx.getSystemInfo：获取设备信息。
   • wx.scanCode：启动条码/二维码扫描。
   • wx.vibrateShort、wx.vibrateLong：控制手机震动。
   • wx.getNetworkType：获取网络类型。

6. 媒体 API：

   • wx.chooseImage：选择图片。
   • wx.previewImage：预览图片。
   • wx.createVideoContext：创建视频上下文。

7. 开放能力 API：

   • wx.login：登录接口，获取用户登录凭证。
   • wx.getUserInfo：获取用户信息。
   • wx.showShareMenu：显示转发按钮。
   • wx.getShareInfo：获取转发详细信息。

 6.小程序如何实现组件通信

全局数据或状态管理：使用小程序提供的全局数据或状态管理机制，如 getApp() 方法获取全局 App 实例，并在 App 实例中定义全局数据或状态，在不同组件之间可以通过共享这些数据或状态进行通信。

7.小程序有哪些常用组件

1. 视图容器类组件：

   • View：页面中的容器，类似于 <div> 标签。
   • ScrollView：可滚动的视图容器。
   • Swiper：滑块视图容器，用于展示轮播图等滑动内容。

2. 基础内容类组件：

   • Text：用于显示文本内容。
   • Icon：图标组件，用于展示矢量图标。
   • Progress：进度条组件，显示操作的进度状态。

3. 表单组件：

   • Button：按钮组件，用于触发用户交互操作。
   • Input：输入框组件，用于接收用户输入。
   • Checkbox：复选框组件。
   • Radio：单选框组件。
   • Picker：选择器组件，用于从列表中选择一个或多个值。
   • Switch：开关组件，用于切换开关状态。

4. 展示类组件：

   • Image：图片组件，用于展示图片。
   • Audio：音频组件，用于播放音频。
   • Video：视频组件，用于播放视频。
   • Map：地图组件，用于展示地理位置信息。

5. 导航类组件：

   • Navigator：导航组件，用于跳转到其他页面。
   • TabBar：底部导航栏组件，用于切换主页面。

6. 操作反馈类组件：

   • Toast：轻提示组件，用于显示短时间的提示信息。
   • Modal：模态框组件，用于显示弹窗信息。
   • ActionSheet：操作菜单组件，用于展示多个操作选项。

8.小程序的open-type有哪些api?

1. open-type=“navigate”: 点击后跳转到指定页面。可以使用该属性将按钮或其他组件设定为跳转到其他页面的功能。

2. open-type=“redirect”: 点击后关闭当前页面，跳转到指定页面。与navigate不同的是，redirect会关闭当前页面，而navigate会保留当前页面在页面栈中。

3. open-type=“switchTab”: 点击后跳转到指定的tabBar页面。可以将按钮设定为跳转到tabBar页面的功能。

4. open-type=“reLaunch”: 点击后关闭所有页面，跳转到指定页面。与redirect类似，但reLaunch会关闭所有页面。

5. open-type=“navigateBack”: 点击后返回上一页面。可以设置按钮为返回上一页面的功能。

6. open-type=“getPhoneNumber”: 点击后获取用户手机号码，需要用户授权同意。用于实现获取用户手机号的功能。

7. open-type=“getUserInfo”: 点击后获取用户信息，需要用户授权同意。可以获取用户的昵称、头像等信息。

8. open-type=“contact”: 点击后打开客服会话界面，用于与客服进行对话。

9. open-type=“launchApp”: 点击后打开其他应用程序。可以是跳转到其他小程序、打开其他App等。

9.小程序上传遇到的难点是什么？

1. 体积限制: 小程序平台对小程序的体积有一定的限制，超过限制会导致无法上传成功。开发者需要注意控制小程序的体积，确保在规定范围内。

1. 小程序要求压缩包体积不能大于2M，否则无法发布

2. 实际开发中小程序体积如果大于2M就需要使用分包机制进行发布上传

3. 分包后可解决2M限制，并且能分包加载内容，提高性能

4. 分包后单个包的体积不能大于2M

5. 分包后所有包的体积不能大于20M 

1. 代码和资源优化: 小程序的代码和资源需要进行优化，以减小体积和提升性能。对于大型或复杂的小程序，可能需要精简代码和压缩资源，以达到上传要求。

1. 代码压缩和合并：使用工具对代码进行压缩和合并，如使用 JavaScript 压缩工具（如 UglifyJS）来删除空格、注释和不必要的字符，同时可以将多个 JavaScript 文件合并为一个文件，减少 HTTP 请求次数，提高加载速度。

2. 资源压缩和合并：对小程序中的图片、音频、视频等资源进行压缩和合并，以减小文件大小。可以使用图片压缩工具（如 TinyPNG）来压缩图片，使用音频和视频编码工具（如 ffmpeg）进行优化和压缩。

3. 按需加载：将小程序中的功能模块进行按需加载，即在用户需要使用时再动态加载相应模块的代码和资源。通过按需加载可以延迟加载部分代码，减少初始加载体积，并提高小程序的启动速度。可以使用小程序提供的动态加载功能或自行实现按需加载逻辑。

4. 懒加载：对于长页面或复杂页面，可以采用懒加载的方式，即延迟加载页面中的一些内容或组件。这样可以提高初始渲染速度，避免一次性加载过多的内容和组件，降低首次加载的体积。

5. 资源缓存：合理利用小程序的资源缓存机制，将常用的资源文件缓存到本地，减少重复请求和加载。可以通过设置合适的缓存策略，如设置 Cache-Control 标头、使用 Service Worker 等，来实现资源的缓存和离线访问。

6. 代码分包：将小程序的代码划分为多个分包，按照业务逻辑或功能进行划分。将一些冷门功能或页面放在分包中，使用时再进行动态加载。通过代码分包可以有效控制初始加载的体积，提高小程序的启动速度。

7. 资源的延迟加载：对于一些非首次展示或交互不紧急的图片、音频、视频等资源，可以将其延迟加载，等页面渲染完成后再进行加载。这样可以减少页面初始加载的体积和时间，提高用户体验。

1. 兼容性问题: 小程序需要兼容各种不同的设备和平台，包括不同版本的操作系统和不同分辨率的屏幕。确保小程序在各种环境下都可以正常运行，并提供良好的用户体验是一个挑战。

1. 平台兼容性：小程序在不同的平台（如微信、支付宝、百度等）上运行，每个平台可能存在一些差异和特殊要求。开发者需要仔细阅读每个平台的文档和开发指南，了解其特性和限制，并做相应的适配和调整。在开发过程中，应尽量避免使用平台特有的 API 或特性，或提供相应的兼容处理。

2. 操作系统和设备兼容性：小程序需要在不同的操作系统（如 iOS、Android）和设备上正常运行，包括不同版本的操作系统和不同分辨率的屏幕。开发者需要进行设备和系统的测试，在常见的设备和操作系统版本上进行兼容性验证，确保小程序在不同设备上都有良好的用户体验。

3. 浏览器兼容性：小程序在微信客户端内运行，因此需要遵循微信环境的兼容性要求。开发者应使用微信开发者工具进行测试，并确保小程序的功能和样式在微信客户端上正常显示和运行。

4. Web 标准兼容性：小程序使用的是类似于 Web 开发的技术栈（如 HTML、CSS、JavaScript），因此需要考虑和遵循 Web 标准的兼容性要求。开发者应遵循最新的 Web 标准规范，在多个主流浏览器上进行测试，并使用适当的 Polyfill 或垫片库来填补一些标准或 API 的差异。

5. 版本迭代和更新：小程序平台会不断迭代和更新，可能会引入新的功能、修复问题或改变规则和要求。开发者需要及时了解最新的版本更新内容，并对小程序进行相应的版本迭代和更新，以保持与平台的兼容性。

6. 测试和用户反馈：进行充分的测试是解决兼容性问题的关键。开发者可以使用真实设备、虚拟机或云测试平台等工具进行多样化的测试，发现和解决兼容性问题。此外，还可以关注用户的反馈和问题报告，及时对用户遇到的兼容性问题进行修复和优化。

1. 安全性要求: 小程序平台要求小程序具备一定的安全性，不允许包含恶意代码、违规内容或潜在的安全风险。开发者需要通过代码审查等方式来确保小程序的安全性，以通过上传审核。

1. 用户数据保护：小程序必须保护用户的个人信息和隐私数据。开发者应遵循相关法律法规，如个人信息保护法（PIPA）、通信保密法等，对用户数据进行合规和安全的处理、存储和传输。敏感信息如密码等应进行加密存储。

2. 权限管理：小程序需要合理管理和控制用户数据的访问权限。开发者应按照"最小权限原则"，只收集和使用必要的数据，并在用户授权的范围内进行操作。同时，要确保用户清楚知晓授权的范围和目的，并提供相应的隐私政策和用户协议。

3. 安全更新和漏洞修复：开发者应及时关注小程序平台的安全更新和漏洞修复通知，并及时更新小程序的版本，以修复已知的漏洞和安全问题。此外，开发者还应保持对第三方库和依赖组件的更新和维护，以避免因为第三方漏洞导致的安全问题。

4. 接口安全：小程序与后端服务器间的数据传输应使用安全的通信协议（如 HTTPS），确保数据传输的机密性和完整性。开发者还应对网络请求进行校验和验证，防止恶意篡改或伪造数据。

5. 防止恶意代码：开发者应避免在小程序中使用恶意代码或存在安全风险的功能。审查和限制用户上传的内容，避免恶意文件或恶意链接的传播。此外，对于小程序中使用的第三方组件和插件，要审查其安全性，并从可信的来源获取。

6. 安全监控和日志记录：开发者应配置合适的安全监控和日志记录机制，及时发现和记录异常操作、攻击行为或系统漏洞，并采取相应的应对和处理措施。

1. 网络请求限制: 小程序的网络请求也受到一定的限制，包括请求频率、并发连接数等。确保小程序在网络请求方面符合平台的规定，避免因为超出限制而导致上传失败。

1. 跨域请求限制：小程序默认情况下只能请求自身域名下的接口，无法直接跨域请求其他域名下的接口。这是因为小程序使用了同源策略，为了保护用户数据和防止恶意攻击，默认禁止跨域请求。如果需要跨域请求，可以通过后台服务器设置 CORS（跨域资源共享）或通过小程序的接口代理功能来解决。

2. HTTPS安全要求：小程序要求所有的网络请求必须使用HTTPS协议进行传输，以保障数据的机密性和完整性。使用非HTTPS的请求将被屏蔽或拒绝访问。开发者需要确保后台服务器具备有效的SSL证书，以支持HTTPS请求。

3. 限制的域名和IP访问列表：小程序有一个白名单机制，开发者需要在小程序管理后台配置允许的域名列表，访问限制仅限于白名单中的域名和IP地址。这是为了防止恶意请求和保护用户数据安全。

4. 限制的并发请求数量：为了避免网络请求过多导致应用性能下降，小程序对同时发起的网络请求做了限制。具体的限制会根据小程序的版本和场景而有所不同，开发者需要参考官方文档以获取最新的限制信息。

5. 请求超时限制：小程序对网络请求的超时时间有限制。如果请求时间超过设定的超时时间，请求将被中断并自动失败。开发者需要合理设置网络请求的超时时间，以确保及时响应和避免请求被中断。

1. 依赖和插件管理: 如果小程序依赖于第三方库或插件，在上传小程序时需要确保依赖的正确版本和不违反平台的规定。管理依赖和插件的使用和更新也是一个挑战。

1. npm 依赖管理：

   • 小程序开发者工具基于 Node.js 环境，可以使用 npm（Node Package Manager）进行依赖管理。
   • 开发者可以在小程序项目中创建一个名为 package.json 的文件，并在其中定义项目所需的依赖项。
   • 使用 npm 能够方便地引入、更新和管理第三方库或工具，例如网络请求库、日期处理库等。
   • 小程序开发者工具会自动将 npm 依赖构建到小程序项目中的 miniprogram_npm 目录下，可以直接在小程序代码中使用。

2. 小程序插件：

   • 小程序提供了插件机制，允许开发者在小程序中引入第三方的功能模块，以扩展小程序的功能。
   • 开发者可以通过在小程序后台申请并配置插件，然后在小程序代码中引用插件提供的 API。
   • 插件可以是公共插件（由其他开发者开发并发布的）或私有插件（开发者自己开发并在自己的小程序中使用）。
   • 引入插件后，可以像使用普通的小程序组件一样，在页面中使用插件提供的功能。