• 首页 首页 icon
  • 工具库 工具库 icon
    • IP查询 IP查询 icon
  • 内容库 内容库 icon
    • 快讯库 快讯库 icon
    • 精品库 精品库 icon
    • 问答库 问答库 icon
  • 更多 更多 icon
    • 服务条款 服务条款 icon

COS SDK有Flutter和React Native版本啦

武飞扬头像
粤海科技君
帮助1

Flutter 和 React Native 是目前最流行的跨平台框架,经过了时间的考验,也有成熟的团队在SDK、文档、社区等方面进行支持。

相对于传统的原生开发,跨平台方案在开发测试成本、产品一致性等方面有一定的优势。但是有时候使用第三方库时只有原生库,没有对应的 Flutter 和 React Native 库,这时候往往需要自行桥接,桥接会有一定的开发成本。现在COS SDK 提供了 Flutter 和 React Native 的 SDK,用户按照官方文档直接接入即可。

Flutter SDK 集成和使用

第一步:准备工作

1. 您需要一个纯 Flutter 项目或 Flutter 原生混合项目,这个应用可以是您现有的工程,也可以是您新建的一个空的工程。

2. Flutter 版本要求:sdk: ">=2.12.0 <3.0.0" ‍flutter: ">=2.5.0"

第二步:集成 SDK

运行此命令:flutter pub add tencentcloud_cos_sdk_plugin

第三步:开始使用

1. 初始化密钥

实现一个 IFetchCredentials 的类,实现请求临时密钥并返回结果的过程。

class FetchCredentials implements IFetchCredentials{  @override  Future<SessionQCloudCredentials> fetchSessionCredentials() async {    // 首先从您的临时密钥服务器获取包含了密钥信息的响应,例如:    var httpClient = HttpClient();    try {      // 临时密钥服务器 url      var stsUrl = "http://stsservice.com/sts";      var request = await httpClient.getUrl(Uri.parse(stsUrl));      var response = await request.close();      if (response.statusCode == HttpStatus.OK) {        var json = await response.transform(utf8.decoder).join();        print(json);
        // 然后解析响应,获取临时密钥信息        var data = jsonDecode(json);        // 最后返回临时密钥信息对象        return SessionQCloudCredentials(            secretId: data['credentials']['tmpSecretId'],// 临时密钥 SecretId            secretKey: data['credentials']['tmpSecretKey'],// 临时密钥 SecretKey            token: data['credentials']['sessionToken'],// 临时密钥 Token            startTime: data['startTime'],//临时密钥有效起始时间,单位是秒            expiredTime: data['expiredTime']//临时密钥有效截止时间戳,单位是秒        );      } else {        throw ArgumentError();      }    } catch (exception) {      throw ArgumentError();    }  }}

这里假设类名为 FetchCredentials。初始化一个实例,来给 SDK 提供密钥。

Cos().initWithSessionCredential(FetchCredentials());

2. 注册 COS 服务

// 存储桶所在地域简称,例如广州地区是 ap-guangzhouString region = "COS_REGION";// 创建 CosXmlServiceConfig 对象,根据需要修改默认的配置参数CosXmlServiceConfig serviceConfig = CosXmlServiceConfig(    region: region,    isDebuggable: true,    isHttps: true,);// 注册默认 COS ServiceCos().registerDefaultService(serviceConfig);
// 创建 TransferConfig 对象,根据需要修改默认的配置参数// TransferConfig 可以设置智能分块阈值 默认对大于或等于2M的文件自动进行分块上传,可以通过如下代码修改分块阈值TransferConfig transferConfig = TransferConfig(    forceSimpleUpload: false,    enableVerification: true,    divisionForUpload: 2097152, // 设置大于等于 2M 的文件进行分块上传    sliceSizeForUpload: 1048576, //设置默认分块大小为 1M);// 注册默认 COS TransferMangerCos().registerDefaultTransferManger(serviceConfig, transferConfig);

第四步:访问 COS 服务

以下用上传对象来示例,其他下载、删除、桶操作等更多详细使用,请参考 Flutter COS SDK网址。 SDK 支持上传本地文件、二进制数据。下面以上传本地文件为例:

   // 获取 TransferManager    CosTransferManger transferManager = Cos().getDefaultTransferManger();    // 存储桶名称,由 bucketname-appid 组成,appid 必须填入,可以在 COS 控制台查看存储桶名称。https://console.cloud.tencent.com/cos5/bucket    String bucket = "examplebucket-1250000000";    String cosPath = "exampleobject"; //对象在存储桶中的位置标识符,即称对象键    String srcPath = "本地文件的绝对路径"; //本地文件的绝对路径    //开始上传    TransferTask transferTask = await transferManager.upload(bucket, cosPath,        filePath: srcPath    );

React Native SDK 集成和使用

第一步:准备工作

1. 您需要一个纯 React Native 项目或 React Native 原生混合项目,这个应用可以是您现有的工程,也可以是您新建的一个空的工程。

2. React Native 版本要求:0.69.7 及以上

第二步:集成 SDK

使用npm:    npm install --save react-native-cos-sdk

或者使用yarn:    yarn add react-native-cos-sdk

第三步:开始使用

1. 初始化密钥

调用 Cos 的 initWithSessionCredentialCallback 方法,实现请求临时密钥并返回结果的过程。

import Cos from 'react-native-cos-sdk';
Cos.initWithSessionCredentialCallback(async () => {  // 首先从您的临时密钥服务器获取包含了密钥信息的响应,例如:  // 临时密钥服务器 url  let stsUrl = "http://stsservice.com/sts";  const response = await fetch(stsUrl);  // 然后解析响应,获取临时密钥信息  const responseJson = await response.json();  const credentials = responseJson.credentials;  const startTime = responseJson.startTime;  const expiredTime = responseJson.expiredTime;  const sessionCredentials = {    tmpSecretId: credentials.tmpSecretId,    tmpSecretKey: credentials.tmpSecretKey,    startTime: startTime,    expiredTime: expiredTime,    sessionToken: credentials.sessionToken  };  console.log(sessionCredentials);  // 最后返回临时密钥信息对象  return sessionCredentials;})

2. 注册 COS 服务

// 存储桶所在地域简称,例如广州地区是 ap-guangzhoulet region = "COS_REGION";// 创建 CosXmlServiceConfig 对象,根据需要修改默认的配置参数let serviceConfig = {    region: region,    isDebuggable: true,    isHttps: true,};// 注册默认 COS Servicelet cosService = await Cos.registerDefaultService(serviceConfig);// 获取默认 COS Servicelet cosService1 = Cos.getDefaultService();
// 创建 TransferConfig 对象,根据需要修改默认的配置参数// TransferConfig 可以设置智能分块阈值 默认对大于或等于2M的文件自动进行分块上传,可以通过如下代码修改分块阈值let transferConfig = {    forceSimpleUpload: false,    enableVerification: true,    divisionForUpload: 2097152, // 设置大于等于 2M 的文件进行分块上传    sliceSizeForUpload: 1048576, //设置默认分块大小为 1M};// 注册默认 COS TransferMangerlet cosTransferManger = await Cos.registerDefaultTransferManger(serviceConfig, transferConfig);// 获取默认 COS TransferMangerlet cosTransferManger1 = Cos.getDefaultTransferManger();

第四步:访问 COS 服务

以下用上传对象来示例,其他下载、删除、桶操作等更多详细使用,请参考 React Native COS SDK网址

 // 获取 CosTransferManger    let cosTransferManger: CosTransferManger = Cos.getDefaultTransferManger();    //let cosTransferManger: CosTransferManger = Cos.getTransferManger(newRegion);    // 存储桶名称,由 bucketname-appid 组成,appid 必须填入,可以在 COS 控制台查看存储桶名称。https://console.cloud.tencent.com/cos5/bucket    let bucket = "examplebucket-1250000000";    let cosPath = "exampleobject"; //对象在存储桶中的位置标识符,即称对象键    let srcPath = "本地文件的路径"; //本地文件的路径    //开始上传    let transferTask:TransferTask = await cosTransferManger.upload(      bucket,      cosPath,      srcPath    );

这篇好文章是转载于:学新通技术网

  • 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
  • 本站站名: 学新通技术网
  • 本文地址: /boutique/detail/tanhfkgbai
系列文章
更多 icon
同类精品
更多 icon
继续加载