美文网首页
Flutter直传腾讯云

Flutter直传腾讯云

作者: 光军木木三 | 来源:发表于2021-08-22 11:53 被阅读0次

    前记:

        由于腾讯云此文章之时Flutter还未支持sdk上传相关功能;因此需要使用直传功能实现。

    实现思路:

        1、后台进行直传签名;

        2、Flutter通过接口获取服务端的签名信息;

        3、Flutter通过put请求上传文件到腾讯云服务器;

    具体步骤:腾讯云直传实践

        1、服务端首先使用固定密钥 SecretId、SecretKey 向 STS 服务获取临时密钥

        2、服务端通过 tmpSecretId、tmpSecretKey,以及 method、pathname 计算签名

        3、Flutter通过接口获取服务端的签名信息,主要是Signature 和 x-cos-security-token 字段

        4、Flutter使用PutObject方式上传到腾讯云,把获取到的Signature 和 x-cos-security-token分别放到发请求时 header 的 authorization 和 x-cos-security-token 字段里。

    前端代码如下:

    Map<String, String> headers = Map<String, String>();

    headers['Authorization'] = _cosSignEntity.sign;

    headers['x-cos-security-token'] = _cosSignEntity.sessionToken;

    List<int> body = await file.readAsBytes();

    String url = _cosSignEntity.baseUrl + "/" + file.name;

    HttpItem res = await HttpManager.uploadImage(url, headers, body);

    /// 上传图片

    static Future<HttpItem> uploadImage( String url, Map<String, String> headers, dynamic body) async {

    //创建一个HttpClient

    HttpClient httpClient = new HttpClient();

    //打开Http连接

    HttpClientRequest request = await httpClient.putUrl(Uri.parse(url));

    //设置请求头

    headers.keys.forEach((key) {

        dynamic value = headers[key];

        request.headers.add(key, value);

    });

    //设置请求内容

    request.add(body);

    //等待连接服务器(会将请求信息发送给服务器)

    HttpClientResponse response = await request.close();

    //读取响应内容

    HttpItem item = HttpItem();

    //成功获取数据

    if (response.statusCode == 200) {

        item.data = url;

        item.code = response.statusCode;

        item.message = response.reasonPhrase;

    } else {

        item.data = null;

        item.code = response.statusCode;

        item.message = response.reasonPhrase;

    }

    //关闭client后,通过该client发起的所有请求都会中止。

    httpClient.close();

    return item;

    }


    后记:

        为什么不使用dio实现上传请求,因为dio对请求参数会进行相应的转码处理,实践发现使用dio框架上传会让图片损坏无法使用。

       以下是dio部分源码,可以发现数据会被转换了,如果一定要使用dio可以重写dio的transformer模块自己判断处理参数转换。

     希望对你们有帮助,文章为个人的自我见解,如有错误,欢迎指教!

    相关文章

      网友评论

          本文标题:Flutter直传腾讯云

          本文链接:https://www.haomeiwen.com/subject/ardtiltx.html