JR杰瑞 · 子产品嵌入指南

短剧工坊与橱窗衣橱均已支持 iframe 嵌入，可直接集成到你自己的页面中。

一、可嵌入地址

产品	嵌入地址	说明
短剧工坊	`/drama.html?embed=1`	AI 短剧工作台需登录
音乐工坊	`/music.html?embed=1`	AI 试衣 / 穿搭发现需登录
绘图工坊	`/index.html`	主应用，建议整站跳转而非嵌入

二、嵌入代码

1. 最简嵌入

把下面代码粘到你的页面里即可，高度会自动同步。

<iframe
  src="https://jierui.cloud/drama.html?embed=1"
  style="width:100%;min-height:860px;border:0;border-radius:12px"
  allow="clipboard-write"
  loading="lazy">
</iframe>

2. 带高度自适应（推荐）

子页面会通过 postMessage 上报高度，父页面监听后自动调整，避免出现双重滚动条。

<iframe id="jrDrama"
  src="https://jierui.cloud/drama.html?embed=1"
  style="width:100%;height:860px;border:0;border-radius:12px"
  allow="clipboard-write">
</iframe>
<script>
window.addEventListener('message', function (e) {
  var d = e.data;
  if (d && d.type === 'jr-embed-height' && d.height) {
    var f = document.getElementById('jrDrama');
    if (f) f.style.height = Math.max(720, d.height) + 'px';
  }
});
</script>

3. 橱窗衣橱嵌入

<iframe
  src="https://jierui.cloud/music.html?embed=1"
  style="width:100%;min-height:820px;border:0;border-radius:12px"
  allow="clipboard-write"
  loading="lazy">
</iframe>

三、实时预览

短剧工坊（嵌入态）

新窗口打开

橱窗衣橱（嵌入态）

新窗口打开

说明：两个页面在嵌入模式下会自动隐藏「返回主站」链接并压缩头部；检测到处于 iframe 中时无需加 ?embed=1 也会自动生效。跨域嵌入时登录态依赖浏览器第三方 Cookie 策略，若被拦截，让用户先在新窗口登录一次即可。