ソースを参照

rn-expo: add custom file reader example for tus

Ifedapo Olarewaju 6 年 前
コミット
07556c999c

+ 4 - 2
examples/react-native-expo/App.js

@@ -13,6 +13,7 @@ import FileList from './FileList'
 import PauseResumeButton from './PauseResumeButton'
 import ProgressBar from './ProgressBar'
 import SelectFiles from './SelectFilesButton'
+import getTusFileReader from './tusFileReader'
 
 export default class App extends React.Component {
   constructor () {
@@ -43,8 +44,9 @@ export default class App extends React.Component {
     this.uppy = Uppy({ autoProceed: true, debug: true })
     this.uppy.use(Tus, {
       endpoint: 'https://master.tus.io/files/',
-      urlStorage: AsyncStorage
-      // fingerprint: customFingerprint
+      urlStorage: AsyncStorage,
+      fileReader: getTusFileReader,
+      chunkSize: 10 * 1024 * 1024 // keep the chunk size small to avoid memory exhaustion
     })
     this.uppy.on('upload-progress', (file, progress) => {
       this.setState({

+ 35 - 42
examples/react-native-expo/package-lock.json

@@ -721,17 +721,17 @@
       }
     },
     "@babel/runtime": {
-      "version": "7.3.4",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.3.4.tgz",
-      "integrity": "sha512-IvfvnMdSaLBateu0jfsYIpZTxAc2cKEXEMiezGGN75QcBcecDUKd3PgLAncT0oOgxKy8dd8hrJKj9MfzgfZd6g==",
+      "version": "7.4.3",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.4.3.tgz",
+      "integrity": "sha512-9lsJwJLxDh/T3Q3SZszfWOTkk3pHbkmH+3KY+zwIDmsNlxsumuhS2TH3NIpktU4kNvfzy+k3eLT7aTJSPTo0OA==",
       "requires": {
-        "regenerator-runtime": "^0.12.0"
+        "regenerator-runtime": "^0.13.2"
       },
       "dependencies": {
         "regenerator-runtime": {
-          "version": "0.12.1",
-          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz",
-          "integrity": "sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg=="
+          "version": "0.13.2",
+          "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.2.tgz",
+          "integrity": "sha512-S/TQAZJO+D3m9xeN1WTI8dLKBBiRgXBlTJvbWjCThHWZj9EvHK70Ff50/tYj2J/fvBY6JtFVwRuazHN2E7M9BA=="
         }
       }
     },
@@ -831,9 +831,9 @@
       }
     },
     "@types/qs": {
-      "version": "6.5.2",
-      "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.5.2.tgz",
-      "integrity": "sha512-47kAAs3yV/hROraCTQYDMh4p/6zI9+gtssjD0kq9OWsGdLcBge59rl49FnCuJ+iWxEKiqFz6KXzeGH5DRVjNJA=="
+      "version": "6.5.3",
+      "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.5.3.tgz",
+      "integrity": "sha512-Jugo5V/1bS0fRhy2z8+cUAHEyWOATaz4rbyLVvcFs7+dXp5HfwpEwzF1Q11bB10ApUqHf+yTauxI0UXQDwGrbA=="
     },
     "@types/uuid-js": {
       "version": "0.7.2",
@@ -2498,6 +2498,18 @@
         "object-assign": "^4.1.1"
       }
     },
+    "cross-spawn": {
+      "version": "6.0.5",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
+      "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
+      "requires": {
+        "nice-try": "^1.0.4",
+        "path-key": "^2.0.1",
+        "semver": "^5.5.0",
+        "shebang-command": "^1.2.0",
+        "which": "^1.2.9"
+      }
+    },
     "cuid": {
       "version": "2.1.6",
       "resolved": "https://registry.npmjs.org/cuid/-/cuid-2.1.6.tgz",
@@ -2827,24 +2839,6 @@
         "serialize-error": "^2.1.0",
         "uuid-js": "^0.7.5",
         "whatwg-fetch": "^2.0.4"
-      },
-      "dependencies": {
-        "cross-spawn": {
-          "version": "6.0.5",
-          "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
-          "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
-          "requires": {
-            "nice-try": "^1.0.4",
-            "path-key": "^2.0.1",
-            "semver": "^5.5.0",
-            "shebang-command": "^1.2.0",
-            "which": "^1.2.9"
-          }
-        },
-        "react-native-maps": {
-          "version": "github:expo/react-native-maps#e6f98ff7272e5d0a7fe974a41f28593af2d77bb2",
-          "from": "github:expo/react-native-maps#v0.22.1-exp.0"
-        }
       }
     },
     "expo-ads-admob": {
@@ -4632,11 +4626,6 @@
           "requires": {
             "minimist": "^1.2.0"
           }
-        },
-        "minimist": {
-          "version": "1.2.0",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
-          "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
         }
       }
     },
@@ -5196,9 +5185,9 @@
       "integrity": "sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg=="
     },
     "moment-timezone": {
-      "version": "0.5.23",
-      "resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.23.tgz",
-      "integrity": "sha512-WHFH85DkCfiNMDX5D3X7hpNH3/PUhjTGcD0U1SgfBGZxJ3qUmJh5FdvaFjcClxOvB3rzdfj4oRffbI38jEnC1w==",
+      "version": "0.5.25",
+      "resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.25.tgz",
+      "integrity": "sha512-DgEaTyN/z0HFaVcVbSyVCUU6HeFdnNC3vE4c9cgu2dgMTvjBUBdBzWfasTBmAW45u5OIMeCJtU8yNjM22DHucw==",
       "requires": {
         "moment": ">= 2.9.0"
       }
@@ -5830,9 +5819,9 @@
       "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A=="
     },
     "qs": {
-      "version": "6.6.0",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.6.0.tgz",
-      "integrity": "sha512-KIJqT9jQJDQx5h5uAVPimw6yVg2SekOKu959OCtktD3FjzbpvaPr8i4zzg07DOMz+igA4W/aNM7OV8H37pFYfA=="
+      "version": "6.7.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.7.0.tgz",
+      "integrity": "sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ=="
     },
     "querystringify": {
       "version": "2.1.1",
@@ -5997,6 +5986,10 @@
         "prop-types": "^15.5.10"
       }
     },
+    "react-native-maps": {
+      "version": "github:expo/react-native-maps#e6f98ff7272e5d0a7fe974a41f28593af2d77bb2",
+      "from": "github:expo/react-native-maps#v0.22.1-exp.0"
+    },
     "react-native-reanimated": {
       "version": "1.0.0-alpha.11",
       "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-1.0.0-alpha.11.tgz",
@@ -7485,9 +7478,9 @@
       },
       "dependencies": {
         "mime": {
-          "version": "2.4.0",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-2.4.0.tgz",
-          "integrity": "sha512-ikBcWwyqXQSHKtciCcctu9YfPbFYZ4+gbHEmE0Q8jzcTYQg5dHCr3g2wwAZjPoJfQVXZq6KXAjpXOTf5/cjT7w=="
+          "version": "2.4.2",
+          "resolved": "https://registry.npmjs.org/mime/-/mime-2.4.2.tgz",
+          "integrity": "sha512-zJBfZDkwRu+j3Pdd2aHsR5GfH2jIWhmL1ZzBoc+X+3JEti2hbArWcyJ+1laC1D2/U/W1a/+Cegj0/OnEU2ybjg=="
         }
       }
     },

+ 2 - 1
examples/react-native-expo/package.json

@@ -14,7 +14,8 @@
     "@uppy/tus": "^0.30.5",
     "@uppy/url": "^0.30.5",
     "@uppy/xhr-upload": "^0.30.5",
-    "expo": "^32.0.0",
+    "base64-js": "^1.3.0",
+    "expo": "^32.0.6",
     "preact-render-to-string": "^4.1.0",
     "react": "16.5.0",
     "react-native": "https://github.com/expo/react-native/archive/sdk-32.0.0.tar.gz",

+ 31 - 0
examples/react-native-expo/tusFileReader.js

@@ -0,0 +1,31 @@
+import * as Expo from 'expo'
+import base64 from 'base64-js'
+
+export default function getTusFileReader (file, chunkSize, cb) {
+  Expo.FileSystem.getInfoAsync(file.uri, { size: true }).then((info) => {
+    cb(null, new TusFileReader(file, info.size))
+  }).catch(cb)
+}
+
+class TusFileReader {
+  constructor (file, size) {
+    this.file = file
+    this.size = size
+  }
+
+  slice (start, end, cb) {
+    end = Math.min(end, this.size)
+    const options = {
+      encoding: Expo.FileSystem.EncodingTypes.Base64,
+      length: end - start,
+      postion: start
+    }
+    Expo.FileSystem.readAsStringAsync(this.file.uri, options).then((data) => {
+      cb(null, base64.toByteArray(data))
+    }).catch(cb)
+  }
+
+  close () {
+
+  }
+}

+ 1 - 1
packages/@uppy/companion/package.json

@@ -55,7 +55,7 @@
     "redis": "2.8.0",
     "request": "2.85.0",
     "serialize-error": "^2.1.0",
-    "tus-js-client": "github:ifedapoolarewaju/tus-js-client#d63fcf08ee43080a0e1cc968ad5986ace788c2d4",
+    "tus-js-client": "github:ifedapoolarewaju/tus-js-client#44dd2a081a551982f8bb4cc024dfb982955b225d",
     "uuid": "2.0.2",
     "validator": "^9.0.0",
     "ws": "1.1.5"

+ 1 - 1
packages/@uppy/tus/package.json

@@ -24,7 +24,7 @@
   "dependencies": {
     "@uppy/companion-client": "0.28.5",
     "@uppy/utils": "0.30.5",
-    "tus-js-client": "github:ifedapoolarewaju/tus-js-client#d63fcf08ee43080a0e1cc968ad5986ace788c2d4"
+    "tus-js-client": "github:ifedapoolarewaju/tus-js-client#44dd2a081a551982f8bb4cc024dfb982955b225d"
   },
   "devDependencies": {
     "@uppy/core": "0.30.5"