Mari kita bincangkan tentang proses log masuk kebenaran applet uniapp

Dengan populariti Internet mudah alih, program mini telah menjadi aplikasi yang sangat diperlukan dalam kehidupan seharian manusia. Sebagai pembangun, apabila melaksanakan fungsi program mini, ia selalunya melibatkan log masuk yang dibenarkan untuk mendapatkan maklumat pengguna dan melakukan beberapa operasi yang diperlukan. Artikel ini akan memperkenalkan anda kepada proses log masuk kebenaran applet uniapp.

1 Pengenalan kepada log masuk program mini yang dibenarkan

Log masuk program mini yang dibenarkan adalah salah satu senario yang paling biasa dalam pembangunan program mini, dan ia juga merupakan salah satu cara penting untuk mencapai interaksi dan pengalaman pengguna. Log masuk dibenarkan membolehkan program mini mendapatkan avatar, nama panggilan dan maklumat lain pengguna, dan menyediakan perkhidmatan yang lebih diperibadikan. Pada masa ini, terdapat dua cara utama untuk log masuk ke program mini: Log masuk dibenarkan WeChat dan log masuk dibenarkan nombor telefon mudah alih. Log masuk yang dibenarkan WeChat ialah kaedah log masuk rasmi yang disediakan oleh WeChat Pengguna boleh mengimbas kod QR untuk log masuk melalui WeChat, atau mereka boleh membenarkan log masuk secara langsung dalam program mini. Log masuk kebenaran nombor telefon mudah alih memerlukan pengguna memasukkan nombor telefon mudah alih dan kod pengesahan untuk pengesahan, dan kemudian log masuk.

2.Proses log masuk kebenaran applet Uniapp

Proses log masuk kebenaran applet uniapp terutamanya melibatkan langkah berikut:

2.1 Mendapatkan maklumat pengguna asas

Menggunakan API terbina dalam rangka kerja uniapp, anda boleh mendapatkan maklumat asas pengguna dengan mudah Maklumat berkaitan pengguna boleh diperoleh seperti berikut:

uni.getUserInfo({
  success: function (res) {
    console.log(res.userInfo);
  }
});

Kod ini hanya melaksanakan kaedah mendapatkan pengguna. maklumat Setelah pengguna diberi kuasa untuk log masuk, Program mini boleh mendapatkan nama panggilan, avatar dan maklumat lain dengan mudah.

2.2 Tentukan sama ada pengguna log masuk

Sebelum melakukan beberapa operasi yang diperlukan, kami perlu memastikan bahawa pengguna telah log masuk ke program mini Pada masa ini, kami perlu menentukan status log masuk pengguna. Kami boleh menggunakan storan tempatan untuk menentukan sama ada pengguna telah log masuk.

//判断用户是否登录
function isLoggedIn() {
  const token = uni.getStorageSync('token');
  return token ? true : false;
}

2.3 Minta pelayan untuk mendapatkan status log masuk

Jika pengguna belum log masuk atau status log masuk telah tamat tempoh, maka kita perlu meminta pelayan melalui antara muka log masuk untuk mendapatkan status log masuk pengguna. Semasa meminta antara muka log masuk, anda juga perlu mendapatkan kod kelayakan log masuk sementara melalui antara muka log masuk yang disediakan oleh uniapp.

//获取登录凭证code
uni.login({
  provider: 'weixin',
  success(loginRes) {
    const code = loginRes.code;
    //调用登录接口
    uni.request({
      url: '接口地址',
      data: {
        code: code,
      },
      success: function (res) {
        console.log('response from server', res);
        //将登录凭证存储到本地
        uni.setStorageSync('token', res.data.access_token);
      },
      fail: function (err) {
        console.log('err', err);
      }
    });
  },
  fail(err) {
    console.log('login fail', err);
  }
});

2.4 Lompat ke halaman kebenaran

Setelah menentukan sama ada pengguna telah log masuk, jika didapati pengguna belum log masuk atau status log masuk telah tamat tempoh, maka kami perlu melompat ke halaman kebenaran dan log masuk yang dibenarkan.

//跳转到授权页面
function toAuthorizationPage(){
    uni.navigateTo({
        url: '/pages/authorize/index',
        success:function(res){
            console.log('navigate success',res);
        },
        fail:function(err){
            console.log('navigate fail',err);
        }
    })
}

2.5 Benarkan log masuk dan dapatkan maklumat pengguna

Selepas melompat ke halaman kebenaran, kami boleh menghubungi API yang disediakan oleh WeChat untuk membenarkan pengguna log masuk dengan kebenaran WeChat dan mendapatkan maklumat kebenaran pengguna. Langkah-langkah khusus untuk mendapatkan maklumat pengguna adalah seperti berikut:

1. Gunakan wx.getUserInfo untuk mendapatkan maklumat asas pengguna
2. Selepas mendapatkan maklumat asas pengguna, serahkan kepada pelayan untuk maklumat pengguna Daftar atau kemas kini.

//获取用户信息
wx.getUserInfo({
    success:function(res){
        var userInfo = res.userInfo;
        //将用户信息提交到服务器进行注册或更新
        uni.request({
            url:'用户信息提交地址',
            method:"post",
            data:userInfo,
            success:function(res){
                console.log('response from server',res);
            },
            fail:function(err){
                console.log('err',err);
            }
        })
    },
    fail:function(err){
        console.log('get user info fail',err);
    }
})

3. Ringkasan

Log masuk dibenarkan ialah fungsi teras pembangunan applet Uniapp dan cara penting untuk mencapai interaksi dan pengalaman pengguna. Proses log masuk dibenarkan yang diperkenalkan dalam artikel ini boleh memberikan beberapa rujukan untuk program mini anda, menjadikannya lebih mudah untuk anda melaksanakan fungsi log masuk yang dibenarkan. Sudah tentu, disebabkan oleh panjang artikel ini yang terhad, masih terdapat banyak butiran untuk dipertimbangkan dalam fungsi log masuk yang dibenarkan. Adalah disyorkan agar pembangun terus meneroka dan berlatih dalam amalan tertentu.

Atas ialah kandungan terperinci Mari kita bincangkan tentang proses log masuk kebenaran applet uniapp. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!