From d5bf5bec78f4c1d4777436b68feb476fb111f29f Mon Sep 17 00:00:00 2001 From: Miguel Alatzar Date: Mon, 22 Apr 2019 19:19:21 -0700 Subject: [PATCH] [MM-14699] Update image cache manager to handle correct file extensions (#2701) * Update image cache manager to handle correct file extensions * Use RNFetchBlob.fs.existsWithDiffExt to find cached images with extensions other than the default .png * Add package-lock.json * Use app/util/file's getExtensionFromMime * Define DEFAULT_MIME_TYPE in image_cache_manager.js --- app/utils/image_cache_manager.js | 29 +++++++++++++++++++++++++---- package-lock.json | 12 ++++++++++-- package.json | 2 +- 3 files changed, 36 insertions(+), 7 deletions(-) diff --git a/app/utils/image_cache_manager.js b/app/utils/image_cache_manager.js index c990c6277..64f3ee973 100644 --- a/app/utils/image_cache_manager.js +++ b/app/utils/image_cache_manager.js @@ -9,9 +9,11 @@ import RNFetchBlob from 'rn-fetch-blob'; import {Client4} from 'mattermost-redux/client'; import {DeviceTypes} from 'app/constants'; +import {getExtensionFromMime} from 'app/utils/file'; import mattermostBucket from 'app/mattermost_bucket'; const {IMAGES_PATH} = DeviceTypes; +const DEFAULT_MIME_TYPE = 'image/png'; let siteUrl; export default class ImageCacheManager { @@ -53,7 +55,17 @@ export default class ImageCacheManager { throw new Error(); } - notifyAll(uri, `${prefix}${path}`); + const mimeType = this.downloadTask.respInfo.headers['Content-Type']; + const ext = `.${getExtensionFromMime(mimeType) || getExtensionFromMime(DEFAULT_MIME_TYPE)}`; + if (path.endsWith(ext)) { + notifyAll(uri, `${prefix}${path}`); + } else { + const oldExt = path.substring(path.lastIndexOf('.')); + const newPath = path.replace(oldExt, ext); + await RNFetchBlob.fs.mv(path, newPath); + + notifyAll(uri, `${prefix}${newPath}`); + } } catch (e) { RNFetchBlob.fs.unlink(`${prefix}${path}`); notifyAll(uri, uri); @@ -70,8 +82,9 @@ export default class ImageCacheManager { export const getCacheFile = async (name, uri) => { const filename = name || uri.substring(uri.lastIndexOf('/'), uri.indexOf('?') === -1 ? uri.length : uri.indexOf('?')); - const ext = filename.indexOf('.') === -1 ? '.png' : filename.substring(filename.lastIndexOf('.')); - const path = `${IMAGES_PATH}/${Math.abs(hashCode(uri))}${ext}`; + const defaultExt = `.${getExtensionFromMime(DEFAULT_MIME_TYPE)}`; + const ext = filename.indexOf('.') === -1 ? defaultExt : filename.substring(filename.lastIndexOf('.')); + let path = `${IMAGES_PATH}/${Math.abs(hashCode(uri))}${ext}`; try { const isDir = await RNFetchBlob.fs.isDir(IMAGES_PATH); @@ -82,7 +95,15 @@ export const getCacheFile = async (name, uri) => { // do nothing } - const exists = await RNFetchBlob.fs.exists(path); + let exists = await RNFetchBlob.fs.exists(path); + if (!exists) { + const pathWithDiffExt = await RNFetchBlob.fs.existsWithDiffExt(path); + if (pathWithDiffExt) { + exists = true; + path = pathWithDiffExt; + } + } + return {exists, path}; }; diff --git a/package-lock.json b/package-lock.json index 117e429b5..04147b9ff 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9684,7 +9684,11 @@ }, "mkdirp": { "version": "0.5.1", +<<<<<<< HEAD "resolved": "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", +======= + "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", +>>>>>>> 1a9b34f6... [MM-14699] Update image cache manager to handle correct file extensions (#2701) "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=", "requires": { "minimist": "0.0.8" @@ -9692,7 +9696,11 @@ "dependencies": { "minimist": { "version": "0.0.8", +<<<<<<< HEAD "resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", +======= + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", +>>>>>>> 1a9b34f6... [MM-14699] Update image cache manager to handle correct file extensions (#2701) "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=" } } @@ -13188,8 +13196,8 @@ } }, "rn-fetch-blob": { - "version": "github:mattermost/react-native-fetch-blob#5b19784992ef2a1fa00c3a4c71fb005d7789b05c", - "from": "github:mattermost/react-native-fetch-blob#5b19784992ef2a1fa00c3a4c71fb005d7789b05c", + "version": "github:mattermost/react-native-fetch-blob#1800697e2e3834e80f7e5fa84edb5aa43c161bbc", + "from": "github:mattermost/react-native-fetch-blob#1800697e2e3834e80f7e5fa84edb5aa43c161bbc", "requires": { "base-64": "0.1.0", "glob": "7.0.6" diff --git a/package.json b/package.json index 570e9e7f6..cd8f13829 100644 --- a/package.json +++ b/package.json @@ -65,7 +65,7 @@ "redux-persist-transform-filter": "0.0.18", "redux-thunk": "2.3.0", "reselect": "4.0.0", - "rn-fetch-blob": "github:mattermost/react-native-fetch-blob#5b19784992ef2a1fa00c3a4c71fb005d7789b05c", + "rn-fetch-blob": "github:mattermost/react-native-fetch-blob#1800697e2e3834e80f7e5fa84edb5aa43c161bbc", "rn-placeholder": "github:mattermost/rn-placeholder#bfee66eb54f1f06d1425a0ad511a5e16559bf82c", "semver": "5.6.0", "shallow-equals": "1.0.0",