am-editor 图片上传问题

am-editor
@aomao/plugin-image 官方里面介绍看不懂

ImageUploader 插件命令
弹出文件选择框,并执行上传

可选参数 1:传入文件列表,将上传这些文件。传入图片地址,插入图片,如果为第三方图片就执行上传。否则弹出文件选择框并,选择文件后执行上传

//方法签名
async execute(files?: Array | string | MouseEvent):void
//执行命令
engine.command.execute(ImageUploader.pluginName);
以上是官方的解释

如何实现传入图片地址或者传入视频地址后显示

    [ImageUploader.pluginName]: {
        file: {
            action: `${DOMAIN}/upload`,
            headers: {Authorization: 213434},
        },
        remote: {
            action: `${DOMAIN}/download`,
        },
        isRemote: (src: string) => {
            console.log(src.indexOf(DOMAIN) < 0)
            return src.indexOf(DOMAIN) < 0
        },
    },

ImageUploader的配置如下 已知upload返回一个图片地址 download返回一张图片但是编辑器都没有反映

img

源于chatGPT仅供参考

根据您提供的信息,您正在使用am-editor编辑器和@aomao/plugin-image插件,想要实现传入图片地址或视频地址后显示在编辑器中。但是目前您的配置中没有反映在编辑器中。

针对这个问题,您可以按照以下步骤进行调试和排查:

1. 确保已正确安装`@aomao/plugin-image`插件,并在项目中正确引入和注册该插件。

2. 根据您提供的代码,ImageUploader的配置应该放在编辑器初始化时的配置对象中,具体代码如下:

```javascript
import Editor from 'am-editor';
import imagePlugin from '@aomao/plugin-image';

const DOMAIN = '图片和视频的域名'; // 将域名替换为实际的图片和视频域名

const editor = new Editor({
  // 编辑器其他配置...
  plugins: [
    // 其他插件...
    imagePlugin.configure({
      [imagePlugin.pluginName]: {
        file: {
          action: `${DOMAIN}/upload`,
          headers: { Authorization: 213434 },
        },
        remote: {
          action: `${DOMAIN}/download`,
        },
        isRemote: (src) => {
          console.log(src.indexOf(DOMAIN) < 0);
          return src.indexOf(DOMAIN) < 0;
        },
      },
    }),
  ],
});

// 初始化编辑器
editor.init();

请确保将DOMAIN变量替换为您实际的图片和视频域名。

  1. 在执行execute方法之前,确保已经正确获取到了图片地址或视频地址,并将地址作为参数传递给execute方法。
// 传入图片地址的示例
const imageUrl = '图片地址';
editor.command.execute(imagePlugin.pluginName, imageUrl);

// 传入视频地址的示例
const videoUrl = '视频地址';
editor.command.execute(imagePlugin.pluginName, videoUrl);

根据您提供的信息,execute方法的参数可以是文件列表、图片地址或鼠标事件。请根据实际情况传递对应的参数。

  1. 确保上传和下载的接口地址正确,并且服务器端能够处理上传和下载请求,并返回正确的结果。

通过以上步骤的排查,您应该能够实现传入图片地址或视频地址后显示在am-editor编辑器中。如果问题仍然存在,请提供更多的代码和错误日志,以便更好地帮助您解决问题。

```