通过后端的json数据渲染首页

api/index/index.js

@@ -8,7 +8,8 @@ import { request } from '@/utils/request'
 export function getHomeConfig() {
   return request({
     url: '/app/homeCfg',
-    method: 'GET'
+    method: 'GET',
+    timeout: 10000 // 10秒超时
   })
 }
 

pages/nearbystores/index.vue

@@ -1,5 +1,12 @@
 <template>
 	<view class="page">
+		<!-- 加载状态指示器 -->
+		<view v-if="loading" class="loading-overlay">
+			<view class="loading-content">
+				<text>正在加载配置...</text>
+			</view>
+		</view>
+		
 		<!-- 背景图 -->
         <image class="bj" :src="pageConfig.background.img" mode="aspectFill"></image>
 		<!-- 公告 -->
@@ -107,49 +114,230 @@ import { getHomeConfig } from "../../api/index/index.js";
 			 * 获取首页配置
 			 */
 			async loadHomeConfig() {
-				this.loading = true;
+				// 添加调试信息
-				try {
+				console.log('=== 开始获取首页配置 ===');
-					const response = await getHomeConfig();
+				console.log('当前时间:', new Date().toISOString());
+				console.log('页面路径:', this.$mp?.page?.route || 'unknown');
+				
+				this.loading = true;
+				console.log('开始获取首页配置...');
+				
+				// 重试机制
+				const maxRetries = 3;
+				let retryCount = 0;
+				
+				while (retryCount < maxRetries) {
+					try {
+						console.log(`第 ${retryCount + 1} 次尝试获取配置...`);
+						
+						// 检查网络状态
+						const isNetworkAvailable = await this.checkNetworkStatus();
+						if (!isNetworkAvailable) {
+							console.error('网络不可用，使用默认配置');
+							this.useDefaultConfig();
+							return;
+						}
+						
+						console.log('网络状态正常，开始请求API...');
+						const response = await getHomeConfig();
+						console.log('API响应:', response);
+					
+					// 检查响应状态
+					if (!response) {
+						console.error('API响应为空');
+						this.useDefaultConfig();
+						return;
+					}
+					
+					// 检查响应码
+					if (response.code !== 200) {
+						console.error('API响应码错误:', response.code, response.msg);
+						this.useDefaultConfig();
+						return;
+					}
+					
+					// 检查数据是否存在
+					if (!response.data) {
+						console.error('API响应数据为空');
+						this.useDefaultConfig();
+						return;
+					}
+					
+					// 检查数据是否为数组且有内容
+					if (!Array.isArray(response.data) || response.data.length === 0) {
+						console.error('API响应数据格式错误或为空数组');
+						this.useDefaultConfig();
+						return;
+					}
 					
-					if (response.code === 200 && response.data && response.data.length > 0) {
 					// 获取第一条配置数据
 					const configData = response.data[0];
+					console.log('配置数据:', configData);
 					
-						// 如果后端返回的数据包含body字段，解析JSON
+					// 检查body字段是否存在
-						if (configData.body) {
+					if (!configData.body) {
+						console.error('配置数据缺少body字段');
+						this.useDefaultConfig();
+						return;
+					}
+					
+					// 解析JSON配置
 					try {
 						const parsedConfig = JSON.parse(configData.body);
 						console.log('解析后的配置数据:', parsedConfig);
 						
+						// 验证配置数据完整性
+						if (!this.validateConfig(parsedConfig)) {
+							console.error('配置数据验证失败');
+							this.useDefaultConfig();
+							return;
+						}
+						
 						// 更新页面配置
-								if (parsedConfig.pageConfig) {
+						this.updatePageConfig(parsedConfig);
-									this.pageConfig = parsedConfig.pageConfig;
-								}
-								if (parsedConfig.navigationItems) {
-									this.navigationItems = parsedConfig.navigationItems;
-								}
-								if (parsedConfig.bottomSection) {
-									this.bottomSection = parsedConfig.bottomSection;
-								}
 						
 						// 重新启动跑马灯
 						this.stopMarquee();
 						this.startMarquee();
 						
+						console.log('配置加载成功');
+						
 					} catch (parseError) {
 						console.error('解析配置JSON失败:', parseError);
 						console.log('原始body数据:', configData.body);
+						this.useDefaultConfig();
 					}
-						}
+					
-					} else {
+						// 如果成功获取到数据，跳出重试循环
-						console.log('使用默认配置数据');
+						break;
-					}
+						
 					} catch (error) {
-					console.error('获取首页配置失败:', error);
+						retryCount++;
-					console.log('使用默认配置数据');
+						console.error(`第 ${retryCount} 次尝试失败:`, error);
-				} finally {
+						console.error('错误详情:', {
-					this.loading = false;
+							message: error.message,
+							stack: error.stack,
+							name: error.name
+						});
+						
+						if (retryCount >= maxRetries) {
+							console.error('所有重试都失败了，使用默认配置');
+							this.useDefaultConfig();
+							break;
+						} else {
+							console.log(`等待 ${retryCount * 1000}ms 后重试...`);
+							await new Promise(resolve => setTimeout(resolve, retryCount * 1000));
 						}
+					}
+				}
+				
+				this.loading = false;
+				console.log('配置加载完成，loading状态:', this.loading);
+			},
+			
+			/**
+			 * 使用默认配置
+			 */
+			useDefaultConfig() {
+				console.log('使用默认配置数据');
+				// 确保默认配置可用
+				if (!this.pageConfig || !this.pageConfig.announcement) {
+					console.error('默认配置数据不完整');
+					uni.showToast({
+						title: '配置数据异常',
+						icon: 'none',
+						duration: 2000
+					});
+					return;
+				}
+				// 启动跑马灯
+				this.stopMarquee();
+				this.startMarquee();
+				
+				// 显示提示信息
+				uni.showToast({
+					title: '使用本地配置',
+					icon: 'none',
+					duration: 1500
+				});
+			},
+			
+			/**
+			 * 验证配置数据完整性
+			 */
+			validateConfig(config) {
+				if (!config) {
+					console.error('配置对象为空');
+					return false;
+				}
+				
+				// 检查必需的配置项
+				const requiredFields = ['pageConfig', 'navigationItems', 'bottomSection'];
+				for (const field of requiredFields) {
+					if (!config[field]) {
+						console.error(`配置缺少必需字段: ${field}`);
+						return false;
+					}
+				}
+				
+				// 检查pageConfig的必需子字段
+				const requiredPageConfigFields = ['background', 'announcement', 'topIcons'];
+				for (const field of requiredPageConfigFields) {
+					if (!config.pageConfig[field]) {
+						console.error(`pageConfig缺少必需字段: ${field}`);
+						return false;
+					}
+				}
+				
+				// 检查announcement的必需子字段
+				if (!config.pageConfig.announcement.text) {
+					console.error('announcement缺少text字段');
+					return false;
+				}
+				
+				console.log('配置数据验证通过');
+				return true;
+			},
+			
+			/**
+			 * 更新页面配置
+			 */
+			updatePageConfig(parsedConfig) {
+				if (parsedConfig.pageConfig) {
+					this.pageConfig = parsedConfig.pageConfig;
+					console.log('更新pageConfig成功');
+				}
+				if (parsedConfig.navigationItems) {
+					this.navigationItems = parsedConfig.navigationItems;
+					console.log('更新navigationItems成功');
+				}
+				if (parsedConfig.bottomSection) {
+					this.bottomSection = parsedConfig.bottomSection;
+					console.log('更新bottomSection成功');
+				}
+			},
+			
+			/**
+			 * 检查网络状态
+			 */
+			checkNetworkStatus() {
+				return new Promise((resolve) => {
+					uni.getNetworkType({
+						success: (res) => {
+							console.log('网络类型:', res.networkType);
+							if (res.networkType === 'none') {
+								console.error('网络连接不可用');
+								resolve(false);
+							} else {
+								resolve(true);
+							}
+						},
+						fail: () => {
+							console.error('获取网络状态失败');
+							resolve(false);
+						}
+					});
+				});
 			},
 			
 			startMarquee() {
@@ -380,4 +568,30 @@ import { getHomeConfig } from "../../api/index/index.js";
 		z-index: -1;
 	}
 	
+	/* 加载状态指示器样式 */
+	.loading-overlay {
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+		background-color: rgba(0, 0, 0, 0.5);
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		z-index: 9999;
+	}
+	
+	.loading-content {
+		background-color: rgba(255, 255, 255, 0.9);
+		padding: 40rpx 60rpx;
+		border-radius: 20rpx;
+		text-align: center;
+	}
+	
+	.loading-content text {
+		font-size: 28rpx;
+		color: #333;
+	}
+	
 </style>

utils/request.js

@@ -33,6 +33,7 @@ export function request(options = {}) {
         'Content-Type': 'application/json',
         ...options.header
       },
+      timeout: options.timeout || 60000, // 默认60秒超时
       success: (res) => {
         // 请求成功处理
         if (res.statusCode === 200) {