Electron下载生成的小程序二维码图片(非浏览器a标签下载)

javascript 复制代码
const generateMiniProgramQR = async (
    params: { scene: any; page?: any; width?: number; label?: any },
    ACCESS_TOKEN: any,
    label: any
) => {
    try {
        const url = `https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=${ACCESS_TOKEN}`
        
        // 渲染进程
        // const { ipcRenderer } = require('electron')

        const downloadFile = async (
            url: string,
            params: { scene: any; page?: any; width?: number | undefined; label?: any },
            filename: string
        ) => {
            try {
                const response = await axios.post(url, params, { responseType: 'arraybuffer' })
                //     //  将二进制数据通过IPC发送到主进程
                //     ipcRenderer.send('silent-download', {
                //         buffer: Buffer.from(response.data),
                //         filename: `${filename}.jpg`,
                //     })

                // 关键:转换为 Uint8Array 而非 Buffer
                const buffer = new Uint8Array(response.data)

                // 通过预加载接口发送
                window.electronAPI.downloadFile(buffer, `${filename}.jpg`)

                // 监听结果(可选)
                window.electronAPI.onDownloadResult(({ success, path, error }) => {
                    if (success) console.log('文件保存至:', path)
                    else console.error('保存失败:', error)
                })
            } catch (error) {
                console.error('下载请求失败:', error)
            }
        }
        downloadFile(url, params, label)
    } catch (error) {
        // 错误处理
        console.error('下载失败:', error)
    }
}

注意

这里用require不行,主线程默认开启contextIsolation,不允许node方式引入

javascript 复制代码
const { ipcRenderer } = require('electron')

主线程main.ts,每次修改文件,项目会自动重启

javascript 复制代码
import { app, BrowserWindow, dialog, ipcMain, shell } from 'electron'
import path from 'node:path'
import fs from 'fs'
ipcMain.on('silent-download', (event, { buffer, filename }) => {
    try {
        const downloadsPath = app.getPath('desktop'); 
        // 改为系统下载目录:app.getPath('downloads')
        const filePath = path.join(downloadsPath, filename);

        // 将 Uint8Array 转换为 Node.js Buffer
        const nodeBuffer = Buffer.from(buffer);
        fs.writeFile(filePath, nodeBuffer, (err) => {
            if (err) {
                event.sender.send('download-result', { success: false, error: err.message });
            } else {
                event.sender.send('download-result', { success: true, path: filePath });
            }
        });
    } catch (error: any) {
        event.sender.send('download-result', { success: false, error: error.message });
    }
});

preload.ts

javascript 复制代码
import { ipcRenderer, contextBridge } from 'electron'

contextBridge.exposeInMainWorld('electronAPI', {
  downloadFile: (buffer: any, filename: any) => {
    // 验证数据类型
    if (!(buffer instanceof Uint8Array)) {
      throw new Error('必须传递 Uint8Array 类型数据');
    }
    ipcRenderer.send('silent-download', { buffer, filename });
  },
  // 可选:接收主进程反馈
  onDownloadResult: (callback: (arg0: any) => void) => {
    ipcRenderer.on('download-result', (_event, result) => callback(result));
  }
});

electron-env.d.ts

javascript 复制代码
interface IElectronAPI {
  // 声明预加载脚本暴露的方法签名
  downloadFile: (buffer: any, filename: string) => void;
  onDownloadResult: (callback: (arg0: any) => void) => void
  // 其他方法...
}

// Used in Renderer process, expose in `preload.ts`
interface Window {
  ipcRenderer: import('electron').IpcRenderer,
  electronAPI: IElectronAPI;
}
相关推荐
2501_915909069 分钟前
HTML 开发工具有哪些?常用 HTML 开发工具推荐、学习路线与实战经验分享
android·小程序·https·uni-app·iphone·webview
上单带刀不带妹43 分钟前
Vue3 全局 API 转移详解
前端·javascript·vue.js·vue3·api
怕冷的火焰(~杰)1 小时前
yarn安装electron和better-sqlite3失败问题(rebuild:better-sqlite3)
前端·javascript·electron
摸鱼的春哥1 小时前
“全栈模式”必然导致“质量雪崩”!和个人水平关系不大
前端·javascript·后端
A_ugust__6 小时前
vue3+ts 封装跟随弹框组件,支持多种模式【多选,分组,tab等】
前端·javascript·vue.js
林九生6 小时前
【Vue3】v-dialog 中使用 execCommand(‘copy‘) 复制文本失效的原因与解决方案
前端·javascript·vue.js
emma羊羊8 小时前
【xsslabs】第12-19关
前端·javascript·靶场·xss
Larry_Yanan10 小时前
QML学习笔记(十七)QML的属性变更信号
javascript·c++·笔记·qt·学习·ui
真的想不出名儿10 小时前
vue项目引入字体
前端·javascript·vue.js
GISer_Jing12 小时前
0926第一个口头OC——快手主站前端
开发语言·前端·javascript