Ben Hsieh пре 8 година
родитељ
комит
7a9f1392e7
4 измењених фајлова са 77 додато и 94 уклоњено
  1. 1
    1
      package.json
  2. 73
    90
      src/README.md
  3. 1
    1
      src/package.json
  4. 2
    2
      src/react-native-fetch-blob.podspec

+ 1
- 1
package.json Прегледај датотеку

@@ -1,6 +1,6 @@
1 1
 {
2 2
   "name": "fetchblob-dev",
3
-  "version": "0.9.5-beta.2",
3
+  "version": "0.9.5",
4 4
   "private": true,
5 5
   "scripts": {
6 6
     "start": "node node_modules/react-native/local-cli/cli.js start",

+ 73
- 90
src/README.md Прегледај датотеку

@@ -1,8 +1,8 @@
1
-# react-native-fetch-blob [![release](https://img.shields.io/github/release/wkh237/react-native-fetch-blob.svg?style=flat-square)](https://github.com/wkh237/react-native-fetch-blob/releases) [![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)]()
1
+# react-native-fetch-blob
2
+[![release](https://img.shields.io/github/release/wkh237/react-native-fetch-blob.svg?style=flat-square)](https://github.com/wkh237/react-native-fetch-blob/releases) [![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) [![](https://img.shields.io/badge/Wiki-Public-brightgreen.svg?style=flat-square)](https://github.com/wkh237/react-native-fetch-blob/wiki) [![npm](https://img.shields.io/npm/l/react-native-fetch-blob.svg?maxAge=2592000&style=flat-square)]()
2 3
 
3
-# [Visit our Github for latest document](https://github.com/wkh237/react-native-fetch-blob)
4 4
 
5
-A project committed to make file acess and data transfer easier, effiecient for React Native developers.
5
+A project committed to make file acess and data transfer easier, efficient for React Native developers.
6 6
 
7 7
 ## Features
8 8
 - Transfer data directly from/to storage without BASE64 bridging
@@ -11,6 +11,7 @@ A project committed to make file acess and data transfer easier, effiecient for
11 11
 - File stream support for dealing with large file
12 12
 - Blob, File, XMLHttpRequest polyfills that make browser-based library available in RN (experimental)
13 13
 
14
+> The npm package is inside `src` folder, if you're going to install via git repository do not directly poiint to this folder
14 15
 
15 16
 ## TOC
16 17
 * [About](#user-content-about)
@@ -24,6 +25,7 @@ A project committed to make file acess and data transfer easier, effiecient for
24 25
  * [Cancel HTTP request](#user-content-cancel-request)
25 26
  * [Android Media Scanner, and Download Manager Support](#user-content-android-media-scanner-and-download-manager-support)
26 27
  * [Self-Signed SSL Server](#user-content-self-signed-ssl-server)
28
+ * [Transfer Encoding](#user-content-transfer-encoding)
27 29
  * [RNFetchBlob as Fetch](#user-content-rnfetchblob-as-fetch)
28 30
 * [File System](#user-content-file-system)
29 31
  * [File access](#user-content-file-access)
@@ -37,9 +39,9 @@ A project committed to make file acess and data transfer easier, effiecient for
37 39
 
38 40
 ## About
39 41
 
40
-This project was initially for solving the issue [facebook/react-native#854](https://github.com/facebook/react-native/issues/854), because React Native lack of `Blob` implementation and it will cause some problem when transfering binary data. Now, this project is committed to make file access and transfer more easier, effiecient for React Native developers. We've implemented highly customizable filesystem and network module which plays well together. For example, upload and download data directly from/to storage which is much more efficient in some cases(especially for large ones). The file system supports file stream, so you don't have to worry about OOM problem when accessing large files.
42
+This project was initially for solving the issue [facebook/react-native#854](https://github.com/facebook/react-native/issues/854), because React Native lack of `Blob` implementation and it will cause some problem when transferring binary data. Now, this project is committed to make file access and transfer more easier, efficient for React Native developers. We've implemented highly customizable filesystem and network module which plays well together. For example, upload and download data directly from/to storage which is much more efficient in some cases(especially for large ones). The file system supports file stream, so you don't have to worry about OOM problem when accessing large files.
41 43
 
42
-In `0.8.0` we introduced experimential Web API polyfills that make it possible to use browser-based libraries in React Native, for example, [FireBase JS SDK](https://github.com/wkh237/rn-firebase-storage-upload-sample)
44
+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](https://github.com/wkh237/rn-firebase-storage-upload-sample)
43 45
 
44 46
 
45 47
 ## Installation
@@ -50,40 +52,40 @@ Install package from npm
50 52
 npm install --save react-native-fetch-blob
51 53
 ```
52 54
 
53
-Link package using [rnpm](https://github.com/rnpm/rnpm)
55
+Or if using CocoaPods, add the pod to your `Podfile`, for example:
54 56
 
55
-```sh
56
-rnpm link
57
+```
58
+pod 'react-native-fetch-blob,
59
+    :path => '../node_modules/react-native-fetch-blob
57 60
 ```
58 61
 
59
-### Manually link the package (Android)
62
+**Automatically Link Native Modules**
60 63
 
61
-If rnpm link command failed to link the package automatically, you might try manually link the package.
64
+For 0.29.2+ projects, simply link native packages via following command because rnpm has been merged into react-native, you no longer need it.
62 65
 
63
-Open `android/settings.gradle`, and add these lines which will app RNFetchBlob Android project dependency to your app.
66
+```
67
+react-native link
68
+```
64 69
 
65
-```diff
66
-include ':app'      
67
-+ include ':react-native-fetch-blob'                                                                                                  
68
-+ project(':react-native-fetch-blob').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fetch-blob/android')                        
70
+As for projects < 0.29 you need `rnpm` to link native packages
71
+
72
+```sh
73
+rnpm link
69 74
 ```
70 75
 
71
-Add this line to `MainApplication.java`, so that RNFetchBlob package becomes part of react native package.
76
+Optionally, use the following command to add Android permissions to `AndroidManifest.xml` automatically
72 77
 
73
-```diff
74
-...
75
-+ import com.RNFetchBlob.RNFetchBlobPackage;                                                                                 
76
-...
77
-protected List<ReactPackage> getPackages() {
78
-      return Arrays.<ReactPackage>asList(
79
-          new MainReactPackage(),
80
-+          new RNFetchBlobPackage()                                                                                         
81
-      );
82
-    }
83
-  };
84
-...
78
+```sh
79
+RNFB_ANDROID_PERMISSIONS=true react-native link
85 80
 ```
86
-> If you still having problem on installing this package, please check the [trouble shooting page](https://github.com/wkh237/react-native-fetch-blob/wiki/Trouble-Shooting) or [file an issue](https://github.com/wkh237/react-native-fetch-blob/issues/new)
81
+
82
+pre 0.29 projects
83
+
84
+```sh
85
+RNFB_ANDROID_PERMISSIONS=true rnpm link
86
+```
87
+
88
+The link script might not take effect if you have non-default project structure, please visit [the wiki](https://github.com/wkh237/react-native-fetch-blob/wiki/Manually-Link-Package/_edit) to manually link the pacakge.
87 89
 
88 90
 **Grant Permission to External storage for Android 5.0 or lower**
89 91
 
@@ -138,11 +140,10 @@ If you're using ES5 require statement to load the module, please add `default`.
138 140
 var RNFetchBlob = require('react-native-fetch-blob').default
139 141
 ```
140 142
 
141
-### HTTP Data Transfer
143
+## HTTP Data Transfer
142 144
 
143
----
144 145
 
145
-#### Regular Request
146
+### Regular Request
146 147
 
147 148
 After `0.8.0` react-native-fetch-blob automatically decide how to send the body by checking its type and `Content-Type` in header. The rule is described in the following diagram
148 149
 
@@ -150,13 +151,15 @@ After `0.8.0` react-native-fetch-blob automatically decide how to send the body
150 151
 
151 152
 To sum up :
152 153
 
153
-- To send a form data, the `Content-Type` header won't take effect if the body is an `Array` because we will set proper content type for you.
154
-- To send binary data, you have two choices, use BASE64 encoded string or a file path which points to a file contains the body. The `Content-Type` header does not matters.
155
- - The body is a BASE64 encoded string, the `Content-Type` header filed must containing substring`;BASE64` or `application/octet`  
156
- - The body is a path point to a file, it must be a string starts with `RNFetchBlob-file://`, which can simply done by `RNFetchBlob.wrap(PATH_TO_THE_FILE)`
157
-- To send the body as-is, set a `Content-Type` header not containing `;BASE64` or `application/octet`.
154
+- To send a form data, the `Content-Type` header does not matters. When the body is an `Array` we will set proper content type for you.
155
+- To send binary data, you have two choices, use BASE64 encoded string or path points to a file contains the body.
156
+ - If the `Content-Type` containing substring`;BASE64` or `application/octet` the given body will be considered as a BASE64 encoded data which will be decoded to binary data as the request body.   
157
+ - Otherwise, if a string starts with `RNFetchBlob-file://` (which can simply done by `RNFetchBlob.wrap(PATH_TO_THE_FILE)`), it will try to find the data from the URI string after `RNFetchBlob-file://` and use it as request body.
158
+- To send the body as-is, simply use a `Content-Type` header not containing `;BASE64` or `application/octet`.
159
+
160
+> After 0.9.4, we disabled `Chunked` transfer encoding by default, if you're going to use it, you should explicitly set header `Transfer-Encoding` to `Chunked`.
158 161
 
159
-#### Download example : Fetch files that needs authorization token
162
+### Download example : Fetch files that needs authorization token
160 163
 
161 164
 Most simple way is download to memory and stored as BASE64 encoded string, this is handy when the response data is small.
162 165
 
@@ -182,9 +185,9 @@ RNFetchBlob.fetch('GET', 'http://www.example.com/images/img1.png', {
182 185
   })
183 186
 ```
184 187
 
185
-#### Download to storage directly
188
+### Download to storage directly
186 189
 
187
-If the response data is large, that would be a bad idea to convert it into BASE64 string. The better solution is store the response data directly into file system. The simplest way is give a `fileCache` option to config, and set it to `true`. This will make incoming response data stored in a temporary path **without** any file extension.
190
+If the response data is large, that would be a bad idea to convert it into BASE64 string. A better solution is streaming the response directly into a file, simply add a `fileCache` option to config, and set it to `true`. This will make incoming response data stored in a temporary path **without** any file extension.
188 191
 
189 192
 **These files won't be removed automatically, please refer to [Cache File Management](#user-content-cache-file-management)**
190 193
 
@@ -206,7 +209,7 @@ RNFetchBlob
206 209
 
207 210
 **Set Temp File Extension**
208 211
 
209
-Sometimes you might need a file extension for some reason. For instance, when using file path as source of `Image` component, the path should end with something like .png or .jpg, you can do this by add `appendExt` option to `config`.
212
+Sometimes you might need a file extension for some reason. For example, when using file path as source of `Image` component, the path should end with something like .png or .jpg, you can do this by add `appendExt` option to `config`.
210 213
 
211 214
 ```js
212 215
 RNFetchBlob
@@ -229,7 +232,7 @@ RNFetchBlob
229 232
 
230 233
 **Use Specific File Path**
231 234
 
232
-If you prefer a specific path rather than randomly generated one, you can use `path` option. We've added a constant [dirs](#user-content-dirs) in v0.5.0 that contains several common used directories.
235
+If you prefer a specific path rather than randomly generated one, you can use `path` option. We've added [several  constants](#user-content-dirs) in v0.5.0 which represents commonly used directories.
233 236
 
234 237
 ```js
235 238
 let dirs = RNFetchBlob.fs.dirs
@@ -251,7 +254,7 @@ RNFetchBlob
251 254
 
252 255
 ####  Upload example : Dropbox [files-upload](https://www.dropbox.com/developers/documentation/http/documentation#files-upload) API
253 256
 
254
-`react-native-fetch-blob` will convert the base64 string in `body` to binary format using native API, this process will be  done in a new thread, so it's async.
257
+`react-native-fetch-blob` will convert the base64 string in `body` to binary format using native API, this process will be  done in a separated thread, so it won't block your GUI.
255 258
 
256 259
 ```js
257 260
 
@@ -276,9 +279,9 @@ RNFetchBlob.fetch('POST', 'https://content.dropboxapi.com/2/files/upload', {
276 279
   })
277 280
 ```
278 281
 
279
-#### Upload a file from storage
282
+### Upload a file from storage
280 283
 
281
-If you're going to use a `file` request body, just wrap the path with `wrap` API.
284
+If you're going to use a `file` as request body, just wrap the path with `wrap` API.
282 285
 
283 286
 ```js
284 287
 RNFetchBlob.fetch('POST', 'https://content.dropboxapi.com/2/files/upload', {
@@ -302,7 +305,7 @@ RNFetchBlob.fetch('POST', 'https://content.dropboxapi.com/2/files/upload', {
302 305
   })
303 306
 ```
304 307
 
305
-#### Multipart/form-data example : Post form data with file and data
308
+### Multipart/form-data example : Post form data with file and data
306 309
 
307 310
 In `version >= 0.3.0` you can also post files with form data, just put an array in `body`, with elements have property `name`, `data`, and `filename`(optional).
308 311
 
@@ -334,7 +337,7 @@ Elements have property `filename` will be transformed into binary format, otherw
334 337
   })
335 338
 ```
336 339
 
337
-What if you want to upload a file using form data ? Just like [upload a file from storage](#user-content-upload-a-file-from-storage) example, wrap `data` by `wrap` API (this feature is only available for `version >= v0.5.0`). On version >= `0.6.2`, it is possible to set custom MIME type when appending file to form data.
340
+What if you want to append a file to form data ? Just like [upload a file from storage](#user-content-upload-a-file-from-storage) example, wrap `data` by `wrap` API (this feature is only available for `version >= v0.5.0`). On version >= `0.6.2`, it is possible to set custom MIME type when appending file to form data. But keep in mind when the file is large it's likely crash your app. Please consider use other strategy (see [#94](https://github.com/wkh237/react-native-fetch-blob/issues/94)).
338 341
 
339 342
 ```js
340 343
 
@@ -373,9 +376,9 @@ What if you want to upload a file using form data ? Just like [upload a file fro
373 376
   })
374 377
 ```
375 378
 
376
-#### Upload/Download progress
379
+### Upload/Download progress
377 380
 
378
-In `version >= 0.4.2` it is possible to know the upload/download progress. After `0.7.0` IOS and Android upload progress are supported.
381
+In `version >= 0.4.2` it is possible to know the upload/download progress. After `0.7.0` IOS and Android upload progress are also supported.
379 382
 
380 383
 ```js
381 384
   RNFetchBlob.fetch('POST', 'http://www.example.com/upload', {
@@ -398,7 +401,7 @@ In `version >= 0.4.2` it is possible to know the upload/download progress. After
398 401
     })
399 402
 ```
400 403
 
401
-#### Cancel Request
404
+### Cancel Request
402 405
 
403 406
 After `0.7.0` it is possible to cancel a HTTP request. When the request cancel, it will definately throws an promise rejection, be sure to catch it.
404 407
 
@@ -537,9 +540,9 @@ Or show an image in image viewer
537 540
       android.actionViewIntent(PATH_OF_IMG, 'image/png')
538 541
 ```
539 542
 
540
-### File System
543
+## File System
541 544
 
542
-#### File Access
545
+### File Access
543 546
 
544 547
 File access APIs were made when developing `v0.5.0`, which helping us write tests, and was not planned to be a part of this module. However we realized that, it's hard to find a great solution to manage cached files, every one who use this moudle may need these APIs for there cases.
545 548
 
@@ -567,11 +570,11 @@ File Access APIs
567 570
 
568 571
 See [File API](https://github.com/wkh237/react-native-fetch-blob/wiki/File-System-Access-API) for more information
569 572
 
570
-#### File Stream
573
+### File Stream
571 574
 
572 575
 In `v0.5.0` we've added  `writeStream` and `readStream`, which allows your app read/write data from file path. This API creates a file stream, rather than convert whole data into BASE64 encoded string, it's handy when processing **large files**.
573 576
 
574
-When calling `readStream` method, you have to `open` the stream, and start to read data.
577
+When calling `readStream` method, you have to `open` the stream, and start to read data. When the file is large, consider use an appropriate `bufferSize` and `interval` to reduce the native event dispatching overhead (see [Performance Tips](#user-content-performance-tips))
575 578
 
576 579
 ```js
577 580
 let data = ''
@@ -616,7 +619,7 @@ RNFetchBlob.fs.writeStream(
616 619
 
617 620
 ```
618 621
 
619
-#### Cache File Management
622
+### Cache File Management
620 623
 
621 624
 When using `fileCache` or `path` options along with `fetch` API, response data will automatically stored into file system. The files will **NOT** removed unless you `unlink` it. There're several ways to remove the files
622 625
 
@@ -673,7 +676,15 @@ You can also grouping requests by using `session` API, and use `dispose` to remo
673 676
 
674 677
 ```
675 678
 
676
-#### Self-Signed SSL Server
679
+### Transfer Encoding
680
+
681
+After `0.9.4`, the `Chunked` transfer encoding is disabled by default due to some service provoder may not support chunked transfer. To enable it, set `Transfer-Encoding` header to `Chunked`.
682
+
683
+```js
684
+RNFetchBlob.fetch('POST', 'http://example.com/upload', { 'Transfer-Encoding' : 'Chunked' }, bodyData)
685
+```
686
+
687
+### Self-Signed SSL Server
677 688
 
678 689
 By default, react-native-fetch-blob does NOT allow connection to unknown certification provider since it's dangerous. If you're going to connect a server with self-signed certification, add `trusty` to `config`. This function is available for version >= `0.5.3`
679 690
 
@@ -687,7 +698,7 @@ RNFetchBlob.config({
687 698
 })
688 699
 ```
689 700
 
690
-### Web API Polyfills
701
+## Web API Polyfills
691 702
 
692 703
 After `0.8.0` we've made some [Web API polyfills](https://github.com/wkh237/react-native-fetch-blob/wiki/Web-API-Polyfills-(experimental)) that makes some browser-based library available in RN.
693 704
 
@@ -696,13 +707,13 @@ After `0.8.0` we've made some [Web API polyfills](https://github.com/wkh237/reac
696 707
 
697 708
 Here's a [sample app](https://github.com/wkh237/rn-firebase-storage-upload-sample) that uses polyfills to upload files to FireBase.
698 709
 
699
-### Performance Tips
700
-
701
----
710
+## Performance Tips
702 711
 
703 712
 **Reduce RCT Bridge and BASE64 Overheard**
704 713
 
705
-React Native connects JS and Native context by passing JSON through React bridge, therefore there will be an overhead to convert data before they sent. When data is large, this will be quite a performance impact to your app, it's recommended to use file storage instead of BASE64 if possible. The following chart shows how much faster when loading data from storage than BASE64 encoded string on iphone 6.
714
+When reading data via `fs.readStream` the process seems blocking JS thread when file is large, it's because the default buffer size is quite small (4kb) which result in large amount of events triggered in JS thread, try to increase the buffer size (for example 100kb = 102400) and set a larger interval (which is introduced in 0.9.4 default value is 10ms) to limit the frequency.
715
+
716
+React Native connects JS and Native context by passing JSON around React Native bridge, and there will be an overhead to convert data before they sent to each side. When data is large, this will be quite a performance impact to your app, it's recommended to use file storage instead of BASE64 if possible.The following chart shows how much faster when loading data from storage than BASE64 encoded string on iphone 6.
706 717
 
707 718
 <img src="img/performance_1.png" style="width : 100%"/>
708 719
 
@@ -720,35 +731,7 @@ If you're going to concatenate files, you don't have to read the data to JS cont
720 731
 
721 732
 ## Changes
722 733
 
723
-| Version | |
724
-|---|---|
725
-| 0.9.1 | Fix Android Blob constructor asynchronous issue caused by 0.9.0 fs change |
726
-| 0.9.0 | Fix unicode response data format issue #73. Improve Android performance by using thread pool instead of async task. Add Fetch replacement #70. Add Android only API `actionViewIntent` to open file or install APK in app |
727
-| 0.8.1 | Remove Web API log and fix ios progress report function. |
728
-| 0.8.0 | Added Web API polyfills, support regular request, added timeout option. |
729
-| 0.7.5 | Fix installation script that make it compatible to react-native < 0.28 |
730
-| 0.7.4 | Fix app crash problem in version > 0.27 |
731
-| 0.7.3 | Fix OkHttp dependency issue in version < 0.29 |
732
-| 0.7.2 | Fix cancel request bug |
733
-| 0.7.1 | Fix #57 ios module could not compile on ios version <= 9.3 |
734
-| 0.7.0 | Add support of Android upload progress, and remove AsyncHttpClient dependency from Android native implementation. |
735
-| 0.6.4 | Fix rnpm link script. |
736
-| 0.6.3 | Fix performance issue on IOS, increase max concurrent request limitation from 1. |
737
-| 0.6.2 | Add support of asset file and camera roll files, Support custom MIME type when sending multipart request, thanks @smartt |
738
-| 0.6.1 | Fix #37 progress report API issue on IOS |
739
-| 0.6.0 | Add readFile and writeFile API for easier file access, also added Android download manager support. |
740
-| 0.5.8 | Fix #33 PUT request will always be sent as POST on Android |
741
-| 0.5.7 | Fix #31 #30 Xcode pre 7.3 build error |
742
-| 0.5.6 | Add support for IOS network status indicator. Fix file stream ASCII reader bug. |
743
-| 0.5.5 | Remove work in progress code added in 0.5.2 which may cause memory leaks. |
744
-| 0.5.4 | Fix #30 #31 build build error, and improve memory efficiency. |
745
-| 0.5.3 | Add API for access untrusted SSL server |
746
-| 0.5.2 | Fix improper url params bug [#26](https://github.com/wkh237/react-native-fetch-blob/issues/26) and change IOS HTTP implementation from NSURLConnection to NSURLSession |
747
-| 0.5.0 | Upload/download with direct access to file storage, and also added file access APIs |
748
-| 0.4.2 | Supports upload/download progress |
749
-| 0.4.1 | Fix upload form-data missing file extension problem on Android |
750
-| 0.4.0 | Add base-64 encode/decode library and API |
751
-| ~0.3.0 | Upload/Download octet-stream and form-data |
734
+See [release notes](https://github.com/wkh237/react-native-fetch-blob/releases)
752 735
 
753 736
 ### Development
754 737
 

+ 1
- 1
src/package.json Прегледај датотеку

@@ -1,6 +1,6 @@
1 1
 {
2 2
   "name": "react-native-fetch-blob",
3
-  "version": "0.9.5-beta.2",
3
+  "version": "0.9.5",
4 4
   "description": "A module provides upload, download, and files access API. Supports file stream read/write for process large files.",
5 5
   "main": "index.js",
6 6
   "scripts": {

+ 2
- 2
src/react-native-fetch-blob.podspec Прегледај датотеку

@@ -1,12 +1,12 @@
1 1
 Pod::Spec.new do |s|
2 2
   s.name             = "react-native-fetch-blob"
3
-  s.version          = "0.9.5-beta.2"
3
+  s.version          = "0.9.5"
4 4
   s.summary          = "A project committed to make file acess and data transfer easier, effiecient for React Native developers."
5 5
   s.requires_arc = true
6 6
   s.license      = 'MIT'
7 7
   s.homepage     = 'n/a'
8 8
   s.authors      = { "wkh237" => "xeiyan@gmail.com" }
9
-  s.source       = { :git => "https://github.com/wkh237/react-native-fetch-blob", :tag => 'v0.9.5-beta.2'}
9
+  s.source       = { :git => "https://github.com/wkh237/react-native-fetch-blob", :tag => 'v0.9.5'}
10 10
   s.source_files = 'ios/**/*.{h,m}'
11 11
   s.platform     = :ios, "7.0"
12 12
   s.dependency 'React/Core'