|
|
|
|
1
|
-# react-native-fetch-blob [![release](https://img.shields.io/github/release/wkh237/react-native-fetch-blob.svg?maxAge=86400&style=flat-square)](https://www.npmjs.com/package/react-native-fetch-blob) [![npm](https://img.shields.io/npm/v/react-native-fetch-blob.svg?style=flat-square)](https://www.npmjs.com/package/react-native-fetch-blob) ![](https://img.shields.io/badge/PR-Welcome-brightgreen.svg?style=flat-square) [![npm](https://img.shields.io/npm/l/express.svg?maxAge=2592000&style=flat-square)]()
|
|
|
|
|
1
|
+# react-native-fetch-blob [![release](https://img.shields.io/github/release/wkh237/react-native-fetch-blob.svg?maxAge=86400&style=flat-square)](https://www.npmjs.com/package/react-native-fetch-blob) [![npm](https://img.shields.io/npm/v/react-native-fetch-blob.svg?style=flat-square)](https://www.npmjs.com/package/react-native-fetch-blob) ![](https://img.shields.io/badge/PR-Welcome-brightgreen.svg?style=flat-square) [![npm](https://img.shields.io/npm/l/react-native-fetch-blob.svg?maxAge=2592000&style=flat-square)]() ![](https://img.shields.io/badge/inpPogress-0.8.0-yellow.svg?style=flat-square)
|
2
|
|
2
|
|
3
|
A project committed to make file acess and transfer easier and effiecient for React Native developers.
|
3
|
A project committed to make file acess and transfer easier and effiecient for React Native developers.
|
4
|
|
4
|
|
5
|
-## [Please check our github for updated document](https://github.com/wkh237/react-native-fetch-blob)
|
|
|
|
|
5
|
+# [Please visit out Github page for latest document](https://github.com/wkh237/react-native-fetch-blob)
|
6
|
|
6
|
|
7
|
## TOC
|
7
|
## TOC
|
8
|
* [About](#user-content-about)
|
8
|
* [About](#user-content-about)
|
9
|
-* [Backward Compatible](#user-content-backward-compatible)
|
|
|
10
|
* [Installation](#user-content-installation)
|
9
|
* [Installation](#user-content-installation)
|
11
|
* [Recipes](#user-content-recipes)
|
10
|
* [Recipes](#user-content-recipes)
|
12
|
* [Download file](#user-content-download-example--fetch-files-that-needs-authorization-token)
|
11
|
* [Download file](#user-content-download-example--fetch-files-that-needs-authorization-token)
|
|
|
|
|
25
|
|
24
|
|
26
|
## About
|
25
|
## About
|
27
|
|
26
|
|
28
|
-React Native does not support `Blob` object at this moment, which means if you're going to send/receive binary data via `fetch` API, that might not work as you expect. See [facebook/react-native#854](https://github.com/facebook/react-native/issues/854).
|
|
|
|
|
27
|
+This project was initially for solving the issue [facebook/react-native#854](https://github.com/facebook/react-native/issues/854), because React Native does not support `Blob` object and it will cause some problem when sending and receiving binary data. There's aleady [a PR ](https://github.com/facebook/react-native/pull/8324) merged into RN master branch which will probably solving the issue in the near future.
|
29
|
|
28
|
|
30
|
-For some use cases, you might get into trouble. For example, displaying an image that requires a specific field in headers (ex. "Authorization : Bearer ...") or body, so you can't just pass the image uri to `Image` component because that will probably returns a 401 response. Or you're going to upload binary data which generated from JS, the server will get an empry body due to [this issue](https://github.com/facebook/react-native/issues/854). With help of APIs provided by this module, you can send HTTP request with any headers, and decide how to handle the response/reqeust data without worry about if it is not supported by `fetch` API. The response data can be just simply converted into BASE64 string, or stored to a file directly so that you can read it by using file access APIs such as readFile, readStream.
|
|
|
31
|
-
|
|
|
32
|
-This module was designed to be a substitution of `Blob`, there's a set of APIs including basic file system CRUD method, and file stream reader/writer. Also it has a special `fetch` implementation that supports binary request/response body.
|
|
|
33
|
-
|
|
|
34
|
-## Backward Compatible
|
|
|
35
|
-
|
|
|
36
|
-All updates are `backward-compatible` generally you don't have to change existing code unless you're going to use new APIs. But we recommend pre `0.5.0` users consider upgrade the package to latest version, since we have introduced new APIs can either `upload` or `download` files simply using a file path. It's much more memory efficent in some use case. We've also introduced `fs` APIs for access files, and `file stream` API that helps you read/write files (especially for **large ones**), see [Examples](#user-content-recipes) bellow. This module implements native methods, supports both Android (uses same native library as offical RN fetch API [OkHttp](https://github.com/square/okhttp)) and IOS.
|
|
|
|
|
29
|
+Now, this project is committed to make file acess and transfer more easier and more effiecient for React Native developers. We've implemented lot of file access function which plays well with our network module. For example, it can upload and download data directly into/from file system, which is much more performant (especially for large ones) than converting data to BASE64 passing them around through React JS Bridge, also, file stream support so that you can read large file not causing OOM error.
|
37
|
|
30
|
|
38
|
## Installation
|
31
|
## Installation
|
39
|
|
32
|
|
|
|
|
|
49
|
rnpm link
|
42
|
rnpm link
|
50
|
```
|
43
|
```
|
51
|
|
44
|
|
|
|
45
|
+### version 0.7.0+ does not work with react-native 0.27 (Android)
|
|
|
46
|
+
|
|
|
47
|
+On 0.7.5, we have fixed Android OkHttp dependency issue on pre 0.28 projects excepted 0.27, 0.29.0, and 0.29.1. For 0.29.0 and 0.29.1 it's because `rnpm link` is broken in these versions, you may need to manually link Android package. It is recommended to upgrade you project if possible
|
|
|
48
|
+
|
|
|
49
|
+```
|
|
|
50
|
+$ react-native upgrade
|
|
|
51
|
+```
|
|
|
52
|
+
|
|
|
53
|
+After the project upgraded, run `rnpm link` again.
|
|
|
54
|
+
|
|
|
55
|
+
|
52
|
### Manually link the package (Android)
|
56
|
### Manually link the package (Android)
|
53
|
|
57
|
|
54
|
If rnpm link command failed to link the package automatically, you might try manually link the package.
|
58
|
If rnpm link command failed to link the package automatically, you might try manually link the package.
|
|
|
|
|
618
|
|
622
|
|
619
|
| Version | |
|
623
|
| Version | |
|
620
|
|---|---|
|
624
|
|---|---|
|
|
|
625
|
+| 0.7.5 | Fix installation script that make it compatible to react-native < 0.28 |
|
621
|
| 0.7.4 | Fix app crash problem in version > 0.27 |
|
626
|
| 0.7.4 | Fix app crash problem in version > 0.27 |
|
622
|
| 0.7.3 | Fix OkHttp dependency issue in version < 0.29 |
|
627
|
| 0.7.3 | Fix OkHttp dependency issue in version < 0.29 |
|
623
|
| 0.7.2 | Fix cancel request bug |
|
628
|
| 0.7.2 | Fix cancel request bug |
|