小程序面试题 | 19.精选小程序面试题

🤍 前端开发工程师（主业）、技术博主（副业）、已过CET6
🍨 阿珊和她的猫_CSDN个人主页
🕠 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》
🍚 蓝桥云课签约作者、已在蓝桥云课上架的前后端实战课程《Vue.js 和 Egg.js 开发企业级健康管理项目》、《带你从入门到实战全面掌握 uni-app》

小程序中如何实现用户登录态的保持？

在小程序中实现用户登录态的保持，可以通过调用微信提供的wx.login()方法获取用户登录凭证（code），然后调用wx.request({...})方法发送请求时附带该凭证来实现。

以下是一个实现用户登录态保持的示例：

1. 在wxml文件中添加一个按钮，用于用户登录：

<button bindtap="login">登录</button>

2. 在js文件中定义login方法，用于调用wx.login()方法获取用户登录凭证：

login: function () {
 wx.login({
   success: function (res) {
     console.log('登录成功', res);

     // 获取用户登录凭证
     const code = res.code;

     // 发送请求
     wx.request({
       url: 'https://example.com/api/login',
       data: {
         code: code,
       },
       success: function (res) {
         console.log('登录成功', res);
         // ...
       },
       fail: function (err) {
         console.error('登录失败', err);
       },
     });
   },
   fail: function (err) {
     console.error('登录失败', err);
   },
 });
},

3. 在wxml文件中添加一个按钮，用于获取用户信息：

<button bindtap="getUserInfo">获取用户信息</button>

4. 在js文件中定义getUserInfo方法，用于调用wx.getUserInfo()方法获取用户信息：

getUserInfo: function () {
 wx.getUserInfo({
   success: function (res) {
     console.log('获取用户信息成功', res);

     // 更新用户信息
     const userInfo = res.data;
     // ...
   },
   fail: function (err) {
     console.error('获取用户信息失败', err);
   },
 });
},

这样，用户就可以在小程序中实现用户登录态的保持，并在后续的请求中附带登录凭证来实现用户信息的获取和更新。注意，在实际开发中，需要根据你的需求和微信小程序的服务配置进行调整。

小程序中如何实现数据缓存和本地存储？

在小程序中，可以通过使用微信提供的wx.setStorage()和wx.getStorage()方法来实现数据缓存和本地存储。

1. 数据缓存：

使用wx.setStorage()方法将数据存储到本地，然后在需要时使用wx.getStorage()方法获取数据。

例如：

// 存储数据
wx.setStorage({
 key: 'userInfo',
 data: userInfo,
 success: function (res) {
   console.log('存储成功', res);
 },
 fail: function (err) {
   console.error('存储失败', err);
 },
});

// 获取数据
wx.getStorage({
 key: 'userInfo',
 success: function (res) {
   console.log('获取成功', res.data);
   // 使用获取到的数据
 },
 fail: function (err) {
   console.error('获取失败', err);
 },
});

2. 本地存储：

使用wx.setStorageSync()方法将数据存储到本地，然后在需要时使用wx.getStorageSync()方法获取数据。

例如：

// 存储数据
wx.setStorageSync({
 key: 'userInfo',
 data: userInfo,
});

// 获取数据
const userInfo = wx.getStorageSync('userInfo');
// 使用获取到的数据

注意，wx.setStorage()和wx.getStorage()方法在小程序中是非线程安全的，可能会存在数据不一致的情况。而wx.setStorageSync()和wx.getStorageSync()方法是线程安全的，但需要注意的是，wx.getStorageSync()方法会阻塞线程，会影响小程序的实时性能。