有一个前端的需求,需要远程文件存到本地,但是要拉起windows的文件系统

当前代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Download and Save File</title>
</head>
<body>

<button id="saveDocxButton" data-url="http://192.168.0.166:8083/excel/ww.docx">下载docx</button>
<button id="saveZipButton" data-url="http://192.168.0.166:8083/excel/111.zip">下载zip</button>

<script>
    async function downloadAndSaveFile(url) {
        try {
            const response = await fetch(url);
            if (!response.ok) {
                throw new Error('网络请求失败');
            }
            const fileData = await response.blob();
            const urlSegments = url.split('/');
            const fileOldName = urlSegments[urlSegments.length - 1];
            const fileExtension = fileOldName.split('.').pop().toLowerCase();
            let mimeType = '';
            switch (fileExtension) {
                case 'zip':
                    mimeType = 'application/zip';
                    break;
                case 'txt':
                    mimeType = 'text/plain';
                    break;
                case 'pdf':
                    mimeType = 'application/pdf';
                    break;
                case 'jpg':
                case 'jpeg':
                    mimeType = 'image/jpeg';
                    break;
                case 'png':
                    mimeType = 'image/png';
                    break;
                case 'doc':
                case 'docx':
                    mimeType='application/vnd.openxmlformats-officedocument.wordprocessingml.document';
                    break;
                case 'mp4':
                    mimeType = 'video/mp4';
                    break;
                case 'mp3':
                    mimeType = 'audio/mpeg';
                    break;
                default:
                    alert('不支持'+fileExtension+'类型');
                    return;
            }
            const fileName = prompt('请输入文件名', fileOldName);
            if (!fileName) return;
            const options = {
                suggestedName: fileName , // 用户输入的文件名
                types: [{ description: `${fileExtension.toUpperCase()} 文件`, accept: { [mimeType]: [`.${fileExtension}`] } }] // 动态文件类型和后缀
            };
            const fileHandle = await window.showSaveFilePicker(options);
            const writableStream = await fileHandle.createWritable();
            await writableStream.write(fileData);
            await writableStream.close();
            console.log('文件保存成功!');
        } catch (error) {
            console.error('保存文件时出错:', error);
        }
    }
    document.getElementById('saveDocxButton').addEventListener('click', (event) => {
        const url = event.target.getAttribute('data-url');
        downloadAndSaveFile(url);
    });
    document.getElementById('saveZipButton').addEventListener('click', (event) => {
        const url = event.target.getAttribute('data-url');
        downloadAndSaveFile(url);
    });
</script>

</body>
</html>

问题

我看函数showSaveFilePicker目前只支持:chrome、edge;

有一个前端的需求,需要远程文件存到本地,但是要拉起windows的文件系统

需求

需要满足所有游览,点击下载打开系统的本地文件系统进行存储。

有没有大佬知道还有其他方式的,万分感谢

《L05 电商实战》
从零开发一个电商项目,功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等
《L02 从零构建论坛系统》
以构建论坛项目 LaraBBS 为线索,展开对 Laravel 框架的全面学习。应用程序架构思路贴近 Laravel 框架的设计哲学。
讨论数量: 16
sanders

为啥不直接给用户下载链接哪?

2周前 评论
Shine-x (楼主) 2周前
sanders (作者) 2周前

好家伙,人家打开个网页,就往人家电脑里存一个文件,黑客狂喜

2周前 评论
Shine-x (楼主) 2周前
稻草人AQA (作者) 2周前

额 我想的是创建个a标签 设置download属性 然后设置隐藏 点击按钮事件后 手动触发a链接点击事件 这样不可以么

2周前 评论
Shine-x (楼主) 2周前

感觉不行,应该只能打开本地文件,远程不行

2周前 评论
Shine-x (楼主) 2周前

本地可以,远程估计没有权限的嘛,可能不太行

2周前 评论
yangweijie

用php-webview 开发个客户端把 ,选择保存的目录, 后续瞎下载的文件前端获取文件流后,php往那个地方写文件就行。

2周前 评论
Shine-x (楼主) 2周前
yangweijie

客户端一样可以webview 嵌入iframe 吧

2周前 评论

浏览器应该是没戏。要不生成迅雷下载链接地址,如果用户有装迅雷 可以触发迅雷下载

2周前 评论

浏览器应该不行的 只能下载,你不能指定存到哪里去 这个很久以前就研究过

2周前 评论

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!