@ptengine/inline-editor 0.1.3 → 0.1.4

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # Changelog
 
+## 0.1.4
+
+**变更**
+- AI 改动里的图片地址（`CHANGE_IMAGE`、`EDIT_HTML` 与 `INSERT_ELEMENT` 里的 `img[src]`）**不再按域名放行**，只要求 http(s) 绝对地址。
+  此前只认宿主注入的 origin 表 + 本会话读到过的地址，生图域名随部署环境变（测试区产图在 npstaticprod），漏配一个就整处改动被拒。
+  `javascript:` / `data:` / 相对地址 / 没有 `src` 仍以 `UNSAFE_IMAGE_SRC` 拒；`srcset` 照旧剥掉，`style` 里的 `url()` 照旧禁止。
+- `InlineEditor` 的 `allowedImageOrigins` / `allowedImageUrls` 标为 `@deprecated`、不再读取；保留是为了宿主不用跟着改，传了也会被忽略。
+
 ## 0.1.3
 
 **变更**

package/README.md

@@ -231,18 +231,18 @@ configureInlineEditor({
 ## AI 改动的八个 op
 
 `AI_SAFE_OPS` 与 mastra 的 `EDITOR_INLINE_OPS` **逐字一致**（顺序也一样）。
-其中换图、改跳转与整块重写多一道**来源闸**，依据由宿主注入：
+其中改跳转多一道**来源闸**，依据由宿主注入：
 
-- `allowedImageOrigins` —— `CHANGE_IMAGE` 的 `src` 允许的 origin（图片上传域等；
-  客户页自己的 origin 由包自动加上）。不传 = 只允许同源的图，**这是有意的 fail closed**：
-  模型凭记忆敲出来的域名会被每一个真实访客加载。
 - `allowedLinkUrls` —— `SET_LINK` 允许的**站外**地址，用户在对话里逐字给过的那些
   （**整串**相等，不是 origin 相等）。同源地址不用进这张表。
 
+图片地址（换图、整块重写与插入里的 `img[src]`）只查协议，必须是 http(s) 绝对地址。
+域名白名单 2026-10-20 去掉了，`allowedImageOrigins` / `allowedImageUrls` 两个 props 保留但不再生效。
+
 `EDIT_HTML`（整块重写）与 `INSERT_ELEMENT` 是**两道不同的闸**，别复用：
 `insertHtmlGate` 审的是「加一个小元素」，`replaceHtmlGate` 审的是「顶替一个既有元素」——
 后者强制**单根**（多根会让其后所有 `:nth-of-type` selector 错位，且上线才暴露）、
-放行 `img`（含图的区块否则永远重写不了，`src` 走 `allowedImageOrigins`，`srcset` 剥掉）、
+放行 `img`（含图的区块否则永远重写不了，`src` 只认 http(s)，`srcset` 剥掉）、
 预算 8KB。
 
 ## 几条容易踩的约束

package/dist/InlineEditor.d.ts

@@ -70,17 +70,11 @@ export interface InlineEditorProps {
      */
     resolveChangeId?: (id: string) => string;
     /**
-     * `CHANGE_IMAGE` 的 origin 白名单（图片上传域等）。客户页自身的 origin 由包自动加上。
-     *
-     * 不传 = 只允许换成与客户页同源的图。**这是有意的 fail closed**：模型凭记忆敲出来的
-     * 域名会被每一个真实访客加载，等于我们替客户往他页面上挂了个第三方请求。
+     * @deprecated 2026-10-20 起不再生效：AI 改动里的图片地址只查协议（http(s)），不再按域名放行
+     * （见 `kernel/ai/imageSource.ts`）。保留只是为了宿主不用跟着改，传了也会被忽略。
      */
     allowedImageOrigins?: string[];
-    /**
-     * 本会话在这个页面上读到过的图片地址（宿主从发给 agent 的 `anchor-image:` / `element-image:`
-     * 行与 html 里的 `<img src>` 攒）。origin 白名单之外的第二条放行路，整串相等才算 ——
-     * 换图、整块重写、插入模块三处共用（见 `kernel/ai/imageSource.ts`）。不传 = 这一路不放行。
-     */
+    /** @deprecated 同 `allowedImageOrigins`，传了也会被忽略。 */
     allowedImageUrls?: string[];
     /**
      * `SET_LINK` 允许的**站外**地址 —— 用户在对话里逐字给过的那些（宿主从会话里攒）。
@@ -346,4 +340,4 @@ export interface AiApplyApi {
     /** 当前版本 —— 宿主把 agent 给的版本**名**映射成 id 时要知道现在在哪一版。 */
     readonly activeVersionId?: string;
 }
-export declare function InlineEditor({ url, device, onDeviceChange, title, versionLabel, chrome, onExit, onSave, libraryComponents, libraryLoading, onAddVersion, onRenameVersion, onPreview, onToggleAi, aiOpen, uploadImage, initialChanges, onHydrated, onAskAi, onPageContextReady, anchors, onEditorReady, onSessionReady, onAiContextChange, onAiApplyReady, onAiInsertedRemoved, onAiInsertedRestored, trackAiSelection, renderNodeIcon, versions, activeVersionId, versionChanges, onVersionChange, onVersionLeave, onVersionEnter, resolveChangeId, allowedImageOrigins, allowedImageUrls, allowedLinkUrls, viewportWidthOverride, blockOverlay }: InlineEditorProps): import("react").JSX.Element;
+export declare function InlineEditor({ url, device, onDeviceChange, title, versionLabel, chrome, onExit, onSave, libraryComponents, libraryLoading, onAddVersion, onRenameVersion, onPreview, onToggleAi, aiOpen, uploadImage, initialChanges, onHydrated, onAskAi, onPageContextReady, anchors, onEditorReady, onSessionReady, onAiContextChange, onAiApplyReady, onAiInsertedRemoved, onAiInsertedRestored, trackAiSelection, renderNodeIcon, versions, activeVersionId, versionChanges, onVersionChange, onVersionLeave, onVersionEnter, resolveChangeId, allowedLinkUrls, viewportWidthOverride, blockOverlay }: InlineEditorProps): import("react").JSX.Element;

package/dist/InlineEditor.js

@@ -51,7 +51,7 @@ function imageTargetOf(caps) {
     return branch === 'background' ? 'background' : undefined;
 }
 const AI_ELEMENT_IMAGE_LIMIT = 4;
-export function InlineEditor({ url, device, onDeviceChange, title, versionLabel = 'V1', chrome = 'full', onExit, onSave, libraryComponents, libraryLoading, onAddVersion, onRenameVersion, onPreview, onToggleAi, aiOpen, uploadImage, initialChanges, onHydrated, onAskAi, onPageContextReady, anchors, onEditorReady, onSessionReady, onAiContextChange, onAiApplyReady, onAiInsertedRemoved, onAiInsertedRestored, trackAiSelection, renderNodeIcon, versions, activeVersionId, versionChanges, onVersionChange, onVersionLeave, onVersionEnter, resolveChangeId, allowedImageOrigins, allowedImageUrls, allowedLinkUrls, viewportWidthOverride, blockOverlay }) {
+export function InlineEditor({ url, device, onDeviceChange, title, versionLabel = 'V1', chrome = 'full', onExit, onSave, libraryComponents, libraryLoading, onAddVersion, onRenameVersion, onPreview, onToggleAi, aiOpen, uploadImage, initialChanges, onHydrated, onAskAi, onPageContextReady, anchors, onEditorReady, onSessionReady, onAiContextChange, onAiApplyReady, onAiInsertedRemoved, onAiInsertedRestored, trackAiSelection, renderNodeIcon, versions, activeVersionId, versionChanges, onVersionChange, onVersionLeave, onVersionEnter, resolveChangeId, allowedLinkUrls, viewportWidthOverride, blockOverlay }) {
     const { t } = useTranslation();
     const canvasAreaRef = useRef(null);
     const canvasIframeRef = useRef(null);
@@ -94,7 +94,6 @@ export function InlineEditor({ url, device, onDeviceChange, title, versionLabel
             return '';
         }
     }, [url]);
-    const imageOrigins = useMemo(() => Array.from(new Set([pageOrigin, ...(allowedImageOrigins ?? [])].filter(Boolean))), [pageOrigin, allowedImageOrigins]);
     const changeListRef = useRef(changeList);
     changeListRef.current = changeList;
     const versionChangesRef = useRef(versionChanges);
@@ -695,8 +694,6 @@ export function InlineEditor({ url, device, onDeviceChange, title, versionLabel
                     addMove: changeList.addMove,
                     addAttribute: changeList.addAttribute,
                     addAction: changeList.addAction,
-                    allowedImageOrigins: imageOrigins,
-                    allowedImageUrls: allowedImageUrls ?? [],
                     allowedLinkUrls: allowedLinkUrls ?? [],
                     pageOrigin
                 });
@@ -744,8 +741,6 @@ export function InlineEditor({ url, device, onDeviceChange, title, versionLabel
         changeList.addMove,
         changeList.addAttribute,
         changeList.addAction,
-        imageOrigins,
-        allowedImageUrls,
         allowedLinkUrls,
         pageOrigin,
         enqueue,

package/dist/kernel/ai/aiInlineApply.d.ts

@@ -41,8 +41,8 @@
  * 前五个 op 的内容是模型自己写的文字与样式，落点全在客户页内部；这两个不一样 ——
  * 一个 `src` / `url` 就是一条**对外请求面**，写进去等于让客户页去拉一个第三方地址
  * （换图还会被真实用户加载，改跳转会把流量送走）。所以它们的地址必须**来源可指认**：
- * 图片 origin 在宿主给的白名单里（上传域 / 页面自身），链接与页面同源或用户逐字给过。
- * 模型凭记忆敲一个域名出来，这里必须拦下。
+ * 链接与页面同源或用户逐字给过，模型凭记忆敲一个外站地址出来，这里必须拦下。图片只查协议
+ * （http(s)，见 `imageSource.ts`）—— 域名白名单 2026-10-20 去掉了。
  *
  * ⚠️ 两个编辑器必须产出同样的 change，否则同一个 AI 建议在两边存出来的数据不一样，
  * 而这种偏差要到发布后看线上效果才会发现。错误码也照抄（`INVALID_TEXT_CONTENT` 等），
@@ -85,7 +85,7 @@ export interface AiWireChange {
     mode?: string;
     /** MOVE_ELEMENT 的目标 —— 只允许选中元素的祖先之一。 */
     targetSelector?: string;
-    /** CHANGE_IMAGE 的新图地址。必须过 host 白名单闸（见 `allowedImageOrigins`）。 */
+    /** CHANGE_IMAGE 的新图地址。必须是 http(s) 绝对地址（见 `imageSource.ts`）。 */
     src?: string;
     /** CHANGE_IMAGE 的新 alt。有值时**额外**落一条 `changeElementAttribute alt`。 */
     alt?: string;
@@ -110,7 +110,7 @@ export type AiRejectReason = 'NOT_IN_WHITELIST' | 'INVALID_SHAPE' | 'OUT_OF_SCOP
  | 'INVALID_MODE'
 /** 移动的目标不是选中元素的祖先，或它在页面上不唯一。 */
  | 'INVALID_MOVE_TARGET' | 'APPLY_FAILED'
-/** 换图的 `src` 不是 http(s)，或它的 origin 不在宿主给的白名单里（模型凭记忆编的域名）。 */
+/** 图片地址不是 http(s) 绝对地址（`javascript:` / `data:` / 相对地址 / 空）。 */
  | 'UNSAFE_IMAGE_SRC'
 /**
  * `EDIT_TEXT` 的目标是个容器（自己没有直接文本、却有子元素）：换 innerHTML 会把里面的图片、按钮
@@ -305,20 +305,6 @@ export interface AiApplyDeps {
      * 省略 / 抛错 / 返回 null = 判不出目标类型，这两个 op 一律拒（不硬猜）。
      */
     getCapabilities?: (selector: string) => Promise<ElementCapabilities | null>;
-    /**
-     * 允许出现在 `src` 里的 origin 白名单（宿主注入：图片上传域 + 客户页自身的 origin）。
-     *
-     * 白名单而不是「只要是 http(s) 就行」：模型完全可能凭记忆敲一个域名出来，
-     * 而那个 `src` 会被**每一个真实访客**加载 —— 等于我们替客户往他的页面上挂了一个
-     * 第三方请求（可跟踪、可换内容、可失效）。空数组 = 全拒（fail closed）。
-     */
-    allowedImageOrigins: string[];
-    /**
-     * 本会话编辑器在这个页面上**读到过**的图片地址（完整 URL，整串相等才放行）。
-     * origin 白名单之外的第二条路：Shopify 这类站的图在 `cdn.shopify.com`，不在客户页 origin 下
-     * （见 `imageSource.ts`）。换图、整块重写、插入三处共用。缺省 = 这一路不放行。
-     */
-    allowedImageUrls?: string[];
     /**
      * 用户在对话里**逐字给过**的跳转地址。同源之外只认这一张表，且是**整串逐字相等**
      * （不是 origin 相等）：外站地址是把客户的流量送走，得由用户自己说出来才算数。

package/dist/kernel/ai/aiInlineApply.js

@@ -247,10 +247,7 @@ export async function applyAiChanges(changes, deps) {
                     });
                     continue;
                 }
-                const gate = sanitizeReplaceHtml(change.content, {
-                    allowedImageOrigins: deps.allowedImageOrigins,
-                    allowedImageUrls: deps.allowedImageUrls
-                });
+                const gate = sanitizeReplaceHtml(change.content);
                 if (gate.ok === false) {
                     rejected.push({
                         index,
@@ -301,10 +298,7 @@ export async function applyAiChanges(changes, deps) {
                     });
                     continue;
                 }
-                const gate = sanitizeInsertHtml(change.content, {
-                    allowedImageOrigins: deps.allowedImageOrigins,
-                    allowedImageUrls: deps.allowedImageUrls
-                });
+                const gate = sanitizeInsertHtml(change.content);
                 if (gate.ok === false) {
                     rejected.push({
                         index,
@@ -371,17 +365,12 @@ export async function applyAiChanges(changes, deps) {
                 continue;
             }
             if (change.abTestType === 'CHANGE_IMAGE') {
-                const src = parseHttpUrl(change.src);
-                if (!src ||
-                    !imageSourceAllowed(change.src, {
-                        allowedImageOrigins: deps.allowedImageOrigins,
-                        allowedImageUrls: deps.allowedImageUrls
-                    })) {
+                if (!imageSourceAllowed(change.src)) {
                     rejected.push({
                         index,
                         selector,
                         reason: 'UNSAFE_IMAGE_SRC',
-                        detail: src ? `origin not allowed: ${src.origin}` : 'not an http(s) url'
+                        detail: 'not an http(s) url'
                     });
                     continue;
                 }

package/dist/kernel/ai/imageSource.d.ts

@@ -1,24 +1,14 @@
 /**
- * AI 改动里**图片地址**的来源判定 —— 换图（`CHANGE_IMAGE`）、整块重写（`EDIT_HTML`）、
+ * AI 改动里**图片地址**的判定 —— 换图（`CHANGE_IMAGE`）、整块重写（`EDIT_HTML`）、
  * 插入（`INSERT_ELEMENT`）三处共用这一份，免得三道闸各写一套、口径漂移。
  *
- * 两条路放行，其余一律拒（fail closed）：
+ * 只认协议：http(s) 的绝对地址放行；`javascript:` / `data:` / 相对地址 / 空一律拒。
  *
- * 1. **origin 白名单**：客户页自身 + 我们的上传 / 生图域名（宿主注入）。按 origin 比，
- *    不按前缀比 —— `https://cdn.pt.com.evil.com/x.png` 的前缀与白名单项吻合，origin 却是另一个站。
- * 2. **本页已出现过的图片地址**：编辑器这次会话在这个页面上**自己读到**的图（`anchor-image:` /
- *    `element-image:` 行、发给 agent 的 html 里的 `<img src>`），整串精确相等才算。
- *    存在的理由：Shopify 这类站的图全在 `cdn.shopify.com`，不在客户页 origin 下 —— 只认 origin 的话，
- *    AI 连「把页面上已有的商品图放进新模块」「整块重写时把原图原样写回去」都会被拒。
- *    按整串而不是按 origin 放：放行整个 `cdn.shopify.com` 等于允许任意 Shopify 店铺的任意图片。
- *    与 `SET_LINK` 的 `allowedLinkUrls`（本会话出现过的链接）同一个思路。
+ * 2026-10-20 去掉了域名白名单（宿主注入的 origin 表 + 本会话读到过的图片地址）。生图落在哪个
+ * 域名随部署环境变（测试区 mastra 的产图在 npstaticprod，上传图在 npstaticdev），白名单要每个
+ * 环境配一遍，漏一个就整处改动被拒；落地页 AI 那边本来也不查域名。宿主那两个入参
+ * （`allowedImageOrigins` / `allowedImageUrls`）保留但不再读，见 `InlineEditor` 的 props。
  */
-export interface ImageSourcePolicy {
-    /** 空数组 = 这一路全拒。 */
-    allowedImageOrigins: string[];
-    /** 本会话在这个页面上读到过的图片地址（完整 URL）。缺省 = 这一路不放行任何地址。 */
-    allowedImageUrls?: string[];
-}
 /** 只认 http(s) 的绝对地址；解析失败返回 null。 */
 export declare function parseImageUrl(raw: string | null | undefined): URL | null;
-export declare function imageSourceAllowed(raw: string | null | undefined, policy: ImageSourcePolicy): boolean;
+export declare function imageSourceAllowed(raw: string | null | undefined): boolean;

package/dist/kernel/ai/imageSource.js

@@ -9,11 +9,6 @@ export function parseImageUrl(raw) {
         return null;
     }
 }
-export function imageSourceAllowed(raw, policy) {
-    const url = parseImageUrl(raw);
-    if (!url)
-        return false;
-    if (policy.allowedImageOrigins.includes(url.origin))
-        return true;
-    return (policy.allowedImageUrls ?? []).some(known => parseImageUrl(known)?.href === url.href);
+export function imageSourceAllowed(raw) {
+    return parseImageUrl(raw) !== null;
 }

package/dist/kernel/ai/insertHtmlGate.d.ts

@@ -24,7 +24,6 @@
  * 代价是模型偶尔会因为一个多余属性被打回整条。这是有意的取舍:被打回时用户看到「这条被
  * 跳过」并可以再问一次,而清洗后的错误元素他看不出来。
  */
-import { type ImageSourcePolicy } from './imageSource.js';
 /**
  * 一段插入 HTML 的字节上限。
  *
@@ -66,6 +65,4 @@ export type InsertHtmlOutcome =
  * 依赖 `DOMParser`(产品页与 jsdom 都有)。拿不到解析器时**一律拒绝** ——
  * 「审不了就放过」是这类闸最糟的降级。
  */
-export declare function sanitizeInsertHtml(raw: string, 
-/** `img[src]` 的来源规则（见 `imageSource.ts`）。缺省 = 任何 img 都拒（fail closed）。 */
-images?: ImageSourcePolicy): InsertHtmlOutcome;
+export declare function sanitizeInsertHtml(raw: string): InsertHtmlOutcome;

package/dist/kernel/ai/insertHtmlGate.js

@@ -61,7 +61,7 @@ function isSafeStyleAttr(value) {
         !v.includes('expression(') &&
         !v.includes('url('));
 }
-export function sanitizeInsertHtml(raw, images = { allowedImageOrigins: [] }) {
+export function sanitizeInsertHtml(raw) {
     const html = (raw ?? '').trim();
     if (!html)
         return { ok: false, problem: { reason: 'EMPTY' } };
@@ -108,13 +108,13 @@ export function sanitizeInsertHtml(raw, images = { allowedImageOrigins: [] }) {
                 };
             }
         }
-        if (tag === 'img' && !imageSourceAllowed(el.getAttribute('src'), images)) {
+        if (tag === 'img' && !imageSourceAllowed(el.getAttribute('src'))) {
             const src = el.getAttribute('src');
             return {
                 ok: false,
                 problem: {
                     reason: 'UNSAFE_IMAGE_SRC',
-                    detail: src ? `source not allowed: ${src.slice(0, 60)}` : 'img without src'
+                    detail: src ? `not an http(s) url: ${src.slice(0, 60)}` : 'img without src'
                 }
             };
         }

package/dist/kernel/ai/replaceHtmlGate.d.ts

@@ -11,18 +11,16 @@
  *    （`dialogs/htmlValidation.ts`），AI 这条只会更需要。
  * 2. **必须能带 `img`。** 整块重写要把块里原有的图再吐一遍；不允许 `img` 等于说
  *    「含图的区块永远重写不了」——而首屏、商品展示这些最想改的块恰恰都含图。
- *    放开的代价用 **origin 白名单**兜住（与 `CHANGE_IMAGE` 同一张表、同一套 origin 比较），
- *    并且把 `srcset` 整条剥掉：那是第二条 URL 通道，白名单管不到它。
+ *    `img[src]` 与 `CHANGE_IMAGE` 同一套地址规则（`imageSource.ts`：只认 http(s)），
+ *    `srcset` 整条剥掉：那是第二条 URL 通道。
  * 3. **预算更大。** 2048B 是按「一个小新元素」定的，真实区块的 outerHTML 不是那个量级。
  *
  * ⚠️ 用 `<template>` 解析而不是 `<div>`：`<div>` 会把 `<td>` / `<tr>` / `<option>` 这类
  * **需要正确宿主**的标签当成错误内容丢掉 —— 于是「审查通过」了，应用后结构却塌掉。
  * 这一条与 `dialogs/htmlValidation.ts` 同源，理由也一样。
  *
- * ⚠️ `url()` 仍然禁止。允许 `img` 不等于允许任意对外请求：`img[src]` 过 origin 白名单，
- * 而 `style="background:url(...)"` 绕开那张表。
+ * ⚠️ `url()` 仍然禁止：`style="background:url(...)"` 是 `img` 之外的又一条对外请求通道。
  */
-import { type ImageSourcePolicy } from './imageSource.js';
 /** 一段替换 HTML 的字节上限。比插入那份宽，但模型偶尔会吐一整屏 markup，仍要封顶。 */
 export declare const REPLACE_HTML_BUDGET_BYTES = 8192;
 export type ReplaceHtmlReject = {
@@ -57,15 +55,10 @@ export type ReplaceHtmlOutcome =
     ok: false;
     problem: ReplaceHtmlReject;
 };
-/**
- * `img[src]` 的来源规则：与 `CHANGE_IMAGE`、`INSERT_ELEMENT` 同一份（见 `imageSource.ts`）——
- * origin 白名单（客户页自身 + 上传 / 生图域），或本页已出现过的图片地址（整串相等）。
- */
-export type ReplaceHtmlOptions = ImageSourcePolicy;
 /**
  * 审查并规整一段将**替换掉某个既有元素**的 HTML。
  *
  * 依赖 `DOMParser`（产品页与 jsdom 都有）。拿不到解析器时**一律拒绝** ——
  * 「审不了就放过」是这类闸最糟的降级。
  */
-export declare function sanitizeReplaceHtml(raw: string, opts: ReplaceHtmlOptions): ReplaceHtmlOutcome;
+export declare function sanitizeReplaceHtml(raw: string): ReplaceHtmlOutcome;

package/dist/kernel/ai/replaceHtmlGate.js

@@ -62,7 +62,7 @@ function isSafeStyleAttr(value) {
     const v = value.toLowerCase();
     return !v.includes('javascript:') && !v.includes('expression(') && !v.includes('url(');
 }
-export function sanitizeReplaceHtml(raw, opts) {
+export function sanitizeReplaceHtml(raw) {
     const html = (raw ?? '').trim();
     if (!html)
         return { ok: false, problem: { reason: 'EMPTY' } };
@@ -132,13 +132,13 @@ export function sanitizeReplaceHtml(raw, opts) {
                 };
             }
         }
-        if (tag === 'img' && !imageSourceAllowed(el.getAttribute('src'), opts)) {
+        if (tag === 'img' && !imageSourceAllowed(el.getAttribute('src'))) {
             const src = el.getAttribute('src');
             return {
                 ok: false,
                 problem: {
                     reason: 'UNSAFE_IMAGE_SRC',
-                    detail: src ? `origin not allowed: ${src.slice(0, 60)}` : 'img without src'
+                    detail: src ? `not an http(s) url: ${src.slice(0, 60)}` : 'img without src'
                 }
             };
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ptengine/inline-editor",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "Ptengine Inline 编辑器：画布会话编排、图层树、属性面板与组件库（含内部 canvas-ui）",
   "license": "UNLICENSED",
   "private": false,