芜湖一
芜湖一
  • 发布:2020-12-02 11:58
  • 更新:2020-12-03 20:34
  • 阅读:1182

【报Bug】 H5 中下载文件,返回的临时文件路径可以通过a标签来下载,但是无法通过uni.uploadFile 上传文件,只能通过手动获取文件路径才能上传

分类:uni-app

产品分类: uniapp/H5

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: win7

HBuilderX类型: 正式

HBuilderX版本号: 2.9.7

浏览器平台: Chrome

浏览器版本: 87.0.4280.66(正式版本) (64 位)

项目创建方式: HBuilderX

示例代码:

// 下载音频
uni.downloadFile({
// 代理
url:item.speakUrl.replace("http://openapi.youdao.com","/dpc"),
success:function(e)
{
// 创建a 标签下载文件
var a = document.createElement('a');
//需要下载的数据内容,我这里放的就是BLOB,如果你有下载链接就不需要了
a.href = e.tempFilePath;
a.download = "a.mp3";
a.click();

                        // 通过临时路径 上传文件  
                        uni.uploadFile({  
                            // 后端允许跨域,手动选择的路径没问题  
                            url:'http://192.168.1.136:8851/file_upload',  
                            filePath:e.tempFilePath,  
                            header:{  
                                mime:"audio/mpeg",  
                                'content-type':'audio/mpeg'  
                            },  
                            name:"file",  
                            success(e) {  
                                console.log("上传完成",e)  
                            },fail(e)  
                            {  
                                console.log("上传失败",e)  
                            }  
                        })  
                        console.log("存储路径",e);  
                    }  
                })

操作步骤:

1、通过uni api 下载文件,获取临时文件路径
2、通过临时的文件路径,上传文件
3、后端无法获取到文件,手动选择的文件却可以

预期结果:

后端可以收到文件

实际结果:

无法获取到文件

无法正常获取的样子:

文件信息 Stream {
_events: [Object: null prototype] {},
_eventsCount: 0,
_maxListeners: undefined,
readable: true,
headers:
{ 'content-disposition': 'form-data; name="file"; filename="file-1606880758515"',
'content-type': 'audio/mp3' },
name: 'file',
filename: 'file-1606880758515',
mime: 'audio/mp3',
transferEncoding: 'binary',
transferBuffer: '' }

可以获取的样子:

文件信息 Stream {
_events: [Object: null prototype] {},
_eventsCount: 0,
_maxListeners: undefined,
readable: true,
headers:
{ 'content-disposition': 'form-data; name="file"; filename="why.mp3"',
'content-type': 'audio/mpeg' },
name: 'file',
filename: 'why.mp3',
mime: 'audio/mpeg',
transferEncoding: 'binary',
transferBuffer: '' }

bug描述:

H5 中下载文件,返回的临时文件路径可以通过a标签来下载,但是无法通过uni.uploadFile 上传文件,只能通过手动获取文件路径才能上传

2020-12-02 11:58 负责人:无 分享
已邀请:
DCloud_UNI_LXH

DCloud_UNI_LXH

这种情况是可以上传的,给到后台是一个blob对象,你这里错误我推测是这样的:

  1. 传给后端的blob没有扩展名,或者是其他情况,后端不认,然后说拿不到,可以和后端协商看看怎么处理
  2. 使用XMLHttpRequest将这个文件下载成blob,然后,let file = new File([blob],filename,{type})。上传这个file。
  3. 或者给下载下来的blob,添加name属性 blob.name = filename,然后上传这个blob
  • 芜湖一 (作者)

    好的,谢谢了。后端我自己弄的,搞着玩的不是很熟,我试试看吧

    2020-12-10 12:42

该问题目前已经被锁定, 无法添加新回复