小程序页面要获取app.js中的数据

App({
  onLaunch: function () {
    
    if (!wx.cloud) {
      console.error('请使用 2.2.3 或以上的基础库以使用云能力')
    } else {
      wx.cloud.init({
        env: 'kk-cloud-test',
        traceUser: true,
      })
    }


    this.globalData = {
      openid: "", //用户唯一标识
      avatarUrl: "", //头像
      nickName: "" //昵称
    }
  },


  //获取openid方法，再index中调用过一次
  getOpenId: function () {
    wx.cloud.callFunction({
      name: 'login', 
      data: {},
      success: (res => {
        console.log('[云函数] [login] user openid: ', res.result.openid)
        this.globalData.openid = res.result.openid
        console.log(this.globalData.openid);
      }),
      fail: err => {
        console.error('[云函数] [login] 调用失败', err)
      }
    })
  }

})

需要app.js中的数据的页面代码：

const app = getApp();
Page({
  data: {
    name:"昵称",
    src:"../../images/logo.png"
  },
  onLoad: function (options) {
    this.setData({name:app.nickName});
    this.setData({src:app.avatarUrl});
    
    console.log("方式1-id"+app.openid)
    console.log("方式1-nc"+app.nickName)


    console.log("方式2-id"+app.globalData.openid);
    console.log("方式2-nc"+app.globalData.nickName);
  }，
//收藏列表按钮
  btn_course:function(e){
    wx.navigateTo({
      url: 'collection_course/collection_course',
      success: (result) => {},
      fail: (res) => {},
      complete: (res) => {},
    })
  }
})

为什么获取同一地方的数据，打印结果却不一样？

相关赋值代码：

代码块1
bindGetUserInfo: function(e) {
  var that = this
  wx.getUserProfile({
    desc: '用于完善会员资料', 
    success: (res) => {
      console.log("新登入方法profile");
      console.log(res);
      app.nickName=res.userInfo.nickName;
      app.avatarUrl=res.userInfo.avatarUrl;
      console.log("1"+app.nickName);
      that.setData({
        isHide: false
      });
    },

代码块2
const app = getApp();
onLoad: function (options) {
    app.getOpenId()
}

结果：

所以到底如何获取app.js中的globalData？