引言
微信文档里面有关下载文件的API的说明：
貌似这个问题有很多玩家遇到，微信官方说法是根据服务器响应的header中的Content-Type来决定下载到本地的文件的后缀的，但是这个特性支持的特别不好，如果下载后，文件后缀名为.unknown就不好搞了。
怎么解决的呢？
思路：
第一步：
利用wx.downloadFile下载文件，下载成功后，可以获取到tempFilePath临时文件。这个临时文件路径不要改动。
第二步：
利用wx.getFileSystemManager获取到FileSystemManager对象，利用该对象的saveFile方法，把临时文件保存为本地文件，保存成功后，其success函数回调会返回savedFilePath本地路径。这个路径会把上面的临时文件移动到这个本地路径中，但是后缀名仍然为unknown。这一步的目的是把临时文件保存为本地文件。
第三步：
本地文件已经有了，我们就可以对本地文件进行任意的操作。利用FileSystemManager对象的copyFile，把上面的后缀为unknown的本地文件，复制到另外的本地文件。这个时候你可以任意定义复制到的文件的后缀。
有一点坑的是：上面第一步、第二步中的文件的路径（tempFilePath、savedFilePath）我们都是知道的，但是第三步中的复制到的目标路径需要开发者自己定义路径。
这个时候我们需要用到wx.env.USER_DATA_PATH常量。 这个常量是微信为每个小程序小游戏搞得目录地址，在这个路径下面你可以新建、删除等文件或者文件夹。有这个知识储备，你可以先调用FileSystemManager对象的mkdir方法，在wx.env.USER_DATA_PATH常量路径下新建一个文件夹，然后你再调用第三步的copyFile就可以了。
注意这里保存的文件路径，如果文件夹不存在，需要先调用mkdir创建文件目录，否则会失败。
注：
第二步和第三步可以合并。
wx.downloadFile下载文件可以利用filePath指定下载的目标路径，这样可以省略上面的第二步操作，直接利用这个filePath进行第三步的复制操作，把后缀为unknown的filePath文件，复制到指定的文件后缀的目标文件中，然后就可以使用该文件了。
有了以上分析过程，完美的文件下载过程应该是这样的：
1 访问文件夹是否可用
FileSystemManager.access({
path: wx.env.USER_DATA_PATH + '/' + this.mFileDir,
success: (res) => {
console.log('check success:', res);
checkSucHandler.run();
},
fail: (res) => {
console.log('check fail.', res);
checkFailHandler.run();
}
});
如果文件夹可用，进入第3步。如果文件夹不可用，进入第2步创建文件夹。
这里mFileDir表示开发者自定义的文件夹，检测这个文件夹是否可用
2 创建文件夹
this.mFileMgr.mkdir({
dirPath: wx.env.USER_DATA_PATH + '/' + this.mFileDir,
success: (res) => {
console.log('mk dir success:', res);
makeSucHandler.run();
},
fail: (res) => {
console.log('mk dir fail:', res);
makeFailHandler.run();
}
});
开发者自定义的mFileDir文件夹不可用，就调用mkdir方法创建该文件夹。
3 下载文件
wx.downloadFile({
url: url,
header: '',
filePath: wx.env.USER_DATA_PATH + '/' + this.mFileDir + '/' + fileName,
success: (res) => {
console.log('down load file. suc:', res);
downloadSucHandler.run();
},
fail: (res) => {
console.log('down load file. fail:', res);
downloadFailHandler.run();
},
});
这里把文件名为fileName的文件下载到开发者创建的mFileDir目录下面。
这里fileName文件名是完全自定义的，这里在下载指定的文件时，就指定文件名后缀，而不是通过微信来指定文件后缀。这样处理之后，就不会出现文件后缀名为unknown的情况啦。
以上，经过上面三步操作，就可以完美下载到文件啦。
4 删除文件
由于微信限制了微信小游戏小程序可用的空间大小50M。所以无用的文件需要尽早删除掉。
this.mFileMgr.removeSavedFile({
filePath: filePath,
success: (res) => {
console.log('remove save file. suc:', res);
if (removeFileSucHandler) {
removeFileSucHandler.run();
}
},
fail: (res) => {
console.log('remove save file. fail:', res);
if (removeFileFailHandler) {
removeFileFailHandler.run();
}
}
});
public unlinkSavedFile(filePath: string, removeFileSucHandler?: Laya.Handler,
removeFileFailHandler?: Laya.Handler): void {
this.mFileMgr.unlink({
filePath: filePath,
success: (res) => {
console.log('remove save file. suc:', res);
if (removeFileSucHandler) {
removeFileSucHandler.run();
}
},
fail: (res) => {
console.log('remove save file. fail:', res);
if (removeFileFailHandler) {
removeFileFailHandler.run();
}
}
});
}
微信文档里面提供了两种删除文件的方式。但是微信文档里面并没有说明这两种方法的区别，实际项目开发过程中发现，removeSavedFile方法在iOS上回出现删除文件不成功的现象，并且没有出错，方法也调用了，但是文件还在。而最后通过unlink方法删除文件则可以达到删除文件的目地。
所以，推荐使用unlink方法删除文件。
结束。
完整工具类如下：
export default class DownloadFileUtil {
private mFileMgr: FileSystemManager;
private mFileDir: string;
constructor(fileDir: string) {
this.mFileDir = fileDir;
if (Laya.Browser.onWeiXin) {
this.mFileMgr = wx.getFileSystemManager();
}
}
public checkDir(checkSucHandler: Laya.Handler,
checkFailHandler: Laya.Handler): void {
if (!Laya.Browser.onWeiXin) {
return;
}
//利用access方法判断文件是否可用
this.mFileMgr.access({
path: wx.env.USER_DATA_PATH + '/' + this.mFileDir,
success: (res) => {
console.log('check success:', res);
checkSucHandler.run();
},
fail: (res) => {
console.log('check fail.', res);
checkFailHandler.run();
}
});
}
public mkDir(makeSucHandler: Laya.Handler,
makeFailHandler: Laya.Handler): void {
if (!Laya.Browser.onWeiXin) {
return;
}
this.mFileMgr.mkdir({
dirPath: wx.env.USER_DATA_PATH + '/' + this.mFileDir,
success: (res) => {
console.log('mk dir success:', res);
makeSucHandler.run();
},
fail: (res) => {
console.log('mk dir fail:', res);
makeFailHandler.run();
}
});
}
public downloadFile(url: string, fileName: string,
downloadSucHandler: Laya.Handler,
downloadFailHandler: Laya.Handler): void {
if (!Laya.Browser.onWeiXin) {
return;
}
wx.downloadFile({
url: url,
header: '',
filePath: wx.env.USER_DATA_PATH + '/' + this.mFileDir + '/' + fileName,
success: (res) => {
console.log('down load file. suc:', res);
downloadSucHandler.run();
},
fail: (res) => {
console.log('down load file. fail:', res);
downloadFailHandler.run();
},
});
}
public removeSavedFiles(): void {
this.mFileMgr.getSavedFileList({
success: (savedFiles) => {
console.log('saved files list:', savedFiles);
var fileList = savedFiles.fileList as Array<any>;
for(var i=0; i<fileList.length; i++) {
this.mFileMgr.removeSavedFile({
filePath: fileList[i].filePath,
success: (r) => {
console.log('remove save file. success:', r);
},
fail: (r) => {
console.log('remove save file. fail:', r);
}
});
}
},
fail: (res) => {
console.log('get saved file list. fail:', res);
}
});
}
public removeSavedFile(filePath: string, removeFileSucHandler?: Laya.Handler,
removeFileFailHandler?: Laya.Handler): void {
this.mFileMgr.removeSavedFile({
filePath: filePath,
success: (res) => {
console.log('remove save file. suc:', res);
if (removeFileSucHandler) {
removeFileSucHandler.run();
}
},
fail: (res) => {
console.log('remove save file. fail:', res);
if (removeFileFailHandler) {
removeFileFailHandler.run();
}
}
});
}
public unlinkSavedFile(filePath: string, removeFileSucHandler?: Laya.Handler,
removeFileFailHandler?: Laya.Handler): void {
this.mFileMgr.unlink({
filePath: filePath,
success: (res) => {
console.log('remove save file. suc:', res);
if (removeFileSucHandler) {
removeFileSucHandler.run();
}
},
fail: (res) => {
console.log('remove save file. fail:', res);
if (removeFileFailHandler) {
removeFileFailHandler.run();
}
}
});
}
}
欢迎关注公众号：技术印象
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
