react-natvie-fetch-blob使用

本文介绍了为何选择react-native-fetch-blob进行React Native的上传下载操作,强调了其强大的功能,如支持进度、文件接口及高性能。此外,文章还提及了其特性,包括直接存取数据、文件流支持等,并提供了安装和使用的指导。

react-natvie-fetch-blob

网上搜索了许多关于react-natvie-fetch-blob 的使用介绍,发现中文文档很少。实在没办法就直接去看github上门的文档了,做了一些笔记。

英语不怎好,如果写的有何错误之处敬请谅解、指导

https://github.com/aroth/react-native-uploader

我选择react-natvie-fetch-blob的原因

这里表述的是个人观点,不具备专业性和严谨性

  • React Native 上传下载的第三发也有挺多的,比如react-native-fileupload。对于简单的上传下载也很好用,但是功能上还是有一些局限性,比如上传进度
  • react-natvie-fetch-blob 功能很强大,支持进度,还有很多很细心的功能
  • react-natvie-fetch-blob 性能也很好,基本能胜任数据传输的所有功能
特性
  • 传输数据直接存取,而不需要base64做跨接
  • 文件接口支持一般文件,Asset 文件,相机胶卷文件
  • Native-to-native 文件操作接口,减少了JS桥接而导致的性能损耗
  • 文件流支持处理大文件
  • Blob, File, XMLHttpRequest polyfills that make browser-based library available in RN (experimental)
  • 支持JSON 流(Oboe.js)
相关

这个项目的起始出发点是为了解决这个问题 facebook/react-native#854

还是看原文吧:

This project was started in the cause of solving issue facebook/react-native#854, React Native's lacks of Blob implementation which results into problems when transferring binary data.

It is committed to making file access and transfer easier and more efficient for React Native developers. We've implemented highly customizable filesystem and network module which plays well together. For example, developers can upload and download data directly from/to storage, which is more efficient, especially for large files. The file system supports file stream, so you don't have to worry about OOM problem when accessing large files.

In 0.8.0 we introduced experimental Web API polyfills that make it possible to use browser-based libraries in React Native, such as, FireBase JS SDK`

安装
  1. 安装包,安装完您也可以直接跳到第5步按照wiki教材配置ios和Android环境

     npm install --save react-native-fetch-blob
    
  2. 或者如果你使用CocoaPods 把下面的加入到您的Podfile

     pod 'react-native-fetch-blob',
         :path => '../node_modules/react-native-fetch-blob'
    
  3. 自动链接Native Modules

     react-native link
    
  4. 使用下面的命令添加到Android AndroidManifest.xml 文件里

     RNFB_ANDROID_PERMISSIONS=true react-native link
    
  5. 如果你是非默认的项目结果,link脚本也许不生效。请参考the wiki手动链接包(也很简单的)

    看到这里小小的总结一下上面五步吧。要不你就1、3、4搞定,要不你就1、5搞定

  6. 对于Android 5.0或者更低版本的,授权许可外部扩展存储

    Android 6.0发布以来,授权许可机制与之前有了些许改变。有兴趣的同学可以参考Official Document,我是没兴趣的!

    如果介绍外部存储扩展 (say, SD card storage) for Android 5.0 (or lower) devices,你需要添加下面代码的到AndroidManifest.xml.

     <manifest xmlns:android="http://schemas.android.com/apk/res/android"
     package="com.rnfetchblobtest"
     android:versionCode="1"
     android:versionName="1.0">
    
     <uses-permission android:name="android.permission.INTERNET" />
     <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    
     // 添加下面的两句
     <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />                                               
     <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />                                              
    
     ...
    

    Also, if you're going to use Android Download Manager you have to add this to AndroidManifest.xml

     <intent-filter>
     	<action android:name="android.intent.action.MAIN" />
     	<category android:name="android.intent.category.LAUNCHER" />
    
     	// 添加这一句
     	<action android:name="android.intent.action.DOWNLOAD_COMPLETE"/>                          
     </intent-filter>	
    
  7. 对于Android 6.0及以上

    貌似不用干嘛呢

    原文:

    Beginning in Android 6.0 (API level 23), users grant permissions to apps while the app is running, not when they install the app. So adding permissions in AndroidManifest.xml won't work for Android 6.0+ devices. To grant permissions in runtime, you might use PermissionAndroid API.

使用
import RNFetchBlob from 'react-native-fetch-blob'	

转载于:https://my.oschina.net/KJhulinhua/blog/1014853

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值