在商品详情页嵌入问卷首选iframe方式，需配置无头嵌入、跨域支持及固定高度；轻量反馈可用fetch提交；弹层须按用户行为触发并设冷却期；后端必须校验字段类型、长度及XSS防护。
在商品详情页嵌入问卷，用 iframe 最稳
直接往 HTML 商品页里手写表单容易和现有样式冲突、提交逻辑难维护，还可能被 CSP 策略拦截。用 iframe 嵌第三方问卷（如腾讯问卷、问卷星、Typeform）是最快落地且兼容性最好的方式。
关键点：确保问卷平台支持「无头嵌入」（即隐藏顶部导航栏），并开启「允许跨域加载」；商品页的容器 <div> 需设固定高度或使用 <code>min-height 防止布局塌陷。
- 问卷链接后加
?embedded=1或&hide_title=1（依平台文档而定）可隐藏非必要 UI - 不要用
width: 100%+height: 100%给iframe，移动端易出现横向滚动条；推荐width: 100%+height: 600px（或 JS 动态适配） - 若问卷需带商品 ID 作埋点，把
itemId=123456拼进 iframe 的src查询参数里，后端或问卷平台能自动捕获
fetch 提交轻量级满意度评分，避免跳转
如果只要一个 1–5 星评分 + 一句话反馈，没必要上完整问卷。用原生 fetch 调后端 API 更轻、更快、更可控。
注意：必须在用户点击「提交」后禁用按钮，防止重复提交；服务端要校验 Referer 或加简单 token 防刷；前端别存敏感字段（如用户手机号）在 localStorage 里等提交。
立即学习“前端免费学习笔记（深入）”；
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 评分组件建议用
<input type="radio">+ CSS 自定义，比 canvas 或 SVG 更语义化、无障碍友好 - 接口地址建议走同域，如
/api/v1/item/123456/survey，避免跨域预检失败 - 响应成功后清空输入框、恢复按钮状态，并用
alert()或 toast 提示「已收到，感谢反馈」——别静默提交
问卷弹层触发时机别乱设，否则影响转化率
用户刚进商品页就弹问卷，90% 会直接关掉，还可能误点「不感兴趣」反向污染数据。必须结合行为信号判断是否弹出。
- 推荐条件组合：
页面停留 ≥ 60s+滚动深度 ≥ 70%+未触发加购/下单（用performance.now()和IntersectionObserver可较准判断） - 同一用户 24 小时内只弹 1 次，用
localStorage存时间戳，别依赖 cookie（iOS ITP 限制多） - 关闭按钮必须显眼（右上角 ×），且点击后 30 天内不再触发——这是 GDPR 和国内《个人信息保护法》隐含要求
后端接收问卷数据时，Content-Type 和字段校验不能省
前端发过来的数据，后端不校验类型和长度，很快就会收一堆 null、空字符串、超长文本甚至 XSS 片段。
比如用户填「非常满意！！！！！???」，后端字段没设 max_length=200，数据库可能报错；又比如传了 score: "five"，但后端只接受整数，就会存成 NULL。
- 必须检查
Content-Type: application/json，拒绝text/plain或未设置类型的请求 -
score字段强制转为int并限定范围1–5；feedback做 XSS 过滤（至少strip_tags()+htmlspecialchars()） - 记录
user_agent和referrer，方便后续分析是 App 内嵌 WebView 还是 PC 浏览器提交，不同渠道的满意度分布常差很大
