[Bug Report] <img> 无法正确触发 urlProcessor

[hbl917070]

Prerequisites

• There isn't an existing issue that reports the same bug to avoid duplicates.
• The provided information offers a minimal reproducible example of the bug.
• For Q&A, please open a GitHub Discussion instead.

Describe the Bug

使用 md 的图片语法可以正确触发 urlProcessor，但使用 html 的图片语法则不行

重现方法：
在官网的范例网页使用下面的语法
可以看到 b.jpg 没有触发 urlProcessor

![](a.jpg) 

<img src="b.jpg"> 

这个问题蛮严重的，一些服务的图片使用的是相对路径，或是本地档案的绝对路径，一定要经过 urlProcessor 处理才能正确显示

Reproduction Steps

No response

System Information

No response

Contributing

None

[lyzwg]

    engine: {
      customSyntax: {
        replaceImgBlock: {
          syntaxClass: customBlockHookWithImg,
          force: false,
          before: 'htmlBlock',
        },
      },
    },
    
    
    
      const customBlockHookWithImg = Cherry.createSyntaxHook('replaceImgBlock', Cherry.constants.HOOKS_TYPE_LIST.PAR, {
afterMakeHtml(str) {
  return str.replace(this.RULE.reg,  (match, srcValue) => {

    let url;
    const result = getFileUrl({objectKey: srcValue}).then((res)=>{
      url=res.data;
    });
    return  match.replace(srcValue, "url");

  });
},
rule() {
  return {reg: /<img\s+[^>]*src="([^"]+)"[^>]*>|!\[([^\]]*)\]\(([^)]+)\)/gi,}; // 匹配 <img> 标签
},

});
我想自定义img标签处理 通过接口查询图片的临时访问地址 但是afterMakeHtml好像不能设置成异步的 导致我的getFileUrl无法拿到请求的结果

[sunsonliu]

我想自定义img标签处理 通过接口查询图片的临时访问地址 但是afterMakeHtml好像不能设置成异步的 导致我的getFileUrl无法拿到请求的结果

确实还不支持异步，我重新打开下这个issue，尝试使自定义回调支持异步。
在此之前，一种推荐的临时解决办法是：先渲染cherry之前，通过正则拿到所有图片的url，然后发起异步请求获取这些图片URL->真实url的map，然后再实例化cherry，并在回调函数里通过map替换对应的图片URL

[lyzwg]

我想自定义img标签处理 通过接口查询图片的临时访问地址 但是afterMakeHtml好像不能设置成异步的 导致我的getFileUrl无法拿到请求的结果

确实还不支持异步，我重新打开下这个issue，尝试使自定义回调支持异步。 在此之前，一种推荐的临时解决办法是：先渲染cherry之前，通过正则拿到所有图片的url，然后发起异步请求获取这些图片URL->真实url的map，然后再实例化cherry，并在回调函数里通过map替换对应的图片URL

好的 谢谢 但是还有一个问题：urlMap必须在cherry渲染之前处理好，那么在编辑区的时候就会有问题了 ，例如我在编辑区新增了一个图片 这个图片在urlMap中就不存在了 没有真实路径 导致无法在预览区显示