uni-app APP端非图片文件的上传下载及预览

在处理uni-app中APP端非图片文件的上传、下载及预览时，通常会涉及文件选择、文件读取、文件上传、文件下载以及文件预览等操作。下面是一个简单的代码示例，展示了如何实现这些功能。

文件选择及读取

首先，我们需要让用户选择文件。在uni-app中，可以使用<input type="file">来实现文件选择，但需要注意，这种方式在APP端可能不完全支持，所以更推荐使用uni-app提供的plus.io模块。

// 文件选择
plus.io.resolveLocalFileSystemURL('_www/', entry => {
    entry.getDirectory('documents', {create: true}, dirEntry => {
        dirEntry.getFile('sample.txt', {create: true, exclusive: false}, fileEntry => {
            fileEntry.createWriter(writer => {
                // 创建一个文件选择器
                const fileChooser = document.createElement('input');
                fileChooser.type = 'file';
                fileChooser.accept = '*/*'; // 接受所有文件类型

                fileChooser.onchange = e => {
                    const file = e.target.files[0];
                    const reader = new FileReader();

                    reader.onload = function(event) {
                        const content = event.target.result;
                        writer.write(content);
                        console.log('文件内容已写入:', content);
                    };

                    reader.readAsText(file);
                };

                document.body.appendChild(fileChooser);
                fileChooser.click();
            }, err => {
                console.error('创建文件写入器失败:', err);
            });
        }, err => {
            console.error('获取文件失败:', err);
        });
    }, err => {
        console.error('获取目录失败:', err);
    });
}, err => {
    console.error('解析本地文件系统URL失败:', err);
});

文件上传

文件上传可以使用XMLHttpRequest或fetch API。以下是一个使用fetch API上传文件的示例：

const formData = new FormData();
formData.append('file', fileEntry.file({create: false})); // 注意这里的fileEntry是从之前步骤中获取的

fetch('https://your-server.com/upload', {
    method: 'POST',
    body: formData
}).then(response => response.json())
  .then(data => console.log('上传成功:', data))
  .catch(err => console.error('上传失败:', err));

文件下载及预览

文件下载可以使用plus.downloader.createDownload方法，下载完成后可以保存到指定路径，并使用相关组件或API进行预览。

const task = plus.downloader.createDownload('https://your-server.com/file.txt', {filename: '_documents/downloaded.txt'}, (e, task) => {
    if (e.code == 200) {
        console.log('下载成功:', task.filename);
        // 可以使用uni-app的文件预览组件或其他方式预览文件
    } else {
        console.error('下载失败:', e.msg);
    }
});
task.start();

以上代码展示了如何在uni-app中实现非图片文件的上传、下载及预览的基本流程。具体实现时，可能需要根据项目需求进行调整和优化。