AI使用情况调查问卷项目

一个基于轻量级架构的AI使用情况调查问卷系统，采用Cloudflare Pages部署和Supabase数据库后端。

项目概述

本项目是一个现代化的调查问卷系统，专门用于收集和分析AI大模型的使用情况。系统采用轻量级架构，具有高性能、易维护、可扩展的特点。

主要功能

📊 完整的调查问卷 - 10个精心设计的问题，涵盖AI使用的各个方面
💾 双重数据存储 - Supabase云数据库 + 本地存储降级方案
📈 实时统计分析 - 自动生成统计报告和数据可视化
📤 数据导出功能 - 支持CSV格式导出所有调查数据
📱 响应式设计 - 完美适配桌面端和移动端
⚡ 高性能部署 - 基于Cloudflare Pages全球CDN

技术架构

前端技术栈

HTML5 - 语义化标记，支持无障碍访问
CSS3 - 现代样式，响应式布局，动画效果
Vanilla JavaScript - 模块化设计，无需框架依赖
Supabase Client - 实时数据库集成

后端服务

Supabase - PostgreSQL数据库，实时API，身份验证
Cloudflare Pages - 静态站点托管，全球CDN，边缘计算

项目结构

survey/
├── index.html              # 主页面
├── css/
│   └── style.css           # 样式文件
├── js/
│   ├── supabase.js         # Supabase数据库集成
│   ├── survey.js           # 问卷核心功能
│   └── statistics.js       # 统计分析模块
├── assets/                 # 静态资源
├── docs/
│   └── README.md           # 项目文档
└── test_survey.html        # 原始测试文件（已弃用）

快速开始

环境要求

现代浏览器（Chrome 80+, Firefox 75+, Safari 13+）
Git（用于部署）
Cloudflare账户（用于部署）
Supabase账户（用于数据库）

本地开发

克隆项目
```
git clone <repository-url>
cd survey
```
启动本地服务器

使用Python：
```
python -m http.server 8000
```
或使用Node.js：
```
npx serve .
```
访问应用

打开浏览器访问 http://localhost:8000

数据库配置

创建Supabase项目
- 访问 Supabase
- 创建新项目
- 获取项目URL和API密钥

配置数据库表

运行以下SQL创建数据表：

CREATE TABLE ai_usage_surveys (
    id UUID DEFAULT gen_random_uuid() PRIMARY KEY,
    name VARCHAR(100) NOT NULL,
    student_id VARCHAR(50) NOT NULL UNIQUE,
    answers JSONB NOT NULL,
    created_at TIMESTAMPTZ DEFAULT NOW(),
    updated_at TIMESTAMPTZ DEFAULT NOW()
);

CREATE INDEX idx_ai_usage_surveys_answers_gin ON ai_usage_surveys USING GIN (answers);
CREATE INDEX idx_ai_usage_surveys_created_at ON ai_usage_surveys (created_at);

配置安全策略 (RLS)

⚠️ 重要: 数据库表已配置行级安全策略 (RLS)：
- ✅ 启用RLS: 表已启用行级安全
- ✅ 读取权限: 允许所有用户读取数据（用于��计功能）
- ✅ 插入权限: 允许所有用户提交调查问卷
- 🚫 更新保护: 禁止修改已提交的数据
- 🚫 删除保护: 禁止删除调查数据
详细安全配置请参考：安全配置指南
配置环境变量

复制环境变量示例文件：
```
cp .env.example .env
```
编辑 .env 文件，填入你的 Supabase 配置：
```
SUPABASE_URL=https://your-project-id.supabase.co
SUPABASE_ANON_KEY=your-anon-key-here
NODE_ENV=development
```
详细配置说明请参考：环境变量配置指南

部署指南

Cloudflare Pages部署

准备代码仓库

git init
git add .
git commit -m "Initial commit"
git remote add origin <your-repo-url>
git push -u origin main

连接Cloudflare Pages
- 登录 Cloudflare Dashboard
- 进入 Pages 选项卡
- 点击"创建项目"
- 连接Git仓库
配置构建设置
- 框架预设: 无
- 构建命令: 留空
- 构建输出目录: /
- 根目录: /

环境变量（必需）在Cloudflare Pages项目设置中添加：

Variable name: SUPABASE_URL
Value: https://your-project-id.supabase.co
Environment: Production

Variable name: SUPABASE_ANON_KEY
Value: your-anon-key-here
Environment: Production

Variable name: NODE_ENV
Value: production
Environment: Production

详细配置说明请参考：环境变量配置指南

部署
- 点击"保存并部署"
- 等待部署完成
- 获得免费的 *.pages.dev 域名

自定义域名

在Cloudflare中添加域名
配置DNS记录
启用SSL证书

功能详解

问卷系统

问题设计

基础认知 - 是否听说过AI大模型
使用频率 - 使用习惯和频次
工具偏好 - 多选，了解主流工具使用情况
使用场景 - 主要应用领域
使用时长 - 单次使用时间
使用目的 - 使用动机
熟练程度 - 技能水平自评
帮助程度 - 效果评价
提示词类型 - 交互方式
挑战困难 - 开放性问题

表单验证

实时进度条显示
必填字段验证
学生ID唯一性检查
提交状态管理

数据存储

Supabase集成

实时数据同步
自动降级到本地存储
错误处理和重试机制
数据类型转换

本地存储降级

自动备份机制
数据导出功能
离线可用性

统计分析

基础统计

选择题频率分布
多选题选择统计
百分比计算
趋势分析

高级分析

相关性分析
主题提取
模式识别
洞察生成

维护指南

日常维护

数据备份
- 定期导出数据
- 监控存储使用量
- 检查数据完整性
性能监控
- 页面加载时间
- API响应时间
- 错误率监控
安全检查
- API密钥轮换
- 数据访问权限
- 依赖库更新

问题排查

常见问题

Q: 数据无法提交 A: 检查Supabase连接状态，确认API密钥正确

Q: 统计数据不显示 A: 检查网络连接，确认数据表存在

Q: 页面加载缓慢 A: 检查CDN状态，优化图片资源

日志查看

浏览器控制台
Cloudflare Analytics
Supabase Dashboard

版本更新

准备更新

git checkout -b feature/new-feature
# 开发新功能
git commit -m "Add new feature"
git push origin feature/new-feature

测试验证
- 本地功能测试
- 跨浏览器测试
- 移动端测试

部署更新

git checkout main
git merge feature/new-feature
git push origin main

API文档

Supabase表结构

CREATE TABLE ai_usage_surveys (
    id UUID PRIMARY KEY,              -- 唯一标识符
    name VARCHAR(100) NOT NULL,       -- 姓名
    student_id VARCHAR(50) UNIQUE,    -- 学号（唯一）
    answers JSONB NOT NULL,           -- 答案JSON对象
    created_at TIMESTAMPTZ,           -- 创建时间
    updated_at TIMESTAMPTZ            -- 更新时间
);

答案数据格式

{
    "q1": "是",
    "q2": "偶尔使用",
    "q3": "ChatGPT, 文心一言",
    "q4": "学习辅助",
    "q5": "10-30分钟",
    "q6": "提高学习效率",
    "q7": "比较熟练",
    "q8": "较大帮助",
    "q9": "详细指令",
    "q10": "主要挑战是准确性问题"
}

贡献指南

开发规范

代码风格
- 使用ES6+语法
- 模块化设计
- 注释完整

提交规范

git commit -m "feat: 添加新功能"
git commit -m "fix: 修复bug"
git commit -m "docs: 更新文档"

测试要求
- 功能测试
- 兼容性测试
- 性能测试

问题报告

Bug报告
- 详细描述问题
- 提供复现步骤
- 附上错误信息
功能请求
- 描述功能需求
- 说明使用场景
- 提供设计建议

许可证

本项目采用 MIT 许可证 - 查看 LICENSE 文件了解详情。

联系方式

项目维护者：[您的姓名]
邮箱：[您的邮箱]
项目地址：[项目仓库地址]

致谢

感谢所有为这个项目做出贡献的开发者和用户。

最后更新：2024年

Name		Name	Last commit message	Last commit date
Latest commit History 3 Commits
css		css
docs		docs
js		js
.env.example		.env.example
.gitignore		.gitignore
README.md		README.md
_headers		_headers
_redirects		_redirects
index.html		index.html
test.html		test.html
wrangler.toml		wrangler.toml

equithings/survey

Folders and files

Latest commit

History

Repository files navigation