当前位置：首页 > news >正文

CefSharp 文件下载和保存功能-监听前端事件

news 来源：原创 2025/6/8 22:48:48

重点在 启用文件下载 和 通过 JavaScript 调用 C# 保存文件：

1. 添加文件下载处理器 (`DownloadHandler`)

在 VueFormService 类中，添加一个实现 IDownloadHandler 接口的类，用于处理文件下载到本地。

// 新增的 DownloadHandler 类
public class DownloadHandler : IDownloadHandler
{
    public void OnBeforeDownload(IWebBrowser chromiumWebBrowser, IBrowser browser, DownloadItem downloadItem, IBeforeDownloadCallback callback)
    {
        // 设置默认保存路径（例如保存到 Downloads 文件夹）
        string savePath = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.UserProfile), "Downloads", downloadItem.SuggestedFileName);
        callback.Continue(savePath, showDialog: false); // showDialog: true 会弹出保存对话框
    }

    public void OnDownloadUpdated(IWebBrowser chromiumWebBrowser, IBrowser browser, DownloadItem downloadItem, IDownloadItemCallback callback)
    {
        // 下载状态更新（例如进度、完成通知）
        if (downloadItem.IsComplete)
        {
            MessageBox.Show($"文件已保存到：{downloadItem.FullPath}");
        }
    }
}

2. 在 `LoadVuePage` 方法中绑定下载处理器

在初始化浏览器时，设置 DownloadHandler 属性。

public static void LoadVuePage(VueBaseForm vueForm, string subFolder = "")
{
    // ... 其他代码 ...

    ChromiumWebBrowser browser = new ChromiumWebBrowser(url);
    vueForm.browser = browser;

    // 添加下载处理器
    browser.DownloadHandler = new DownloadHandler();  // <-- 新增代码

    vueForm.Controls.Add(browser);
    browser.Dock = DockStyle.Fill;

    // ... 其他代码 ...
}

3. 添加 JavaScript 调用 C# 保存文件的功能

在 RegisterHander 方法中，注册一个供 JavaScript 调用的对象，用于直接保存文件内容。

(1) 新增 `FileSaveHandler` 类

public class FileSaveHandler
{
    public void SaveFile(string fileName, string content)
    {
        string savePath = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.UserProfile), "Downloads", fileName);
        File.WriteAllText(savePath, content);
        MessageBox.Show($"文件已保存到：{savePath}");
    }
}

(2) 修改 `RegisterHander` 方法

public static void RegisterHander(VueBaseForm vueForm)
{
    ChromiumWebBrowser browser = vueForm.browser;

    // 注册文件保存处理器
    browser.JavascriptObjectRepository.Register("fileSaver", new FileSaveHandler(), isAsync: false, options: BindingOptions.DefaultBinder);  // <-- 新增代码

    // ... 其他原有注册代码 ...
}

4. JavaScript 调用示例

在 Vue 页面中，通过 fileSaver 对象调用 C# 的 SaveFile 方法：

// 示例：点击按钮保存文件
function saveFile() {
    const content = "Hello, this is a saved file!";
    fileSaver.saveFile("example.txt", content);
}

完整代码整合后的修改点

修改后的 `VueFormService` 类

using CefSharp;
using CefSharp.WinForms;
using CefSharpVue;
using CefSharpVue.Core.Utils.Winform;
using CefSharpVue.Hander;
using DPI_Ter.Vue;
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.IO;
using System.Text;
using System.Windows.Forms;

namespace CefSharpVue
{
    public class VueFormService
    {
        // ... 其他原有代码 ...

        public static void LoadVuePage(VueBaseForm vueForm, string subFolder = "")
        {
            // ... 其他代码 ...

            ChromiumWebBrowser browser = new ChromiumWebBrowser(url);
            vueForm.browser = browser;

            // 绑定下载处理器
            browser.DownloadHandler = new DownloadHandler();  // <-- 新增代码

            vueForm.Controls.Add(browser);
            browser.Dock = DockStyle.Fill;

            // ... 其他代码 ...
        }

        public static void RegisterHander(VueBaseForm vueForm)
        {
            ChromiumWebBrowser browser = vueForm.browser;

            // 注册文件保存处理器
            browser.JavascriptObjectRepository.Register("fileSaver", new FileSaveHandler(), isAsync: false, options: BindingOptions.DefaultBinder);  // <-- 新增代码

            // ... 其他原有注册代码 ...
        }

        // ... 其他原有代码 ...
    }

    // 新增的 DownloadHandler 类
    public class DownloadHandler : IDownloadHandler
    {
        public void OnBeforeDownload(IWebBrowser chromiumWebBrowser, IBrowser browser, DownloadItem downloadItem, IBeforeDownloadCallback callback)
        {
            string savePath = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.UserProfile), "Downloads", downloadItem.SuggestedFileName);
            callback.Continue(savePath, showDialog: false);
        }

        public void OnDownloadUpdated(IWebBrowser chromiumWebBrowser, IBrowser browser, DownloadItem downloadItem, IDownloadItemCallback callback)
        {
            if (downloadItem.IsComplete)
            {
                MessageBox.Show($"文件已保存到：{downloadItem.FullPath}");
            }
        }
    }

    // 新增的 FileSaveHandler 类
    public class FileSaveHandler
    {
        public void SaveFile(string fileName, string content)
        {
            string savePath = Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.UserProfile), "Downloads", fileName);
            File.WriteAllText(savePath, content);
            MessageBox.Show($"文件已保存到：{savePath}");
        }
    }
}

功能说明

文件下载：
- 当页面触发下载（例如 <a download> 链接或 JavaScript 下载），文件会自动保存到用户的 Downloads 文件夹。
- 通过 DownloadHandler 类控制保存路径和下载完成通知。
JavaScript 调用 C# 保存文件：
- 在 Vue 页面中，通过 fileSaver.saveFile(fileName, content) 直接调用 C# 方法保存文本文件。
- 文件默认保存到 Downloads 文件夹，路径可自定义。