Browse Source

Update README.md

wkh237 8 years ago
parent
commit
56d1e08437
1 changed files with 87 additions and 19 deletions
  1. 87
    19
      README.md

+ 87
- 19
README.md View File

@@ -2,13 +2,17 @@
2 2
 
3 3
 ## v0.5.0 Work In Progress README.md
4 4
 
5
-Upload, and download files with customzable headers. Supports binary response/request data, upload/download progress, also has file stream, and CRUD APIs which enables you process file content in JS context. (such as display image data, and process string or data).
5
+Module for upload, download, and access files in JS context. Also provides file stream API for read/write large files.
6 6
 
7 7
 If you're getting into trouble with image or file server that requires specific fields in the header, or you're having problem with `fetch` API when sending/receiving binary data, you might try this module as well.
8 8
 
9 9
 See [[fetch] Does fetch with blob() marshal data across the bridge?](https://github.com/facebook/react-native/issues/854) for the reason why I made this module.
10 10
 
11
-In latest version (v0.5.0), you can either `upload` or `download` files simply using a file path. 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-usage) bellow.
11
+** Pre v0.5.0 Users**
12
+
13
+This update is `backward-compatible` generally you don't have to change existing code unless you're going to use new APIs.
14
+
15
+In latest version (v0.5.0), 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-usage) bellow.
12 16
 
13 17
 This module implements native methods, supports both Android (uses awesome native library  [AsyncHttpClient](https://github.com/AsyncHttpClient/async-http-client])) and IOS.
14 18
 
@@ -20,10 +24,12 @@ This module implements native methods, supports both Android (uses awesome nativ
20 24
  * [Upload file](#user-content-upload-example--dropbox-files-upload-api)
21 25
  * [Multipart/form upload](#user-content-multipartform-data-example--post-form-data-with-file-and-data)
22 26
  * [Upload/Download progress](#user-content-uploaaddownload-progress)
27
+ * [Show Downloaded File in Android Downloads App](#user-content-show-downloaded-file-in-android-downloads-app)
23 28
  * [File access](#user-content-file-access)
24 29
  * [File stream](#user-content-file-stream)
25 30
  * [Manage cached files](#user-content-manage-cached-files)
26 31
 * [API](#user-content-api)
32
+ * [config](#user-content-config)
27 33
  * [fetch](#user-content-fetchmethod-url-headers-bodypromisefetchblobresponse)
28 34
  * [session](#user-content-sessionnamestringrnfetchblobsession)
29 35
  * [base64](#user-content-base64)
@@ -189,7 +195,7 @@ RNFetchBlob.fetch('POST', 'https://content.dropboxapi.com/2/files/upload', {
189 195
 
190 196
 #### Upload a file from storage
191 197
 
192
-If you're going to use a `file` request body, just push the path with prefix `RNFetchBlob-file://`. (We're planning to add an API to customize this prefix)
198
+If you're going to use a `file` request body, just wrap the path with `wrap` API.
193 199
 
194 200
 ```js
195 201
 RNFetchBlob.fetch('POST', 'https://content.dropboxapi.com/2/files/upload', {
@@ -203,7 +209,7 @@ RNFetchBlob.fetch('POST', 'https://content.dropboxapi.com/2/files/upload', {
203 209
     }),
204 210
     'Content-Type' : 'application/octet-stream',
205 211
     // Change BASE64 encoded data to a file path with prefix `RNFetchBlob-file://` when the data comes from a file.
206
-  }, 'RNFetchBlob-file://' + PATH_TO_THE_FILE)
212
+  }, RNFetchBlob.wrap(PATH_TO_THE_FILE))
207 213
   .then((res) => {
208 214
     console.log(res.text())
209 215
   })
@@ -240,7 +246,7 @@ Elements have property `filename` will be transformed into binary format, otherw
240 246
   })
241 247
 ```
242 248
 
243
-What if you want to upload a file in some field ? Just like [upload a file from storage](#user-content-upload-a-file-from-storage) example, change `data` to path of the file with a prefix `RNFetchBlob-file://` (this feature is only available for `version >= v0.5.0`)
249
+What if you want to upload a file in some field ? 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`)
244 250
 
245 251
 ```js
246 252
 
@@ -255,7 +261,7 @@ What if you want to upload a file in some field ? Just like [upload a file from
255 261
       name : 'avatar',
256 262
       filename : 'avatar.png',
257 263
       // Change BASE64 encoded data to a file path with prefix `RNFetchBlob-file://` when the data comes from a file path
258
-      data: 'RNFetchBlob-file://' + PATH_TO_THE_FILE
264
+      data: RNFetchBlob.wrap(PATH_TO_THE_FILE)
259 265
     },
260 266
     // elements without property `filename` will be sent as plain text
261 267
     { name : 'name', data : 'user'},
@@ -290,6 +296,30 @@ In `version >= 0.4.2` it is possible to know the upload/download progress.
290 296
     })
291 297
 ```
292 298
 
299
+#### Show Downloaded File in Android Downloads App
300
+
301
+When you use `config` API to store response data to file, the file won't be visible in Andoird's "Download" app, if you want to do this, some extra options in `config` is required.
302
+
303
+```js
304
+RNFetchBlob.config({
305
+  fileCache : true,
306
+  // android only options
307
+  addAndroidDownloads : {
308
+    // Show notification when response data transmitted
309
+    notification : true,
310
+    // Title of download notification
311
+    title : 'Great ! Download Success ! :O ',
312
+    // File description (not notification description)
313
+    description : 'An image file.',
314
+    mime : 'image/png',
315
+    // Make the file scannable  by media scanner
316
+    meidaScannable : true,
317
+  }
318
+})
319
+.fetch('GET', 'http://example.com/image1.png')
320
+.then(...)
321
+```
322
+
293 323
 #### File Access
294 324
 
295 325
 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 I realized that, it's hard to find a great solution to manage cached files, every one who use this moudle may need those APIs for there cases. 
@@ -308,18 +338,17 @@ Here's the list of `fs` APIs
308 338
 - exists
309 339
 - isDir
310 340
 
311
-
312
-
341
+See [fs](#user-content-fs) chapter for more information
313 342
 
314 343
 #### File Stream
315 344
 
316
-In `v0.5.0` we've added  `writeStream` and `readStream` in `fs`, which allows you read/write data from file path. This API creates a file stream, rather than a BASE64 encoded data of the file, it's handy when deal with **large files**.
345
+In `v0.5.0` we've added  `writeStream` and `readStream`, which allows you 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**.
317 346
 
318
-But there're some differences on usage of `readStream` and `writeStream`. When calling `readStream` method, the file stream is opened immediately, and start to read data. 
347
+But there're some differences between `readStream` and `writeStream` API. When calling `readStream` method, the file stream is opened immediately, and start to read data. 
319 348
 
320 349
 ```js
321 350
 let data = ''
322
-let stream = RNFetchBlob.readStream(
351
+let ifstream = RNFetchBlob.readStream(
323 352
     // encoding, should be one of `base64`, `utf8`
324 353
     'base64',
325 354
     // file path
@@ -327,17 +356,32 @@ let stream = RNFetchBlob.readStream(
327 356
     // (optional) buffer size, default to 4096 (4095 for BASE64 encoded data)
328 357
     // when reading file in BASE64 encoding, buffer size must be multiples of 3.
329 358
     4095)
330
-stream.onData((chunk) => {
359
+ifstream.onData((chunk) => {
331 360
   data += chunk
332 361
 })
333
-stream.onError((err) => {
362
+ifstream.onError((err) => {
334 363
   console.log('oops', err)
335 364
 })
336
-stream.onEnd(() => {  
365
+ifstream.onEnd(() => {  
337 366
   <Image source={{ uri : 'data:image/png,base64' + data }}
338 367
 })
339 368
 ```
340 369
 
370
+When use `writeStream`, the stream is also opened immediately, but you have to `write`, and `close` by yourself.
371
+
372
+```
373
+let ofstream = RNFetchBlob.writeStream(
374
+    PATH_TO_FILE, 
375
+    // encoding, should be one of `base64`, `utf8`, `ascii`
376
+    'utf8',
377
+    // should data append to existing content ?
378
+    true)
379
+ofstream.write('foo')
380
+ofstream.write('bar')
381
+ofstream.close()
382
+
383
+```
384
+
341 385
 #### Cache File Management
342 386
 
343 387
 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
@@ -399,7 +443,7 @@ You can also group the requests by using `session` API, and use `dispose` to rem
399 443
 
400 444
 #### `config(options:RNFetchBlobConfig):fetch`
401 445
 
402
-TODO
446
+Config API was introduced in `v0.5.0` which provides some options for the `fetch` task. 
403 447
 
404 448
 #### `fetch(method, url, headers, body):Promise<FetchBlobResponse>`
405 449
 
@@ -442,6 +486,25 @@ TODO
442 486
 
443 487
 ### Types
444 488
 
489
+#### RNFetchBlobConfig
490
+
491
+A set of configurations that will be injected into a `fetch` method, with the following properties.
492
+
493
+#### fileCache:boolean
494
+  Set this property to `true` will makes response data of the `fetch` stored in a temp file, by default the temp file will stored in App's own root folder with file name template `RNFetchBlob_tmp${timestamp}`.
495
+#### appendExt:string
496
+  Set this propery to change temp file extension that created by `fetch` response data.
497
+#### path:string
498
+  When this property has value, `fetch` API will try to store response data in the path ignoring `fileCache` and `appendExt` property.
499
+#### addAndroidDownloads:object (Android only)
500
+  This is an Android only property, it should be an object with the following properties :
501
+  - title : title of the file download success notification
502
+  - description : File description of the file.
503
+  - mime : MIME type of the file. By default is `text/plain`
504
+  - mediaScannable : A `boolean` value, see [Officail Document](https://developer.android.com/reference/android/app/DownloadManager.html#addCompletedDownload(java.lang.String, java.lang.String, boolean, java.lang.String, java.lang.String, long, boolean))
505
+  - notification : A `boolean` value decide whether show a notification when download complete.
506
+  
507
+
445 508
 #### RNFetchBlobResponse
446 509
 
447 510
 When `fetch` success, it resolve a `FetchBlobResponse` object as first argument. `FetchBlobResponse` object has the following methods (these method are synchronous, so you might take quite a performance impact if the file is big)
@@ -464,11 +527,16 @@ resp.session('session-name')
464 527
 
465 528
 #### RNFetchBlobSession
466 529
 
467
-TODO
530
+A `session` is an object that helps you manage files. It simply main a list of file path and let you use `dispose()`to delete files in this session once and for all.
468 531
 
469
-#### RNFetchBlobStream
470
-
471
-TODO
532
+#### add(path:string):RNFetchBlobSession
533
+  Add a file path to this session.
534
+#### remove(path:string):RNFetchBlobSession
535
+  Remove a file path from this session (not delete the file).
536
+#### list():Array<String>
537
+  Returns an array contains file paths in this session.
538
+#### dispose():Promise
539
+  Delete all files according to paths in the session.
472 540
 
473 541
 ## Major Changes
474 542