back/methods/image/download.js

@@ -74,10 +74,13 @@ module.exports = Self => {
         const container = await models.ImageContainer.getContainer(collection);
         const rootPath = container.client.root;
         const fileSrc = path.join(rootPath, collection, size);
+
+        const ext = image.name.substring((image.name.length - 4));
+        const fileName = ext !== '.png' ? `${image.name}.png` : image.name;
         const file = {
-            path: `${fileSrc}/${image.name}.png`,
+            path: `${fileSrc}/${fileName}`,
             contentType: 'image/png',
-            name: `${image.name}.png`
+            name: image.name
         };
 
         if (!fs.existsSync(file.path)) return [];

back/methods/image/upload.js

@@ -1,6 +1,7 @@
 const UserError = require('vn-loopback/util/user-error');
 const fs = require('fs-extra');
 const path = require('path');
+const uuid = require('uuid');
 
 module.exports = Self => {
     Self.remoteMethodCtx('upload', {
@@ -18,12 +19,6 @@ module.exports = Self => {
                 type: 'string',
                 description: 'The collection name',
                 required: true
-            },
-            {
-                arg: 'fileName',
-                type: 'string',
-                description: 'The file name',
-                required: true
             }],
         returns: {
             type: 'Object',
@@ -56,10 +51,12 @@ module.exports = Self => {
             const [uploadedFile] = Object.values(uploaded.files).map(file => {
                 return file[0];
             });
+
             const file = await TempContainer.getFile(tempContainer.name, uploadedFile.name);
             srcFile = path.join(file.client.root, file.container, file.name);
 
-            await models.Image.registerImage(args.collection, srcFile, args.fileName, args.id);
+            const fileName = `${uuid.v4()}.png`;
+            await models.Image.registerImage(args.collection, srcFile, fileName, args.id);
         } catch (e) {
             if (fs.existsSync(srcFile))
                 await fs.unlink(srcFile);

back/models/image.js

@@ -84,9 +84,8 @@ module.exports = Self => {
             const container = await models.ImageContainer.container(collectionName);
             const rootPath = container.client.root;
             const collectionDir = path.join(rootPath, collectionName);
-            const file = `${fileName}.png`;
             const dstDir = path.join(collectionDir, 'full');
-            const dstFile = path.join(dstDir, file);
+            const dstFile = path.join(dstDir, fileName);
 
             const buffer = readChunk.sync(srcFilePath, 0, 12);
             const type = imageType(buffer);
@@ -120,7 +119,7 @@ module.exports = Self => {
             const sizes = collection.sizes();
             for (let size of sizes) {
                 const dstDir = path.join(collectionDir, `${size.width}x${size.height}`);
-                const dstFile = path.join(dstDir, file);
+                const dstFile = path.join(dstDir, fileName);
                 const resizeOpts = {
                     withoutEnlargement: true,
                     fit: size.crop ? 'cover' : 'inside'

front/salix/components/upload-photo/index.html

@@ -69,14 +69,6 @@
                     value-field="code">
                 </vn-autocomplete>
             </vn-horizontal>
-            <vn-horizontal>
-                <vn-textfield
-                    vn-one 
-                    label="File name" 
-                    ng-model="$ctrl.newPhoto.fileName"
-                    required="true">
-                </vn-input-file>
-            </vn-horizontal>
         </vn-one>
     </vn-horizontal>
     </tpl-body>

front/salix/components/upload-photo/index.js

@@ -64,8 +64,7 @@ export default class UploadPhoto extends Component {
         this.editor = null;
         this.newPhoto = {
             id: id,
-            collection: collection,
-            fileName: id
+            collection: collection
         };
         this.$.dialog.show();
     }

modules/item/back/methods/item-image-queue/downloadImages.js

@@ -1,6 +1,7 @@
 const https = require('https');
 const fs = require('fs-extra');
 const path = require('path');
+const uuid = require('uuid');
 
 module.exports = Self => {
     Self.remoteMethod('downloadImages', {
@@ -46,10 +47,8 @@ module.exports = Self => {
 
             if (!image) return;
 
-            const srcFile = image.url;
-            const fileName = srcFile.replace(/\.|\/|:|\?|\\|=|%/g, '');
-            const file = `${fileName}.png`;
-            const filePath = path.join(tempPath, file);
+            const fileName = `${uuid.v4()}.png`;
+            const filePath = path.join(tempPath, fileName);
             const imageUrl = image.url.replace('http://', 'https://');
 
             https.get(imageUrl, async response => {