You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

嵌入式Collabora Online文档锚定/书签功能实现求助

嵌入式Collabora Online书签功能滚动问题

我正在为嵌入式Collabora Online文档开发书签功能,支持PDF、DOCX、XLSX和PPTX格式的严格只读文档。目前已实现文本搜索与高亮功能,但视口不会自动滚动到高亮内容区域。

当前可行方案:postMessage实现文本搜索与高亮

通过postMessage发送指令可实现文本搜索和高亮:

function findAndHighlightText(searchText) {
    const iframe = document.getElementById('collabora-iframe');
    iframe.contentWindow.postMessage({
        MessageId: 'Action_Find',
        Values: {
            SearchItem: {
                SearchString: { type: 'string', value: searchText },
                Backward: { type: 'boolean', value: false },
                FindAll: { type: 'boolean', value: false }
            }
        }
    }, '*');
}

当前表现:文本可被找到并高亮为黄色,但Collabora不会自动滚动到该高亮区域。

核心问题

已获取文本原始位置坐标:

const originalCoordinates = { x: 1006, y: 1296 }; 

但无法通过编程方式让Collabora滚动到该坐标位置。

已尝试的失败方案

PostMessage滚动命令——无可用API

尝试了自定义的MessageId,但均无效:

// These MessageId types don't seem to exist
iframe.contentWindow.postMessage({
    MessageId: 'Action_ScrollTo',    // Not valid
    Values: { x: 1006, y: 1296 }
}, '*');

iframe.contentWindow.postMessage({
    MessageId: 'UI_ScrollToPosition', // Not valid  
    Values: { x: 1006, y: 1296 }
}, '*');

UNO命令——定位支持有限

UNO的页面跳转命令无法控制视口位置:

// These don't provide viewport control
iframe.contentWindow.postMessage({
    MessageId: 'uno:.uno:GoToPage',
    Values: { Page: 1 }
}, '*');

部分有效的临时方案

  1. 带搜索参数重新加载文档
function reloadWithSearch(searchText) {
    const iframe = document.getElementById('collabora-iframe');
    const url = new URL(iframe.src);
    url.searchParams.set('search', searchText);
    url.searchParams.set('highlight', 'true');
    iframe.src = url.toString();
    
    // Follow up with search command after reload
    setTimeout(() => {
        findAndHighlightText(searchText);
    }, 3000);
}

该方案可靠性不足,Collabora加载文档后不会自动滚动到高亮结果。

  1. 多重搜索策略
function enhancedSearch(searchText) {
    // Try regular find
    findAndHighlightText(searchText);

    // Try find with replace dialog (sometimes scrolls better)
    setTimeout(() => {
        iframe.contentWindow.postMessage({
            MessageId: 'Action_FindReplace',
            Values: {
                SearchItem: {
                    SearchString: { type: 'string', value: searchText }
                }
            }
        }, '*');
    }, 500);
}

问题咨询

  • 是否存在文档中未提及的用于视口滚动的postMessage命令?
  • 是否有可控制文档初始滚动位置的URL参数?
  • 是否可以模拟Ctrl+F等快捷键打开Collabora原生查找对话框?
  • 这是否是已知限制,有无修复计划或可行替代方案?

环境信息

  • Docker部署的Collabora CODE
  • 使用postMessage API的iframe嵌入方式
  • WOPI主机提供文档服务
  • 严格只读文档模式(不允许修改)
  • 目标格式:PDF、DOCX、XLSX、PPTX

内容的提问来源于stack exchange,提问作者Marts

火山引擎 最新活动