위 챗 애플 릿 홈 페이지 데이터 초기 화 실패 해결 방법

문제 설명
사용자 가 처음 시작 한 후에 다시 애플 릿 에 들 어 갈 때 저 희 는 보통 사용자 openid 나 유 니 온 id 를 가 져 와 배경 과 데이터 교 류 를 하고 사용자 정 보 를 초기 화 해 야 합 니 다.우리 가 제3자 서버 를 통 해 위 챗 과 요청 을 할 때 위 챗 은 사용자 가 정보 공개 여 부 를 확인 해 야 합 니 다.그림 1 에서 볼 수 있 듯 이 요청 과 동시에 첫 페이지 index 가 불 러 왔 습 니 다.그림 에서 데 이 터 를 초기 화 하 는 것 이 비어 있 습 니 다.Google 이 요청 정 보 를 app.js 의 onload 나 index.js 에 쓰 더 라 도 확인 을 클릭 한 후에 요청 정 보 는 success 방법 을 실행 하고 제3자 서버 를 되 돌려 주 는 데 이 터 를 처리 합 니 다.이러한 사용자 클릭 이 필요 하기 때문에 발생 하 는 지연 성 은 절차 가 멈 추 기 를 요구 하기 어렵 습 니 다.그러면 우 리 는 다른 경 로 를 통 해 프로그램 을 멈 추 게 하 는 착각 에 도달 할 수 있 습 니 다.다음은 제 해결 방법 을 소개 하 겠 습 니 다.
 
그림 1
2.해결 방법의 가장 기본 적 인 요구
우리 가 원 하 는 해결 방법의 가장 기본 적 인 요 구 는 다음 과 같다.
1)홈 페이지 에 들 어가 면 데이터 가 초기 화 되 고 정상적으로 표 시 됩 니 다. 
2)이용자 가 최초 로 프로그램 에 접속 하면 공개 정 보 를 확인 하기 만 하면 홈 페이지 에 정상적으로 접속 할 수 있다
3.해결 방법
나의 해결 방법 은'임시 로 딩 페이지'를 설계 하여 우리 가 원 하 는 효 과 를 얻 는 것 이다.이 임시 로 딩 페이지 는 안 드 로 이 드 의 환영 인터페이스 와 유사 하지만 데이터 로 딩 이 완료 되 거나 내 가 두 번 째 로 들 어 갈 때 자동 으로 홈 페이지 로 넘 어 갈 것 이다.다음은 디자인 코드 부분 입 니 다.
단계 1:우선 app.json 에서 welcome 이라는 새로운 페이지 를 만 듭 니 다."pages/welcome/welcome"이 페이지 는 첫 페이지,즉 프로그램 이 첫 페이지 로 들 어 오 는 것 을 주의 하 십시오.
단계 2:welcome.js 에서 구체 적 인 요청 작업 을 onload 에 기록 합 니 다.

// pages/welcome/welcome.js
Page({
 data:{},
 onLoad:function(options){
 //       options           
 var that = getApp()
  try {
  //                   ，    ，         ，    
  //          
  that.globalData.userInfo = wx.getStorageSync('userInfo')
  if(wx.getStorageSync('userInfo')!=''){
  //       ，       ，            ，         
  wx.switchTab({
  url: '../index/index',
  })
  }
  if (value) {
  // Do something with return value
  console.log(that.globalData.userInfo)
  }
 } catch(e){
  // Do something when catch error
  // try          ，     ，   ，           ，     
  if(that.globalData.userInfo == ''){
  wx.login({
   success: function(res) {
   //    code，         ，            ，  openid
    var code = res.code
    wx.getUserInfo({
     success: function(userInfo) {
      var encryptedData = userInfo.encryptedData
      var iv = userInfo.iv
      //         
      var url = that.apiHost + 'index/login'
      var userinfo = userInfo.userInfo
      var username = userinfo.nickName
      var useravatar =userinfo.avatarUrl
      var usersex=userinfo.gender
      wx.request({
       url: url,
       method: 'POST',
       data: {
        'code': code,
        'username':username,
        'useravatar':useravatar,
        'usersex':usersex
       },
       header: {
       "Content-Type": "application/x-www-form-urlencoded"
      },
    success:function(response) {
    //       ，                     
    console.log(response.data)
    //      
    that.globalData.userInfo = response.data
    wx.hideToast()
    //    
    wx.setStorage({
    key: 'userInfo',
    data: that.globalData.userInfo,
    success: function(res){
      console.log("insert success")
     },
    fail: function() {
     // fail
     },
    complete: function() {
     // complete
     }
     })
   //   ，        
   wx.switchTab({
    url: '../index/index',
    })
   },
  failure: function(error) {
    console.log(error)
       },
      })
     }
    })
   }
  })}
 } 
 },
 onReady:function(){
 //       
 },
 onShow:function(){
 //     
 },
 onHide:function(){
 //     
 },
 onUnload:function(){
 //     
 },
 redirect:function(){
 wx.switchTab({
  url: '../index/index',
 })
 }
})

이 를 통 해 알 수 있 듯 이 저 희 는 처음으로 로그 인 할 때 저희 의 환영 인터페이스 에 들 어 갈 것 입 니 다.사용자 가 공개 정 보 를 확인 하면 페이지 는 자동 으로 첫 페이지 로 넘 어가 고 첫 페이지 의 데 이 터 는 정상적으로 표 시 됩 니 다.

 
두 번 째 입장 에서 점프 는 onload 에서 진행 되 었 습 니 다.화면 이 과장 되 기도 전에 점프 했 습 니 다.그래서 속도 가 빠 릅 니 다.직접 점프 하 는 것 이 만 족 스 러 운 편 이지 만 결국은 커 브 를 돌아 서 한 가지 일 을 합 니 다.여러분 들 이 더 좋 은 방법 이 있 으 면 공유 하 세 요.감사합니다!
위 에서 말 한 것 은 소 편 이 여러분 에 게 소개 한 위 챗 애플 릿 의 첫 페이지 데이터 초기 화 에 실패 한 해결 방법 입 니 다.여러분 에 게 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 저 에 게 메 시 지 를 남 겨 주세요.소 편 은 제때에 답 해 드 리 겠 습 니 다!