support save cached images with extension

README.md

@@ -280,6 +280,22 @@ this.imageLoaderConfig.setFileTransferOptions({
 });
 ```
 ---
+#### setFileNameCachedWithExtension(enable: boolean)
+Enable/Disable the save filename of cached images with extension.  Defaults to false.
+
+Example:
+```ts
+this.imageLoaderConfig.setFileNameCachedWithExtension(true);
+```
+---
+#### setFallbackFileNameCachedExtension(extension: string)
+Sometime url missing extension, in this case you can set fallback as default extension. Defaults to '.jpg'
+
+Example:
+```ts
+this.imageLoaderConfig.setFallbackFileNameCachedExtension('.png');
+```
+---
 
 # Preloading images
 ```typescript

src/providers/image-loader-config.ts

@@ -39,6 +39,10 @@ export class ImageLoaderConfig {
     trustAllHosts: false
   };
 
+  fileNameCachedWithExtension: boolean = false;
+
+  fallbackFileNameCachedExtension: string = '.jpg';
+
   private _cacheDirectoryName: string = 'image-loader-cache';
 
   set cacheDirectoryName(name: string) {
@@ -194,4 +198,19 @@ export class ImageLoaderConfig {
     this.fileTransferOptions = options;
   }
 
+  /**
+   * Enable/Disable the save filename of cached images with extension.  Defaults to false.
+   * @param enable {boolean} set to true to enable
+   */
+  setFileNameCachedWithExtension(enable: boolean) {
+    this.fileNameCachedWithExtension = enable;
+  }
+
+  /**
+   * Set fallback extension filename of cached images.  Defaults to '.jpg'.
+   * @param extension {string} fallback extension (e.x .jpg)
+   */
+  setFallbackFileNameCachedExtension(extension: string) {
+    this.fallbackFileNameCachedExtension = extension;
+  }
 }

src/providers/image-loader.ts

@@ -576,7 +576,7 @@ export class ImageLoader {
    */
   private createFileName(url: string): string {
     // hash the url to get a unique file name
-    return this.hashString(url).toString();
+    return this.hashString(url).toString() + (this.config.fileNameCachedWithExtension ? this.getExtensionFromFileName(url) : '');
   }
 
   /**
@@ -595,4 +595,13 @@ export class ImageLoader {
     return hash;
   }
 
+  /**
+   * extract extension from filename or url
+   *
+   * @param filename
+   * @returns {string}
+   */
+  private getExtensionFromFileName(filename) {
+    return filename.substr((~-filename.lastIndexOf(".") >>> 0) + 1) || this.config.fallbackFileNameCachedExtension;
+  }
 }