First commit encrypting attachments locally

app/attachments.js

@@ -6,6 +6,7 @@ const glob = require('glob');
 const fse = require('fs-extra');
 const toArrayBuffer = require('to-arraybuffer');
 const { map, isArrayBuffer, isString } = require('lodash');
+const AttachmentTS = require('../ts/types/Attachment');
 
 const PATH = 'attachments.noindex';
 
@@ -45,14 +46,18 @@ exports.createReader = root => {
     if (!isString(relativePath)) {
       throw new TypeError("'relativePath' must be a string");
     }
-
+    console.time(`readFile: ${relativePath}`);
     const absolutePath = path.join(root, relativePath);
     const normalized = path.normalize(absolutePath);
     if (!normalized.startsWith(root)) {
       throw new Error('Invalid relative path');
     }
     const buffer = await fse.readFile(normalized);
-    return toArrayBuffer(buffer);
+    const decryptedData = await AttachmentTS.decryptAttachmentBuffer(
+      toArrayBuffer(buffer)
+    );
+
+    return decryptedData.buffer;
   };
 };
 
@@ -95,7 +100,6 @@ exports.createWriterForExisting = root => {
       throw new TypeError("'arrayBuffer' must be an array buffer");
     }
 
-    const buffer = Buffer.from(arrayBuffer);
     const absolutePath = path.join(root, relativePath);
     const normalized = path.normalize(absolutePath);
     if (!normalized.startsWith(root)) {
@@ -103,7 +107,13 @@ exports.createWriterForExisting = root => {
     }
 
     await fse.ensureFile(normalized);
+    const {
+      encryptedBufferWithHeader,
+    } = await AttachmentTS.encryptAttachmentBuffer(arrayBuffer);
+    const buffer = Buffer.from(encryptedBufferWithHeader.buffer);
+
     await fse.writeFile(normalized, buffer);
+
     return relativePath;
   };
 };

js/modules/attachment_downloads.js

@@ -254,18 +254,6 @@ async function _addAttachmentToMessage(message, attachment, { type, index }) {
 
   const logPrefix = `${message.idForLogging()} (type: ${type}, index: ${index})`;
 
-  if (type === 'long-message') {
-    try {
-      const { data } = await Signal.Migrations.loadAttachmentData(attachment);
-      message.set({
-        body: attachment.isError ? message.get('body') : stringFromBytes(data),
-      });
-    } finally {
-      Signal.Migrations.deleteAttachmentData(attachment.path);
-    }
-    return;
-  }
-
   if (type === 'attachment') {
     const attachments = message.get('attachments');
     if (!attachments || attachments.length <= index) {

js/modules/types/visual_attachment.js

@@ -1,12 +1,18 @@
+/* eslint-disable more/no-then */
 /* global document, URL, Blob */
 
 const loadImage = require('blueimp-load-image');
 const { toLogFormat } = require('./errors');
+const toArrayBuffer = require('to-arraybuffer');
+
 const dataURLToBlobSync = require('blueimp-canvas-to-blob');
+const fse = require('fs-extra');
+
 const { blobToArrayBuffer } = require('blob-util');
 const {
   arrayBufferToObjectURL,
 } = require('../../../ts/util/arrayBufferToObjectURL');
+const AttachmentTS = require('../../../ts/types/Attachment');
 
 exports.blobToArrayBuffer = blobToArrayBuffer;
 
@@ -24,8 +30,17 @@ exports.getImageDimensions = ({ objectUrl, logger }) =>
       logger.error('getImageDimensions error', toLogFormat(error));
       reject(error);
     });
-
-    image.src = objectUrl;
+    fse.readFile(objectUrl).then(buffer => {
+      AttachmentTS.decryptAttachmentBuffer(toArrayBuffer(buffer)).then(
+        decryptedData => {
+          //FIXME image/jpeg is hard coded
+          const srcData = `data:image/jpg;base64,${window.libsession.Utils.StringUtils.fromArrayBufferToBase64(
+            toArrayBuffer(decryptedData)
+          )}`;
+          image.src = srcData;
+        }
+      );
+    });
   });
 
 exports.makeImageThumbnail = ({
@@ -70,7 +85,17 @@ exports.makeImageThumbnail = ({
       reject(error);
     });
 
-    image.src = objectUrl;
+    fse.readFile(objectUrl).then(buffer => {
+      AttachmentTS.decryptAttachmentBuffer(toArrayBuffer(buffer)).then(
+        decryptedData => {
+          //FIXME image/jpeg is hard coded
+          const srcData = `data:image/jpg;base64,${window.libsession.Utils.StringUtils.fromArrayBufferToBase64(
+            toArrayBuffer(decryptedData)
+          )}`;
+          image.src = srcData;
+        }
+      );
+    });
   });
 
 exports.makeVideoScreenshot = ({

ts/components/conversation/Image.tsx

@@ -4,8 +4,11 @@ import classNames from 'classnames';
 import { Spinner } from '../Spinner';
 import { LocalizerType } from '../../types/Util';
 import { AttachmentType } from '../../types/Attachment';
+import { useEncryptedFileFetch } from '../../hooks/useEncryptedFileFetch';
+import { fromArrayBufferToBase64 } from '../../session/utils/String';
+import toArrayBuffer from 'to-arraybuffer';
 
-interface Props {
+type Props = {
   alt: string;
   attachment: AttachmentType;
   url: string;
@@ -32,11 +35,10 @@ interface Props {
   onClick?: (attachment: AttachmentType) => void;
   onClickClose?: (attachment: AttachmentType) => void;
   onError?: () => void;
-}
+};
 
-export class Image extends React.Component<Props> {
+export const Image = (props: Props) => {
   // tslint:disable-next-line max-func-body-length cyclomatic-complexity
-  public render() {
   const {
     alt,
     attachment,
@@ -58,12 +60,20 @@ export class Image extends React.Component<Props> {
     softCorners,
     url,
     width,
-    } = this.props;
+  } = props;
 
   const { caption, pending } = attachment || { caption: null, pending: true };
   const canClick = onClick && !pending;
   const role = canClick ? 'button' : undefined;
 
+  const { loading, data } = useEncryptedFileFetch(url);
+  //FIXME jpg is hardcoded
+  const srcData = !loading
+    ? data?.length
+      ? `data:image/jpg;base64,${fromArrayBufferToBase64(toArrayBuffer(data))}`
+      : url
+    : '';
+
   return (
     <div
       role={role}
@@ -84,7 +94,7 @@ export class Image extends React.Component<Props> {
         softCorners ? 'module-image--soft-corners' : null
       )}
     >
-        {pending ? (
+      {pending || loading ? (
         <div
           className="module-image__loading-placeholder"
           style={{
@@ -93,7 +103,6 @@ export class Image extends React.Component<Props> {
             lineHeight: `${height}px`,
             textAlign: 'center',
           }}
-            // alt={i18n('loading')}
         >
           <Spinner size="normal" />
         </div>
@@ -104,7 +113,7 @@ export class Image extends React.Component<Props> {
           alt={alt}
           height={height}
           width={width}
-            src={url}
+          src={srcData}
         />
       )}
       {caption ? (
@@ -147,7 +156,7 @@ export class Image extends React.Component<Props> {
           )}
         />
       ) : null}
-        {!pending && playIconOverlay ? (
+      {!(pending || loading) && playIconOverlay ? (
         <div className="module-image__play-overlay__circle">
           <div className="module-image__play-overlay__icon" />
         </div>
@@ -162,5 +171,4 @@ export class Image extends React.Component<Props> {
       ) : null}
     </div>
   );
-  }
-}
+};

ts/hooks/to-arraybuffer.d.ts

@@ -0,0 +1 @@
+declare module 'to-arraybuffer';

ts/hooks/useEncryptedFileFetch.ts

@@ -0,0 +1,29 @@
+import { useEffect, useState } from 'react';
+import toArrayBuffer from 'to-arraybuffer';
+import * as fse from 'fs-extra';
+import { decryptAttachmentBuffer } from '../types/Attachment';
+
+export const useEncryptedFileFetch = (url: string) => {
+  // tslint:disable-next-line: no-bitwise
+  const [data, setData] = useState(new Uint8Array());
+  const [loading, setLoading] = useState(true);
+
+  async function fetchUrl() {
+    // this is a file encoded by session
+    //FIXME find another way to know if the file in encrypted or not
+    // maybe rely on
+    if (url.includes('/attachments.noindex/')) {
+      const encryptedFileContent = await fse.readFile(url);
+      const decryptedContent = await decryptAttachmentBuffer(
+        toArrayBuffer(encryptedFileContent)
+      );
+      setData(decryptedContent);
+    }
+    setLoading(false);
+  }
+
+  useEffect(() => {
+    void fetchUrl();
+  }, [url]);
+  return { data, loading };
+};

ts/types/Attachment.ts

@@ -1,9 +1,8 @@
 import is from '@sindresorhus/is';
 import moment from 'moment';
-import { padStart } from 'lodash';
+import { isArrayBuffer, padStart } from 'lodash';
 
 import * as MIME from './MIME';
-import { arrayBufferToObjectURL } from '../util/arrayBufferToObjectURL';
 import { saveURLAsFile } from '../util/saveURLAsFile';
 import { SignalService } from '../protobuf';
 import {
@@ -11,6 +10,9 @@ import {
   isVideoTypeSupported,
 } from '../util/GoogleChrome';
 import { LocalizerType } from './Util';
+import { fromHexToArray, toHex } from '../session/utils/String';
+import { getSodium } from '../session/crypto';
+import { fromHex } from 'bytebuffer';
 
 const MAX_WIDTH = 300;
 const MAX_HEIGHT = MAX_WIDTH * 1.5;
@@ -416,3 +418,85 @@ export const getFileExtension = (
       return attachment.contentType.split('/')[1];
   }
 };
+let indexEncrypt = 0;
+
+export const encryptAttachmentBuffer = async (bufferIn: ArrayBuffer) => {
+  if (!isArrayBuffer(bufferIn)) {
+    throw new TypeError("'bufferIn' must be an array buffer");
+  }
+  const ourIndex = indexEncrypt;
+  indexEncrypt++;
+  console.time(`timer #*. encryptAttachmentBuffer ${ourIndex}`);
+
+  const uintArrayIn = new Uint8Array(bufferIn);
+  const sodium = await getSodium();
+
+  /* Shared secret key required to encrypt/decrypt the stream */
+  // const key = sodium.crypto_secretstream_xchacha20poly1305_keygen();
+
+  const key = fromHexToArray(
+    '0c5f7147b6d3239cbb5a418814cee1bfca2df5c94bffddf22ee37eea3ede972b'
+  );
+  console.warn('key', toHex(key));
+
+  /* Set up a new stream: initialize the state and create the header */
+  const {
+    state,
+    header,
+  } = sodium.crypto_secretstream_xchacha20poly1305_init_push(key);
+  console.warn('header', toHex(header));
+  /* Now, encrypt the buffer. */
+  const bufferOut = sodium.crypto_secretstream_xchacha20poly1305_push(
+    state,
+    uintArrayIn,
+    null,
+    sodium.crypto_secretstream_xchacha20poly1305_TAG_FINAL
+  );
+
+  const encryptedBufferWithHeader = new Uint8Array(
+    bufferOut.length + header.length
+  );
+  encryptedBufferWithHeader.set(header);
+  encryptedBufferWithHeader.set(bufferOut, header.length);
+  console.warn('bufferOut', toHex(encryptedBufferWithHeader));
+  console.timeEnd(`timer #*. encryptAttachmentBuffer ${ourIndex}`);
+
+  return { encryptedBufferWithHeader, header, key };
+};
+
+let indexDecrypt = 0;
+
+export const decryptAttachmentBuffer = async (
+  bufferIn: ArrayBuffer,
+  key: string = '0c5f7147b6d3239cbb5a418814cee1bfca2df5c94bffddf22ee37eea3ede972b'
+) => {
+  if (!isArrayBuffer(bufferIn)) {
+    throw new TypeError("'bufferIn' must be an array buffer");
+  }
+  const ourIndex = indexDecrypt;
+  indexDecrypt++;
+  console.time(`timer .*# decryptAttachmentBuffer ${ourIndex}`);
+  const sodium = await getSodium();
+
+  const header = new Uint8Array(
+    bufferIn.slice(0, sodium.crypto_secretstream_xchacha20poly1305_HEADERBYTES)
+  );
+  const encryptedBuffer = new Uint8Array(
+    bufferIn.slice(sodium.crypto_secretstream_xchacha20poly1305_HEADERBYTES)
+  );
+
+  /* Decrypt the stream: initializes the state, using the key and a header */
+  const state = sodium.crypto_secretstream_xchacha20poly1305_init_pull(
+    header,
+    fromHexToArray(key)
+  );
+  // what if ^ this call fail (? try to load as a unencrypted attachment?)
+
+  const messageTag = sodium.crypto_secretstream_xchacha20poly1305_pull(
+    state,
+    encryptedBuffer
+  );
+  console.timeEnd(`timer .*# decryptAttachmentBuffer ${ourIndex}`);
+
+  return messageTag.message;
+};