已掉线,重新登录

首页 > 绿虎论坛 > 历史版块 > 虎绿林 > 开发

标题: [精]虎绿林附件前端表单直传API

作者: @Ta

时间: 2021-08-04发布,2021-08-05修改

点击: 6029

基本概念

[虎绿林API] 云存储文件上传API一帖中描述了通过虎绿林web服务器中转的方式上传文件到云存储(目前是阿里云OSS)的方法,但是该方法最大的缺点就是太慢了。

虎绿林web服务器带宽为5Mbps,所以最高上传速度约为640KB/s。但是如果能直接上传到云存储服务器(比如阿里云OSS),就可以达到数MB/s。

所以我们提供了帮助web应用程序和网页插件直接上传到云存储服务器的接口,以及web上传程序的参考实现。

参考实现:

 [网页插件]🚀图文快贴阿里云OSS直传版

表单直传步骤:

  1. 要求用户选择文件。
  2. 获得文件的文件名和大小。
  3. 计算文件的md5值(可选)。
  4. 请求以下接口获取上传表单模板(参数name size md5可通过GETPOST方式发送):
https://hu60.cn/q.php/api.upload-form.json?name=文件名&size=文件大小&md5=文件md5值

如未计算文件的md5值,则省略md5参数:

https://hu60.cn/q.php/api.upload-form.json?name=文件名&size=文件大小

请求将得到如下结果:

{
  // 文件是否存在,为true则表示文件存在,不需要再上传
  "fileExists": false,

  // 上传请求地址
  "requestUrl": "https://hu60cn.oss-cn-beijing.aliyuncs.com",

  // 上传请求类型
  "method": "POST",

  // 上传请求的Content-Type
  "enctype": "multipart/form-data",

  // 上传请求表单的内容,应该原样提交这些内容到服务器,
  // 不要试图解析里面的字段,因为字段随时可能会改变
  "formData": {
    "a":"b", "c":"d", ...
  },

  // 文件字段的名称
  // 需要添加到 formData 中,内容是你要上传的文件
  "fileFieldName": "file",

  // 如果上传成功,可用该URL下载文件
  "downloadUrl": "http://file.hu60.cn/file/hash/jpg/000000000000cbb1d8a881638d9522f6333.jpg?attname=tiger.jpg",

  // 如果上传成功,可将其添加到编辑框中
  "contentUbb": "《图片:http://file.hu60.cn/file/hash/jpg/000000000000cbb1d8a881638d9522f6333.jpg?attname=tiger.jpg,tiger.jpg》"
}
  1. 若上述API给出"fileExists": false,按API给出的形式发起上传请求即可。若上传请求得到2xx响应,则上传成功,使用API给出的downloadUrl作为附件下载地址。注意:如果你上传的文件大小或MD5与请求API时提供的不符,上传会失败。

  2. 若API给出"fileExists": true,则无需再上传,直接使用downloadUrl作为附件下载地址。

API返回值类型参考

  1. 文件不存在,可上传
    https://hu60.cn/q.php/api.upload-form.json?name=tiger.jpg&size=333&md5=000000000000cbb1d8a881638d9522f6

  2. 未计算文件的md5值,随机生成文件名,总是可上传
    https://hu60.cn/q.php/api.upload-form.json?name=tiger.jpg&size=333

  3. 文件存在,无需上传
    https://hu60.cn/q.php/api.upload-form.json?name=test.png&size=2038619&md5=3293d6cd825b9d90b92b831224509d44

  4. 文件超过5GB,无法通过表单上传,得到虎绿林标准异常
    https://hu60.cn/q.php/api.upload-form.json?name=tiger.jpg&size=333333333333&md5=000000000000cbb1d8a881638d9522f6

  5. 忘记给出文件名,得到虎绿林标准异常
    https://hu60.cn/q.php/api.upload-form.json?size=2038619&md5=3293d6cd825b9d90b92b831224509d44

  6. 忘记给出文件大小,得到虎绿林标准异常
    https://hu60.cn/q.php/api.upload-form.json?name=tiger.png&md5=3293d6cd825b9d90b92b831224509d44

  7. MD5格式不正确,得到虎绿林标准异常
    https://hu60.cn/q.php/api.upload-form.json?name=tiger.png&size=2038619&md5=3293d6cd825b9d90b92b8312245


[隐藏样式|查看源码]


『回复列表(8|隐藏机器人聊天)』

1. @水木易安@胡椒舰长,API做好了,上传程序的参考实现也做好了
(/@Ta/2021-08-05 00:48//)

3.

@老虎会游泳效率真快
各大客户端安排
小米MIX2s(白)

(/@Ta/2021-08-05 11:00//)

4.
小米MIX2s(白)
(/@Ta/2021-08-05 11:15//)

6.
(/@Ta/2021-08-05 12:40//)

7.

@堂妹妹的,我觉得php不适合物联网开发

(/@Ta/2021-08-05 14:37//)

8. 支持支持
(/@Ta/2021-08-05 14:51//)

9. @堂妹妹的,物联网开发,最底层TCP/udp,目前来看我觉得是可以的
(/@Ta/2021-08-05 15:00//)

10. 这是我分装的 批量说上传到OSS的子组件,应该在父组件引入掉用


image.png


文件:

com-upload-image.nvue(8.79 KB)


## 实例

	<view class="comment_textarea" >
				<com-upload-image :name="uploadImage.fileFieldName" :url="uploadImage.url" :extraData="uploadImage.extraData" @onUploaded="onUploaded" :HookBeforeUpload="HookBeforeUpload"></com-upload-image>
			</view>


	HookBeforeUpload(Index,Imgs){
				return new Promise((resolve,reject)=>{
					let img=Imgs[Index];
					
					let fileName=img.local_path.substring(img.local_path.lastIndexOf("/")+1);
					if(fileName==null || fileName==""){
						fileName="img_"+Math.random().toString();
					}
					
					let reqUri=`api.upload-form.json?name=${fileName}&size=${img.fileSize}`;
					this.$req.accessPost(reqUri).then(res=>{
						//if file exist ,must not upload
						if(res.fileExists==true){
							//res.downloadUrl; the exist file url,
							reject(new Exception('文件已经存在云端,请勿重复上传!'));
						}
						//set upload address,token,filename. resolve this process,then exec upload
						this.uploadImage.url=res.requestUrl;
						this.uploadImage.extraData=res.formData
						this.uploadImage.fileFieldName=res.fileFieldName;
						resolve({});
					}).catch(err=>{
						//http请求生成token异常
						reject(err);
					});
				});
			},
(/@Ta/2021-09-14 17:10//)

回复需要登录

9月24日 06:11 星期三

本站由hu60wap6驱动

备案号: 京ICP备18041936号-1