JavaScript中，您可以使用HTML5的<input type="file">元素来实现图片上传功能。

以下是一个简单的示例代码，演示如何在JavaScript中上传图片：

HTML部分：

<input type="file" id="uploadInput">
<button onclick="uploadImage()">上传图片</button>

JavaScript部分：

function uploadImage() {
  var fileInput = document.getElementById('uploadInput');
  var file = fileInput.files[0];

  if (file) {
    var formData = new FormData();
    formData.append('image', file);

    // 发送图片数据到服务器
    // 这里可以使用XMLHttpRequest或fetch等方法发送请求
    // 请根据您的需求选择适当的方法
    // 示例中使用XMLHttpRequest发送POST请求
    var xhr = new XMLHttpRequest();
    xhr.open('POST', '/upload', true);
    xhr.onload = function() {
      if (xhr.status === 200) {
        // 上传成功
        console.log('图片上传成功');
      } else {
        // 上传失败
        console.log('图片上传失败');
      }
    };
    xhr.send(formData);
  }
}

API部分：

[HttpPost]
[RequestSizeLimit(5242880)]
 public async Task<APIResult> upload(IFormCollection collection)
 {

            APIResult rtn = new APIResult();

            if (collection == null)
            {
                rtn.code = -100;
                rtn.msg = "图片列表为空";
                return rtn;
            }
            else
            {
                try
                {
                    string file_path = "";
                    // 预处理 用户参数:用户指定子路径                   
                    string userPath = DateTime.Now.ToString("yyyy-MM-dd");
                    if (collection.ContainsKey("path"))
                    {
                        collection.TryGetValue("path", out Microsoft.Extensions.Primitives.StringValues val);
                        if (!val.Equals("undefined"))
                        {
                            userPath = val.ToString();
                        }
                    }

                    // 预处理 文件路径
                    // 注意：这里可能会根据不同的环境来 修改 路径前面是否需要添加 /
                    // 当发现上传不成功，目录无法创建时，可以尝试修改这里
                    file_path = $"upload/imgs/{userPath}/";
                    var uploadPath = Path.Combine(_webHostEnvironment.WebRootPath, file_path);
                    if (!Directory.Exists(uploadPath))
                    {
                        Directory.CreateDirectory(uploadPath);
                    }

                    // 处理文件
                    FormFileCollection filelist = (FormFileCollection)collection.Files;
                    foreach (IFormFile file in filelist)
                    {
                        // 保存文件到磁盘
                        string name = file.FileName;
                        string FilePath = Path.Combine(uploadPath, name);
                        string type = Path.GetExtension(name);
                        using (var stream = System.IO.File.Create(FilePath))
                        {
                            await file.CopyToAsync(stream);
                        };

                        // 保存文件信息到表
                        Sys_File f = new Sys_File();
                        f.code = "image";
                        f.name = name;
                        f.file_type = type.Trim('.');
                        f.file_group = userPath;
                        f.file_path = $"/{file_path}{name}";
                        f.is_active = true;
                        f.memo = "";
                        f.createTime = DateTime.Now;
                        using (var dbctx = DBHelper.db)
                        {
                            await dbctx.AddAsync(f);
                            await dbctx.SaveChangesAsync();
                        };
                        // 返回消息，包含文件路径
                        rtn.datas = $"/{file_path}{name}";
                        rtn.code = 100;
                        rtn.msg = "文件已保存！";
                    }
                }
                catch (Exception ex)
                {
                    rtn.code = -200;
                    rtn.msg = "图片保存失败!";
                    Log4NetUnit.Instance.Log.Error("图片保存失败:" + ex.Message);
                }
                return rtn;
            }
        }

在这个示例中，我们首先在HTML中创建了一个<input type="file">元素，用于选择要上传的图片。

然后，我们在JavaScript中编写了一个uploadImage函数，该函数在点击"上传图片"按钮时触发。

在uploadImage函数中，我们首先获取到<input>元素，并从中获取到用户选择的图片文件。

然后，我们创建一个FormData对象，并将图片文件添加到其中。

接下来，我们可以使用XMLHttpRequest或fetch等方法将图片数据发送到服务器。

在示例中，我们使用XMLHttpRequest发送了一个POST请求，将图片数据作为FormData发送到/upload端点。

您需要根据您的实际情况修改URL和请求方法。

当请求完成时，我们可以根据响应的状态码来判断上传是否成功。

在示例中，如果状态码为200，则表示上传成功，否则表示上传失败。

请注意，由于安全性限制，JavaScript无法直接访问用户的文件系统。

因此，用户必须手动选择要上传的文件。

文本插件TINYMCE使用CTRL+V粘贴图片上传到远程服务器

最近项目中有一个需求，需要在编辑器增加Word内容一键粘贴的功能，粘贴后能够自动将Word中的图片上传到服务器中，并且保留Word文档中的文本样式，比如颜色，字体，字体大小，表格等。粘贴操作要求支持快捷键操作（Ctrl + V），Web编辑器使用的TinyMCE5

用户每天需要发布新闻，新闻都是由编辑写好，保存在Word文档中，之前发的时候图片处理比较麻烦，都是一张张上传，效率比较低，现在希望能够批量自动上传，提高工作效率。

希望在现有的后台管理系统中直接集成到现有的编辑器（tinymce）中，做成一个按钮，用户点击按钮后就能粘贴，图片自动上传。操作尽量简单，用户体验尽量的好用。

网上搜了一下，基本上大部分文章讲的都是用VUE+HTML5来实现的。我们实际测试后发现这种方案局限性比较大，而且兼容性也不够好，在有些电脑上不行，有些客户电脑又行，暂时找不到原因，开源方案也没人联系，没有任何技术支持，所以放弃。图片是转成了BASE64上传，与原始图片相比尺寸更大些，应该是自动转换时出了问题，清晰度也有下降。

找了几个星期最终只找到了一个最符合需求的插件：泽优Word一键粘贴控件（WordPaster），实际测试后发现效果还不错基本能够满足需求。提供了完整的示例代码，整合教程和视频教程，集成起来也非常的方便，用户体验做的也很好。

项目组建议最好能够以插件方式进行使用，这样集成升级后期维护更方便，前端没有使用VUE框架，而是HTML+JS。用户希望直接集成到编辑器（UEditor）中，在工具栏中提供一个按钮，点击按钮后就能粘贴，图片自动上传。这样的用户体验是最好的

另外一点就是希望稳定可靠，因为用的人比较多，几乎每天都会使用，使用频繁也很高，出了问题就比较影响工作效率。客户那边要求提供手机和微信需要技术支持。

上面的几点能够满足的话基本就没有什么问题，领导希望最好提供OEM或者买断的采购方式，因为我们是软件公司，也是专门做政府单位项目，客户比较多，领导希望能够买断集成在我们自己的产品中，这样就能够为所有用户提供这个功能，用户体验也能够统一。主要是领导不想每次都要单独采购，太麻烦了。

示例下载：