diff --git a/README.md b/README.md index 47bfff67b6a66d202314466f9ebbb17253847c54..caf4dc7cd085d2288d34b13e452d6e8b4e27e35e 100644 --- a/README.md +++ b/README.md @@ -1,111 +1,112 @@ # commons-fileupload -## 简介 +## Introduction -commons-fileupload 是一个请求库。可以用来做文件上传（支持分片）、基本请求、文件下载。目前支持的功能，如下： -| 功能 | 描述 | 备注 | -| :--------------: | :----------------------------: | :--: | -| 基础请求 | 支持 get、post、head... | -| 文件上传 | 支持分片上传、断点续传、多文件上传 | -| 文件下载 | 未支持（后续支持） | 目前 oh 未支持 expectDataType，文件下载功能暂不支持。如果需要下载功能，建议使用 oh 原生的 request 模块 +commons-fileupload is a library used to implement file upload (including multipart upload), basic requests, and file download. Currently, the following functionalities are supported. +| Functionality | Description | Remarks| +| :------: | :--------------------------------: | :--: | +| Basic requests| Supports basic operations, such as **get**, **post**, and **head**. | N/A | +| File upload| Supports multipart upload, resumable upload, and multi-file upload.| N/A | +| File download| To be supported soon.| Currently, the system does not support **expectDataType**. Therefore, file download is not supported. To download files, use the native **request** module of OpenHarmony. | -## 下载安装 +## How to Install ```shell ohpm install @ohos/commons-fileupload ``` OpenHarmony -ohpm 环境配置等更多内容，请参考 [如何安装OpenHarmony ohpm包](https://gitee.com/openharmony-tpc/docs/blob/master/OpenHarmony_har_usage.md) 。 -## 使用说明 - -### 文件上传 - -1.配置网络权限（在 entry\src\main\module.json5 文件中） - -``` -{ - "module":{ - ..., - "requestPermissions": [ - { - "name": "ohos.permission.INTERNET" - }, - ] - } -} -``` - -2.在页面中的使用 - -``` -import { FormData, File, FileUpload } from "@ohos/commons_fileupload" - - -aboutToAppear() { - this.fileUpload = new FileUpload({ - baseUrl: "https://musetransfer.com/", - readTimeout: 60000, - connectTimeout: 60000 - }) -} - - -const formData = new FormData(); -formData.append("key", 1);//可以添加基本类型的值，目前支持string、number -formData.append("myFile", File); //也可以添加File类型的对象 - - -this.fileUpload.post("/api/upload", formData).then(res => { - console.log("success"); -}).catch(err => { - console.error("fail"); -}) -``` - -## 属性（接口）说明 - -### FileUpload 构造函数参数 - -| 接口 | 参数类型 | 释义 | 是否必填 | 默认值 | +For details about the OpenHarmony ohpm environment configuration, see [OpenHarmony HAR](https://gitee.com/openharmony-tpc/docs/blob/master/OpenHarmony_har_usage.en.md). + +## How to Use + +### File Upload + +1. Declare the required network permission in the **entry\src\main\module.json5** file. + + ``` + { + "module":{ + ..., + "requestPermissions": [ + { + "name": "ohos.permission.INTERNET" + }, + ] + } + } + ``` + +2. Implement file upload. + + ``` + import { FormData, File, FileUpload } from "@ohos/commons_fileupload" + + + aboutToAppear() { + this.fileUpload = new FileUpload({ + baseUrl: "https://musetransfer.com/", + readTimeout: 60000, + connectTimeout: 60000 + }) + } + + + const formData = new FormData(); + formData.append("key", 1); // Value of basic types can be added. Currently, strings and numbers are supported. + formData.append("myFile", File); // You can also add an object of the File type. + + + this.fileUpload.post("/api/upload", formData).then(res => { + console.log("success"); + }).catch(err => { + console.error("fail"); + }) + ``` + +## Available APIs + +### FileUpload Constructor + +| Parameter | Type| Description | Mandatory| Default Value | | :------------: | :------: | :----------: | :------: | ------- | -| baseUrl | string | 请求基地址 | 否 | 空 | -| connectTimeout | number | 连接超时时间 | 否 | 60000ms | -| readTimeout | number | 读取超时时间 | 否 | 60000ms | - -### FileUpload 实例方法 - -| 方法 | 类型 | 释义 | -| :-----: | :-----------------------------------------------------------------: | :--------------: | -| post | ( configOrUrl : MyHttpRequestOptions ) : Promise | post 请求方法 | -| get | ( configOrUrl : MyHttpRequestOptions ) : Promise | get 请求方法 | -| head | ( configOrUrl : MyHttpRequestOptions ) : Promise | head 请求方法 | -| options | ( configOrUrl : MyHttpRequestOptions ) : Promise | options 请求方法 | -| put | ( configOrUrl : MyHttpRequestOptions ) : Promise | put 请求方法 | -| delete | ( configOrUrl : MyHttpRequestOptions ) : Promise | delete 请求方法 | -| trace | ( configOrUrl : MyHttpRequestOptions ) : Promise | trace 请求方法 | +| baseUrl | string | Base address of the request. | No | Null | +| connectTimeout | number | Connection timeout duration.| No | 60000 ms| +| readTimeout | number | Read timeout duration.| No | 60000 ms| + +### FileUpload APIs + +| API | Type | Description | +| :-----: | :----------------------------------------------------------: | :--------------: | +| post | ( configOrUrl : MyHttpRequestOptions ) : Promise | **post()** method. | +| get | ( configOrUrl : MyHttpRequestOptions ) : Promise | **get()** method. | +| head | ( configOrUrl : MyHttpRequestOptions ) : Promise | **head()** method. | +| options | ( configOrUrl : MyHttpRequestOptions ) : Promise | **options()** method.| +| put | ( configOrUrl : MyHttpRequestOptions ) : Promise | **put()** method. | +| delete | ( configOrUrl : MyHttpRequestOptions ) : Promise | **delete()** method. | +| trace | ( configOrUrl : MyHttpRequestOptions ) : Promise | **trace()** method. | ### MyHttpRequestOptions -| 接口 | 参数类型 | 释义 | 是否必填 | 默认值 | +| Parameter | Type | Description | Mandatory| Default Value | | :------------: | :-----------------------------------------: | :----------: | :------: | ------- | -| url | string | 接口名字 | 是 | | -| extraData | string \| Object \| ArrayBuffer \| FormData | 请求参数 | 否 | 空 | -| header | Object | 请求头 | 否 | 空 | -| connectTimeout | number | 连接超时时间 | 否 | 60000ms | -| readTimeout | number | 读取超时时间 | 否 | 60000ms | +| url | string | URL. | Yes | Null | +| extraData | string \| Object \| ArrayBuffer \| FormData | Request parameter. | No | Null | +| header | Object | Request header. | No | Null | +| connectTimeout | number | Connection timeout duration.| No | 60000 ms| +| readTimeout | number | Read timeout duration.| No | 60000 ms| -## 约束与限制 +## Constraints -- DevEco Studio: NEXT Beta1-5.0.3.806, SDK:API12 Release(5.0.0.66) -- DevEco Studio 版本： 4.1 Canary(4.1.3.317),OpenHarmony SDK:API11 (4.1.0.36)。 +- DevEco Studio: NEXT Beta1-5.0.3.806, SDK: API 12 Release (5.0.0.66) +- DevEco Studio: 4.1 Canary (4.1.3.317), OpenHarmony SDK: API 11 (4.1.0.36) -## 目录结构 +## Directory Structure ```` |---- ohos_commons-fileupload -| |---- entry # 示例代码文件夹 -| |---- library # commons-fileupload库文件夹 +| |---- entry # Sample code +| |---- library # commons-fileupload library code | |---- src | |---- main | |---- ets @@ -115,15 +116,14 @@ this.fileUpload.post("/api/upload", formData).then(res => { | |---- utils | |---- index.ts | |---- js -| |---- Index.ets # 对外接口 -| |---- README.md # 安装使用方法 +| |---- Index.ets # APIs exposed externally +| |---- README.md # Readme ```` -## 贡献代码 +## How to Contribute -使用过程中发现任何问题都可以提 [Issue](https://gitee.com/openharmony-sig/commons-fileupload/issues) -给我们，当然，我们也非常欢迎你给我们发 [PR](https://gitee.com/openharmony-sig/commons-fileupload/pulls) 。 +If you find any problem when using the project, submit an [issue](https://gitee.com/openharmony-sig/commons-fileupload/issues) or a [PR](https://gitee.com/openharmony-sig/commons-fileupload/pulls). -## 开源协议 +## License -本项目基于 [Apache License 2.0](https://gitee.com/openharmony-sig/commons-fileupload/blob/master/LICENSE) ，请自由地享受和参与开源。 + This project is licensed under the terms of [Apache License 2.0](https://gitee.com/openharmony-sig/commons-fileupload/blob/master/LICENSE). diff --git a/README-en.md b/README_zh.md similarity index 40% rename from README-en.md rename to README_zh.md index 156b3d158f8eb44a84f9d2443654869f9ec8aecc..e794f0b6ae955dfcac0ee382ed2bc6a6d7116f50 100644 --- a/README-en.md +++ b/README_zh.md @@ -1,27 +1,28 @@ # commons-fileupload -## Introduction +## 简介 -commons-fileupload is a library used to implement file upload (including multipart upload), basic requests, and file download. Currently, the following functionalities are supported. -| Functionality| Description| Remarks| -| -------------- | ---------------------------- | -- | -| Basic requests| Supports basic operations, such as **get**, **post**, and **head**.| -| File upload| Supports multipart upload, resumable upload, and multi-file upload.| -| File download| To be supported soon.| Currently, the system does not support **expectDataType**. Therefore, file download is not supported. To download files, use the native **request** module of OpenHarmony.| +commons-fileupload 是一个请求库。可以用来做文件上传（支持分片）、基本请求、文件下载。目前支持的功能，如下： +| 功能 | 描述 | 备注 | +| :--------------: | :----------------------------: | :--: | +| 基础请求 | 支持 get、post、head... | +| 文件上传 | 支持分片上传、断点续传、多文件上传 | +| 文件下载 | 未支持（后续支持） | 目前 oh 未支持 expectDataType，文件下载功能暂不支持。如果需要下载功能，建议使用 oh 原生的 request 模块 -## How to Install +## 下载安装 ```shell ohpm install @ohos/commons-fileupload ``` -For details about the ohpm environment configuration, see [Installing the OpenHarmony HAR](https://gitee.com/openharmony-tpc/docs/blob/master/OpenHarmony_har_usage.md). +OpenHarmony +ohpm 环境配置等更多内容，请参考 [如何安装OpenHarmony ohpm包](https://gitee.com/openharmony-tpc/docs/blob/master/OpenHarmony_har_usage.md) 。 -## Usage +## 使用说明 -### File Upload +### 文件上传 -1. Declare the required network permission in the **entry\src\main\module.json5** file. +1.配置网络权限（在 entry\src\main\module.json5 文件中） ``` { @@ -36,12 +37,12 @@ For details about the ohpm environment configuration, see [Installing the OpenHa } ``` -2. Implement file upload. +2.在页面中的使用 ``` import { FormData, File, FileUpload } from "@ohos/commons_fileupload" - + aboutToAppear() { this.fileUpload = new FileUpload({ baseUrl: "https://musetransfer.com/", @@ -50,12 +51,12 @@ aboutToAppear() { }) } - + const formData = new FormData(); -formData.append("key", 1);// Value of basic types can be added. Currently, strings and numbers are supported. -formData.append("myFile", File); // You can also add an object of the File type. +formData.append("key", 1);//可以添加基本类型的值，目前支持string、number +formData.append("myFile", File); //也可以添加File类型的对象 - + this.fileUpload.post("/api/upload", formData).then(res => { console.log("success"); }).catch(err => { @@ -63,47 +64,48 @@ this.fileUpload.post("/api/upload", formData).then(res => { }) ``` -## Attributes and Interfaces +## 属性（接口）说明 -### FileUpload Constructor +### FileUpload 构造函数参数 -| Interface | Type| Description | Mandatory| Default Value | +| 接口 | 参数类型 | 释义 | 是否必填 | 默认值 | | :------------: | :------: | :----------: | :------: | ------- | -| baseUrl | string | Base address of the request. | No | Empty | -| connectTimeout | number | Connection timeout duration.| No | 60000 ms | -| readTimeout | number | Read timeout duration.| No | 60000 ms | +| baseUrl | string | 请求基地址 | 否 | 空 | +| connectTimeout | number | 连接超时时间 | 否 | 60000ms | +| readTimeout | number | 读取超时时间 | 否 | 60000ms | -### FileUpload APIs +### FileUpload 实例方法 -| API | Type | Description | +| 方法 | 类型 | 释义 | | :-----: | :-----------------------------------------------------------------: | :--------------: | -| post | ( configOrUrl : MyHttpRequestOptions ) : Promise | **post()** method. | -| get | ( configOrUrl : MyHttpRequestOptions ) : Promise | **get()** method. | -| head | ( configOrUrl : MyHttpRequestOptions ) : Promise | head() method. | -| options | ( configOrUrl : MyHttpRequestOptions ) : Promise | **options()** method.| -| put | ( configOrUrl : MyHttpRequestOptions ) : Promise | **put()** method. | -| delete | ( configOrUrl : MyHttpRequestOptions ) : Promise | **delete()** method. | -| trace | ( configOrUrl : MyHttpRequestOptions ) : Promise | **trace()** method. | +| post | ( configOrUrl : MyHttpRequestOptions ) : Promise | post 请求方法 | +| get | ( configOrUrl : MyHttpRequestOptions ) : Promise | get 请求方法 | +| head | ( configOrUrl : MyHttpRequestOptions ) : Promise | head 请求方法 | +| options | ( configOrUrl : MyHttpRequestOptions ) : Promise | options 请求方法 | +| put | ( configOrUrl : MyHttpRequestOptions ) : Promise | put 请求方法 | +| delete | ( configOrUrl : MyHttpRequestOptions ) : Promise | delete 请求方法 | +| trace | ( configOrUrl : MyHttpRequestOptions ) : Promise | trace 请求方法 | ### MyHttpRequestOptions -| Interface | Type | Description | Mandatory| Default Value | +| 接口 | 参数类型 | 释义 | 是否必填 | 默认值 | | :------------: | :-----------------------------------------: | :----------: | :------: | ------- | -| url | string | URL. | Yes | | -| extraData | string \| Object \| ArrayBuffer \| FormData | Request parameter. | No | Empty | -| header | Object | Request header. | No | Empty | -| connectTimeout | number | Connection timeout duration.| No | 60000 ms | -| readTimeout | number | Read timeout duration.| No | 60000 ms | +| url | string | 接口名字 | 是 | | +| extraData | string \| Object \| ArrayBuffer \| FormData | 请求参数 | 否 | 空 | +| header | Object | 请求头 | 否 | 空 | +| connectTimeout | number | 连接超时时间 | 否 | 60000ms | +| readTimeout | number | 读取超时时间 | 否 | 60000ms | -## Constraints +## 约束与限制 - DevEco Studio: NEXT Beta1-5.0.3.806, SDK:API12 Release(5.0.0.66) +- DevEco Studio 版本： 4.1 Canary(4.1.3.317),OpenHarmony SDK:API11 (4.1.0.36)。 -## Directory Structure +## 目录结构 ```` |---- ohos_commons-fileupload -| |---- entry # Sample code -| |---- library # commons-fileupload library code +| |---- entry # 示例代码文件夹 +| |---- library # commons-fileupload库文件夹 | |---- src | |---- main | |---- ets @@ -113,14 +115,15 @@ this.fileUpload.post("/api/upload", formData).then(res => { | |---- utils | |---- index.ts | |---- js -| |---- Index.ets # APIs exposed externally -| |---- README.md # File that describes commons-fileupload and how to use it. +| |---- Index.ets # 对外接口 +| |---- README_zh.md # 安装使用方法 ```` -## How to Contribute +## 贡献代码 -If you find any problem during the use, submit an [Issue](https://gitee.com/openharmony-sig/commons-fileupload/issues) or a [PR](https://gitee.com/openharmony-sig/commons-fileupload/pulls) to us. +使用过程中发现任何问题都可以提 [Issue](https://gitee.com/openharmony-sig/commons-fileupload/issues) +给组件，当然，也非常欢迎发 [PR](https://gitee.com/openharmony-sig/commons-fileupload/pulls) 共建。 -## License +## 开源协议 -The commons-fileupload library is licensed under the terms of [Apache License 2.0](https://gitee.com/openharmony-sig/commons-fileupload/blob/master/LICENSE). +本项目基于 [Apache License 2.0](https://gitee.com/openharmony-sig/commons-fileupload/blob/master/LICENSE) ，请自由地享受和参与开源。 diff --git a/entry/src/main/ets/pages/UploadFile.ets b/entry/src/main/ets/pages/UploadFile.ets index 8c23accd9a0d45ecaeff27fbc6f0fdc64ed7db27..c679d775e8b4f4b277e121a97170855494e3e23b 100644 --- a/entry/src/main/ets/pages/UploadFile.ets +++ b/entry/src/main/ets/pages/UploadFile.ets @@ -18,7 +18,7 @@ import * as EntryAbility from '../entryability/EntryAbility' @Entry @Component struct UploadFile { - @State message: string = '文件上传' + @State message: Resource = $r('app.string.File_upload') @State loadedFileResult: string = ""; fileInfo: Array = []; fileUpload: FileUpload|ESObject @@ -36,19 +36,19 @@ struct UploadFile { Column() { Column() { - Text("第一步：加载文件").fontSize(20).margin({ bottom: 20 }) + Text($r('app.string.Step1')).fontSize(20).margin({ bottom: 20 }) Row({ space: 10 }) { Button("icon.png").onClick(() => this.loadFileByResource("icon.png")) Button("test.txt").onClick(() => this.loadFileByResource("test.txt")) }.padding({ left: 10 }) - Text("已加载文件信息:" + this.loadedFileResult).fontSize(20).margin({ top: 10 }).padding({ left: 10 }) + Text(this.getResourceString($r('app.string.info')) + this.loadedFileResult).fontSize(20).margin({ top: 10 }).padding({ left: 10 }) }.alignItems(HorizontalAlign.Start).width("100%").height('70%') Column() { - Text("第二步：上传文件").fontSize(20).margin({ bottom: 20 }) - Button("点击上传").onClick(() => this.upload()) + Text($r('app.string.Step2')).fontSize(20).margin({ bottom: 20 }) + Button($r('app.string.upload')).onClick(() => this.upload()) }.alignItems(HorizontalAlign.Start).width("100%") } .width('100%') @@ -58,6 +58,10 @@ struct UploadFile { } + getResourceString(res:Resource){ + return getContext().resourceManager.getStringSync(res.id) + } + /** * 通过资源加载文件 * @param fileName @@ -66,7 +70,7 @@ struct UploadFile { EntryAbility.resourceManager.getRawFile(fileName, (error:ESObject, value:ESObject) => { if (error != null) { logError(error); - this.loadedFileResult = "加载文件失败..." + this.loadedFileResult = this.getResourceString($r('app.string.failed')) return; } const file:ESObject = new File(); diff --git a/entry/src/main/ets/pages/index.ets b/entry/src/main/ets/pages/index.ets index f8e7f2fffef8baa2ca881684995a645bc08da990..26bb4adcc23e756a95cd25247021987ea0e8af4e 100644 --- a/entry/src/main/ets/pages/index.ets +++ b/entry/src/main/ets/pages/index.ets @@ -14,15 +14,15 @@ */ import Router from "@ohos.router"; class demo { - text:string = '' - path:string = '' + text: string = '' + path: string= '' } @Entry @Component struct Index { private menus:demo[]= [ { - text:"文件上传Demo演示", + text: this.getResourceString($r('app.string.File_upload_demo')), path:"pages/UploadFile" } ] @@ -31,6 +31,10 @@ struct Index { Text(text).fontSize(30).onClick(() => this.handleClick(path)) } + getResourceString(res:Resource){ + return getContext().resourceManager.getStringSync(res.id); + } + build() { Column({space:30}){ ForEach(this.menus,(v:ESObject) => { diff --git a/entry/src/main/resources/base/element/string.json b/entry/src/main/resources/base/element/string.json index 352b30a0c14378123ef66ad8d0fc2867c5beb400..b32e884f371069d967056e2f9021468ba7db9fee 100644 --- a/entry/src/main/resources/base/element/string.json +++ b/entry/src/main/resources/base/element/string.json @@ -15,6 +15,34 @@ { "name": "reason", "value": "三方库权限依赖" + }, + { + "name": "File_upload_demo", + "value": "文件上传Demo演示" + }, + { + "name": "File_upload", + "value": "文件上传" + }, + { + "name": "Step1", + "value": "第一步：加载文件" + }, + { + "name": "info", + "value": "已加载文件信息:" + }, + { + "name": "Step2", + "value": "第二步：上传文件" + }, + { + "name": "upload", + "value": "点击上传" + }, + { + "name": "failed", + "value": "加载文件失败..." } ] } \ No newline at end of file diff --git a/entry/src/main/resources/en_US/element/string.json b/entry/src/main/resources/en_US/element/string.json new file mode 100644 index 0000000000000000000000000000000000000000..b6e202077fdea6ab84720335f013be30d7c5c926 --- /dev/null +++ b/entry/src/main/resources/en_US/element/string.json @@ -0,0 +1,48 @@ +{ + "string": [ + { + "name": "entry_desc", + "value": "description" + }, + { + "name": "MainAbility_desc", + "value": "description" + }, + { + "name": "MainAbility_label", + "value": "commons-fileupload" + }, + { + "name": "reason", + "value": "Third party library permission dependency" + }, + { + "name": "File_upload_demo", + "value": "File upload demo" + }, + { + "name": "File_upload", + "value": "File upload" + }, + { + "name": "Step1", + "value": "Step 1: Load the file" + }, + { + "name": "info", + "value": "File information loaded:" + }, + { + "name": "Step2", + "value": "Step 2: Upload the file" + }, + { + "name": "upload", + "value": "Click to upload" + }, + { + "name": "failed", + "value": "Failed to load file" + } + ] +} \ No newline at end of file