EpicSoul/App.vue

<script>
import store from "./store";
export default {
  globalData: {
    mainSliderIndex: 0,
    randomImages: [],
    bgMusic: null,
    isMusicPlaying: false,
    musicSrc: "https://static.ticket.sz-trip.com/epicSoul/EpicSouls.mp3",
    // 用户使用统计相关
    userSessionId: null,
    networkStartTime: null, // 网络时间开始时间
    networkEndTime: null, // 网络时间结束时间
  },
  onLaunch: function () {
    // 初始化用户使用统计
    this.initUserUsageStats();

    // 重试上报本地存储的使用统计数据
    this.retryReportLocalStats();

    // 移除初始化背景音乐的调用
    // this.initBackgroundMusic();
    // 审核
    this.Post({ id: 10217 }, "/api/article/getArticleById").then((res) => {
      try {
        let SHFlag = res.data.title;
        // let SHFlag = res.data.subtitle
        uni.setStorageSync("SHFlag", SHFlag);
      } catch (e) {}
    });
  },
  onShow: function () {
    // 记录应用显示时间（重新进入小程序）
    this.recordAppShow();
    this.getUserInfo();
  },
  onHide: function () {
    // 记录应用隐藏时间（退出小程序）
    this.recordAppHide();
  },
  methods: {
    getUserInfo() {
      if (!this.getUserId()) return;
      this.Post({}, "/framework/user/getInfo", "DES").then((res) => {
		  let token = JSON.parse(uni.getStorageSync("userInfo")).token
		  res.data.token = token
        uni.setStorageSync("userInfo", JSON.stringify(res.data));
      });
    },
    // 初始化用户使用统计
    initUserUsageStats() {
      // 生成会话ID
      this.globalData.userSessionId = this.generateSessionId();
    },

    // 生成会话ID
    generateSessionId() {
      const timestamp = Date.now();
      const random = Math.random().toString(36).substring(2, 15);
      return `session_${timestamp}_${random}`;
    },

    // 记录应用显示时间 - 获取网络时间作为开始时间
    recordAppShow() {
      // 获取网络时间作为开始时间
      this.getNetworkTime()
        .then((networkTime) => {
          this.globalData.networkStartTime = networkTime;
        })
        .catch((err) => {
          // 获取网络时间失败，静默处理
        });
    },

    // 记录应用隐藏时间 - 获取网络时间作为结束时间
    recordAppHide() {
      // 获取网络时间作为结束时间
      this.getNetworkTime()
        .then((networkTime) => {
          this.globalData.networkEndTime = networkTime;
          // 如果使用时长超过1秒，则上报统计数据
          this.reportUserUsageStats();
        })
        .catch((err) => {
          // 获取网络时间失败，静默处理
        });
    },
    getUserId() {
      const userInfoFromStorage = uni.getStorageSync("userInfo");
      if (userInfoFromStorage) {
        const userInfo = JSON.parse(userInfoFromStorage);
        if (userInfo.id) {
          return userInfo.id;
        }
      }
      return store.state.user.userInfo.id;
    },

    // 上报用户使用统计数据
    reportUserUsageStats() {
      if (
        !this.globalData.networkStartTime ||
        !this.globalData.networkEndTime
      ) {
        return;
      }
      let userId = this.getUserId();
      const usageData = {
        sessionId: this.globalData.userSessionId,
        startTime: this.globalData.networkStartTime.toString(),
        endTime: this.globalData.networkEndTime.toString(),
        userId: userId,
        method: "POST",
      };
      if (!userId) {
        this.saveUsageStatsToLocal(usageData);
        return;
      }

      // 调用接口上报数据
      this.Post(usageData, "/api/visit/end", "DES")
        .then((res) => {
          // 上报成功后清理数据
          this.clearUsageStats();
        })
        .catch((err) => {
          // 上报失败时，将数据存储到本地，下次启动时重试
          this.saveUsageStatsToLocal(usageData);
        });
    },

    // 获取平台信息
    getPlatform() {
      // #ifdef MP-WEIXIN
      return "weixin";
      // #endif

      // #ifdef H5
      return "h5";
      // #endif

      // #ifdef APP-PLUS
      return "app";
      // #endif

      return "unknown";
    },

    // 获取网络时间
    getNetworkTime() {
      return new Promise((resolve, reject) => {
        // 调用服务器接口获取网络时间
        this.Post({}, "/api/visit/currentTime", "DES")
          .then((res) => {
            if (res.code == 1 || res.code == 200) {
              // 假设接口返回的时间戳字段为 serverTime
              const networkTime = res.data;
              resolve(networkTime);
            } else {
              reject(new Error(res.msg || "获取网络时间失败"));
            }
          })
          .catch((err) => {
            reject(err);
          });
      });
    },

    // 获取设备信息
    getDeviceInfo() {
      try {
        const systemInfo = uni.getSystemInfoSync();
        return {
          model: systemInfo.model || "",
          system: systemInfo.system || "",
          platform: systemInfo.platform || "",
          version: systemInfo.version || "",
        };
      } catch (e) {
        return {};
      }
    },

    // 清理使用统计数据
    clearUsageStats() {
      this.globalData.networkStartTime = null;
      this.globalData.networkEndTime = null;
      this.globalData.userSessionId = null;
    },

    // 保存使用统计数据到本地
    saveUsageStatsToLocal(usageData) {
      try {
        const localStats = uni.getStorageSync("pendingUsageStats") || [];
        localStats.push(usageData);
        uni.setStorageSync("pendingUsageStats", localStats);
      } catch (e) {
        // 保存失败，静默处理
      }
    },

    // 重试上报本地存储的使用统计数据
    retryReportLocalStats() {
      try {
        const localStats = uni.getStorageSync("pendingUsageStats") || [];
        if (localStats.length === 0) {
          return;
        }
        let userId = this.getUserId();
        if (!userId) {
          return;
        }

        // 逐个上报
        localStats.forEach((stats, index) => {
          stats.userId = userId;
          this.Post(stats, "/api/visit/end", "DES")
            .then((res) => {
              // 上报成功后从本地移除
              localStats.splice(index, 1);
              uni.setStorageSync("pendingUsageStats", localStats);
            })
            .catch((err) => {
              // 上报失败，静默处理
            });
        });
      } catch (e) {
        // 重试失败，静默处理
      }
    },

    initBackgroundMusic() {
      try {
        console.log("bgMusic", this.globalData.bgMusic);
        // 销毁旧的音频实例（关键！）
        if (this.globalData.bgMusic) {
          this.globalData.bgMusic.stop();
          this.globalData.bgMusic.destroy();
          this.globalData.bgMusic = null;
        }

        let bgMusic;

        // 区分平台 - 小程序环境使用背景音频，H5等环境使用内部音频
        // #ifdef MP-WEIXIN
        //            try {
        //                bgMusic = uni.getBackgroundAudioManager();
        //                // 小程序环境需要设置title
        //                bgMusic.title = '背景音乐';
        // // 设置音频组件的 ID
        // bgMusic.id = 'mp-audio';
        //            } catch (e) {
        //                console.error('获取背景音频管理器失败，改用内部音频上下文', e);
        //                bgMusic = uni.createInnerAudioContext();
        //            }
        bgMusic = uni.createInnerAudioContext();
        // #endif

        // #ifndef MP-WEIXIN
        bgMusic = uni.createInnerAudioContext();
        // #endif

        // 配置音频
        bgMusic.src = this.globalData.musicSrc;
        console.log(bgMusic.src);
        bgMusic.loop = true; // 循环播放

        // 使用不同的事件监听方式，兼容两种音频上下文
        if (bgMusic.onPlay) {
          // BackgroundAudioManager 方式
          bgMusic.onPlay(() => {
            this.globalData.isMusicPlaying = true;
          });

          bgMusic.onPause(() => {
            this.globalData.isMusicPlaying = false;
          });

          bgMusic.onStop(() => {
            this.globalData.isMusicPlaying = false;
          });

          bgMusic.onEnded(() => {
            // 循环播放 (BackgroundAudioManager需要重新设置src)
            bgMusic.src = this.globalData.musicSrc;
            bgMusic.play();
          });
        } else {
          // InnerAudioContext 方式
          bgMusic.onPlay(() => {
            this.globalData.isMusicPlaying = true;
          });

          bgMusic.onPause(() => {
            this.globalData.isMusicPlaying = false;
          });

          bgMusic.onStop(() => {
            this.globalData.isMusicPlaying = false;
          });

          bgMusic.onEnded(() => {
            // InnerAudioContext设置了loop不需要手动重新播放
            this.globalData.isMusicPlaying = false;
          });
        }

        // 保存到全局
        this.globalData.bgMusic = bgMusic;

        // 创建全局方法供其他页面调用
        uni.$bgMusic = {
          play: () => {
            if (bgMusic && bgMusic.play) {
              bgMusic.play();
            }
            return this.globalData.isMusicPlaying;
          },
          pause: () => {
            if (bgMusic && bgMusic.pause) {
              bgMusic.pause();
            }
            return this.globalData.isMusicPlaying;
          },
          toggle: () => {
            if (!bgMusic) return false;

            if (this.globalData.isMusicPlaying) {
              if (bgMusic.pause) bgMusic.pause();
            } else {
              if (bgMusic.play) bgMusic.play();
            }
            return this.globalData.isMusicPlaying;
          },
          isPlaying: () => this.globalData.isMusicPlaying,
        };
      } catch (err) {
        console.error("初始化背景音乐失败:", err);
      }
    },
    updateMusicSrc(newSrc) {
      this.globalData.musicSrc = newSrc;
      if (this.globalData.bgMusic) {
        this.globalData.bgMusic.src = newSrc;
      }
    },
  },
};
</script>

<style lang="scss">
@font-face {
  font-family: "Futura";
  src: url(https://static.ticket.sz-trip.com/epicSoul/taozi/fonts/Futura.ttc);
}
/*每个页面公共css */
@import "@/uni_modules/uni-scss/index.scss";
@import "@/static/css/base.css";

/* #ifndef APP-NVUE */
// 设置整个项目的背景色
page {
  background-color: #f5f5f5;
}

/* #endif */
.example-info {
  font-size: 14px;
  color: #333;
  padding: 10px;
}

/* 清除按钮默认样式 */
button::after {
  border: none;
}

@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateY(0);
  }

  40% {
    transform: translateY(-20rpx);
  }

  60% {
    transform: translateY(-10rpx);
  }
}

/* 音乐控制按钮动画 */
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

/* 隐藏微信小程序默认音频组件 */
#mp-audio {
  display: none;
}
</style>