前端特效节点改为在节点容器内展示,不再全屏铺底
This commit is contained in:
1 parent
c059589e94
commit
08aff2656d
1 file changed
+6
-5
@@ -496,7 +496,7 @@ function renderSpLink(container, sp, appendNote) {
|
|||||||
* 采用 iframe 沙箱而非注入父页面全局作用域,原因:
|
* 采用 iframe 沙箱而非注入父页面全局作用域,原因:
|
||||||
* - 特效脚本运行在独立 iframe 内,无法访问父页面 DOM/JS,任何报错、死循环、变量覆盖
|
* - 特效脚本运行在独立 iframe 内,无法访问父页面 DOM/JS,任何报错、死循环、变量覆盖
|
||||||
* 都不会污染父页面,从而保证"运行特效后卡片点击/节点导航依然正常";
|
* 都不会污染父页面,从而保证"运行特效后卡片点击/节点导航依然正常";
|
||||||
* - iframe 全屏铺底且 pointer-events:none,不拦截父页面点击,视觉特效悬浮展示在页面上方;
|
* - iframe 挂载在节点容器内部且 pointer-events:none,不拦截父页面点击,视觉特效局限在卡片内展示;
|
||||||
* - 不使用 new Function/eval(CSP 未开 unsafe-eval),srcdoc 内联脚本由 CSP 'unsafe-inline' 放行。
|
* - 不使用 new Function/eval(CSP 未开 unsafe-eval),srcdoc 内联脚本由 CSP 'unsafe-inline' 放行。
|
||||||
* 仅管理员可发布(后端强制)。 */
|
* 仅管理员可发布(后端强制)。 */
|
||||||
/* 无特效模式:true 为关闭自动执行(用户面板开关控制,localStorage 持久化) */
|
/* 无特效模式:true 为关闭自动执行(用户面板开关控制,localStorage 持久化) */
|
||||||
@@ -531,18 +531,19 @@ function renderSpJs(container, sp, appendNote) {
|
|||||||
audit_btn.textContent = hidden ? '收起源码' : '审计源码';
|
audit_btn.textContent = hidden ? '收起源码' : '审计源码';
|
||||||
});
|
});
|
||||||
/* 启动特效:创建隔离 iframe 沙箱,完整前端代码(含 <style>/<script>/<body>)由 srcdoc 承载,
|
/* 启动特效:创建隔离 iframe 沙箱,完整前端代码(含 <style>/<script>/<body>)由 srcdoc 承载,
|
||||||
* 脚本在独立上下文执行,无法影响父页面导航;pointer-events:none 保证不拦截父页面点击。 */
|
* 脚本在独立上下文执行,无法影响父页面导航;pointer-events:none 保证不拦截父页面点击。
|
||||||
|
* iframe 挂载在节点容器内部(而非全屏铺底),特效局限于该节点卡片内展示。 */
|
||||||
function startEffect() {
|
function startEffect() {
|
||||||
if (frame) return;
|
if (frame) return;
|
||||||
frame = document.createElement('iframe');
|
frame = document.createElement('iframe');
|
||||||
frame.className = 'sp-effect-frame';
|
frame.className = 'sp-effect-frame';
|
||||||
frame.setAttribute('sandbox', 'allow-scripts');
|
frame.setAttribute('sandbox', 'allow-scripts');
|
||||||
frame.srcdoc = sp.code;
|
frame.srcdoc = sp.code;
|
||||||
frame.style.cssText = 'position:fixed;top:0;left:0;width:100%;height:100%;border:0;pointer-events:none;z-index:9999;';
|
frame.style.cssText = 'position:relative;display:block;width:100%;height:360px;border:0;pointer-events:none;margin-top:0.6rem;';
|
||||||
document.body.appendChild(frame);
|
container.appendChild(frame);
|
||||||
toggle_btn.textContent = '停止特效';
|
toggle_btn.textContent = '停止特效';
|
||||||
out.style.display = 'block';
|
out.style.display = 'block';
|
||||||
out.textContent = '特效已启动(运行于隔离沙箱,不影响页面导航)';
|
out.textContent = '特效已启动(运行于节点内隔离沙箱,不影响页面导航)';
|
||||||
}
|
}
|
||||||
function stopEffect() {
|
function stopEffect() {
|
||||||
if (frame) { frame.remove(); frame = null; }
|
if (frame) { frame.remove(); frame = null; }
|
||||||
|
|||||||
Reference in new issue
Block a user