large-file.js

  1. /**
  2.  * @file Utilities for uploading and downloading files.
  3.  *
  4.  * @copyright 2015-2023 Tinode LLC.
  5.  */
  6. 'use strict';
  8. import CommError from './comm-error.js';
  9. import {
  10.   isUrlRelative,
  11.   jsonParseHelper
  12. } from './utils.js';
  14. let XHRProvider;
  16. /**
  17.  * @class LargeFileHelper - utilities for uploading and downloading files out of band.
  18.  * Don't instantiate this class directly. Use {Tinode.getLargeFileHelper} instead.
  19.  * @memberof Tinode
  20.  *
  21.  * @param {Tinode} tinode - the main Tinode object.
  22.  * @param {string} version - protocol version, i.e. '0'.
  23.  */
  24. export default class LargeFileHelper {
  25.   constructor(tinode, version) {
  26.     this._tinode = tinode;
  27.     this._version = version;
  29.     this._apiKey = tinode._apiKey;
  30.     this._authToken = tinode.getAuthToken();
  32.     // Ongoing requests.
  33.     this.xhr = [];
  34.   }
  36.   /**
  37.    * Start uploading the file to an endpoint at baseUrl.
  38.    *
  39.    * @memberof Tinode.LargeFileHelper#
  40.    *
  41.    * @param {string} baseUrl base URL of upload server.
  42.    * @param {File|Blob} data data to upload.
  43.    * @param {string} avatarFor topic name if the upload represents an avatar.
  44.    * @param {Callback} onProgress callback. Takes one {float} parameter 0..1
  45.    * @param {Callback} onSuccess callback. Called when the file is successfully uploaded.
  46.    * @param {Callback} onFailure callback. Called in case of a failure.
  47.    *
  48.    * @returns {Promise} resolved/rejected when the upload is completed/failed.
  49.    */
  50.   uploadWithBaseUrl(baseUrl, data, avatarFor, onProgress, onSuccess, onFailure) {
  51.     let url = `/v${this._version}/file/u/`;
  52.     if (baseUrl) {
  53.       let base = baseUrl;
  54.       if (base.endsWith('/')) {
  55.         // Removing trailing slash.
  56.         base = base.slice(0, -1);
  57.       }
  58.       if (base.startsWith('http://') || base.startsWith('https://')) {
  59.         url = base + url;
  60.       } else {
  61.         throw new Error(`Invalid base URL '${baseUrl}'`);
  62.       }
  63.     }
  65.     const instance = this;
  66.     const xhr = new XHRProvider();
  67.     this.xhr.push(xhr);
  69.     xhr.open('POST', url, true);
  70.     xhr.setRequestHeader('X-Tinode-APIKey', this._apiKey);
  71.     if (this._authToken) {
  72.       xhr.setRequestHeader('X-Tinode-Auth', `Token ${this._authToken.token}`);
  73.     }
  75.     let toResolve = null;
  76.     let toReject = null;
  78.     const result = new Promise((resolve, reject) => {
  79.       toResolve = resolve;
  80.       toReject = reject;
  81.     });
  83.     xhr.upload.onprogress = e => {
  84.       if (e.lengthComputable) {
  85.         if (onProgress) {
  86.           onProgress(e.loaded / e.total);
  87.         }
  88.         if (this.onProgress) {
  89.           this.onProgress(e.loaded / e.total);
  90.         }
  91.       }
  92.     };
  94.     xhr.onload = function() {
  95.       let pkt;
  96.       try {
  97.         pkt = JSON.parse(this.response, jsonParseHelper);
  98.       } catch (err) {
  99.         instance._tinode.logger("ERROR: Invalid server response in LargeFileHelper", this.response);
  100.         pkt = {
  101.           ctrl: {
  102.             code: this.status,
  103.             text: this.statusText
  104.           }
  105.         };
  106.       }
  108.       if (this.status >= 200 && this.status < 300) {
  109.         if (toResolve) {
  110.           toResolve(pkt.ctrl.params.url);
  111.         }
  112.         if (onSuccess) {
  113.           onSuccess(pkt.ctrl);
  114.         }
  115.       } else if (this.status >= 400) {
  116.         if (toReject) {
  117.           toReject(new CommError(pkt.ctrl.text, pkt.ctrl.code));
  118.         }
  119.         if (onFailure) {
  120.           onFailure(pkt.ctrl);
  121.         }
  122.       } else {
  123.         instance._tinode.logger("ERROR: Unexpected server response status", this.status, this.response);
  124.       }
  125.     };
  127.     xhr.onerror = function(e) {
  128.       if (toReject) {
  129.         toReject(e || new Error("failed"));
  130.       }
  131.       if (onFailure) {
  132.         onFailure(null);
  133.       }
  134.     };
  136.     xhr.onabort = function(e) {
  137.       if (toReject) {
  138.         toReject(new Error("upload cancelled by user"));
  139.       }
  140.       if (onFailure) {
  141.         onFailure(null);
  142.       }
  143.     };
  145.     try {
  146.       const form = new FormData();
  147.       form.append('file', data);
  148.       form.set('id', this._tinode.getNextUniqueId());
  149.       if (avatarFor) {
  150.         form.set('topic', avatarFor);
  151.       }
  152.       xhr.send(form);
  153.     } catch (err) {
  154.       if (toReject) {
  155.         toReject(err);
  156.       }
  157.       if (onFailure) {
  158.         onFailure(null);
  159.       }
  160.     }
  162.     return result;
  163.   }
  164.   /**
  165.    * Start uploading the file to default endpoint.
  166.    *
  167.    * @memberof Tinode.LargeFileHelper#
  168.    *
  169.    * @param {File|Blob} data to upload
  170.    * @param {string} avatarFor topic name if the upload represents an avatar.
  171.    * @param {Callback} onProgress callback. Takes one {float} parameter 0..1
  172.    * @param {Callback} onSuccess callback. Called when the file is successfully uploaded.
  173.    * @param {Callback} onFailure callback. Called in case of a failure.
  174.    *
  175.    * @returns {Promise} resolved/rejected when the upload is completed/failed.
  176.    */
  177.   upload(data, avatarFor, onProgress, onSuccess, onFailure) {
  178.     const baseUrl = (this._tinode._secure ? 'https://' : 'http://') + this._tinode._host;
  179.     return this.uploadWithBaseUrl(baseUrl, data, avatarFor, onProgress, onSuccess, onFailure);
  180.   }
  181.   /**
  182.    * Download the file from a given URL using GET request. This method works with the Tinode server only.
  183.    *
  184.    * @memberof Tinode.LargeFileHelper#
  185.    *
  186.    * @param {string} relativeUrl - URL to download the file from. Must be relative url, i.e. must not contain the host.
  187.    * @param {string=} filename - file name to use for the downloaded file.
  188.    *
  189.    * @returns {Promise} resolved/rejected when the download is completed/failed.
  190.    */
  191.   download(relativeUrl, filename, mimetype, onProgress, onError) {
  192.     if (!isUrlRelative(relativeUrl)) {
  193.       // As a security measure refuse to download from an absolute URL.
  194.       if (onError) {
  195.         onError(`The URL '${relativeUrl}' must be relative, not absolute`);
  196.       }
  197.       return;
  198.     }
  199.     if (!this._authToken) {
  200.       if (onError) {
  201.         onError("Must authenticate first");
  202.       }
  203.       return;
  204.     }
  205.     const instance = this;
  207.     const xhr = new XHRProvider();
  208.     this.xhr.push(xhr);
  210.     // Get data as blob (stored by the browser as a temporary file).
  211.     xhr.open('GET', relativeUrl, true);
  212.     xhr.setRequestHeader('X-Tinode-APIKey', this._apiKey);
  213.     xhr.setRequestHeader('X-Tinode-Auth', 'Token ' + this._authToken.token);
  214.     xhr.responseType = 'blob';
  216.     xhr.onprogress = function(e) {
  217.       if (onProgress) {
  218.         // Passing e.loaded instead of e.loaded/e.total because e.total
  219.         // is always 0 with gzip compression enabled by the server.
  220.         onProgress(e.loaded);
  221.       }
  222.     };
  224.     let toResolve = null;
  225.     let toReject = null;
  227.     const result = new Promise((resolve, reject) => {
  228.       toResolve = resolve;
  229.       toReject = reject;
  230.     });
  232.     // The blob needs to be saved as file. There is no known way to
  233.     // save the blob as file other than to fake a click on an <a href... download=...>.
  234.     xhr.onload = function() {
  235.       if (this.status == 200) {
  236.         const link = document.createElement('a');
  237.         // URL.createObjectURL is not available in non-browser environment. This call will fail.
  238.         link.href = window.URL.createObjectURL(new Blob([this.response], {
  239.           type: mimetype
  240.         }));
  241.         link.style.display = 'none';
  242.         link.setAttribute('download', filename);
  243.         document.body.appendChild(link);
  244.         link.click();
  245.         document.body.removeChild(link);
  246.         window.URL.revokeObjectURL(link.href);
  247.         if (toResolve) {
  248.           toResolve();
  249.         }
  250.       } else if (this.status >= 400 && toReject) {
  251.         // The this.responseText is undefined, must use this.response which is a blob.
  252.         // Need to convert this.response to JSON. The blob can only be accessed by the
  253.         // FileReader.
  254.         const reader = new FileReader();
  255.         reader.onload = function() {
  256.           try {
  257.             const pkt = JSON.parse(this.result, jsonParseHelper);
  258.             toReject(new CommError(pkt.ctrl.text, pkt.ctrl.code));
  259.           } catch (err) {
  260.             instance._tinode.logger("ERROR: Invalid server response in LargeFileHelper", this.result);
  261.             toReject(err);
  262.           }
  263.         };
  264.         reader.readAsText(this.response);
  265.       }
  266.     };
  268.     xhr.onerror = function(e) {
  269.       if (toReject) {
  270.         toReject(new Error("failed"));
  271.       }
  272.       if (onError) {
  273.         onError(e);
  274.       }
  275.     };
  277.     xhr.onabort = function() {
  278.       if (toReject) {
  279.         toReject(null);
  280.       }
  281.     };
  283.     try {
  284.       xhr.send();
  285.     } catch (err) {
  286.       if (toReject) {
  287.         toReject(err);
  288.       }
  289.       if (onError) {
  290.         onError(err);
  291.       }
  292.     }
  294.     return result;
  295.   }
  296.   /**
  297.    * Try to cancel all ongoing uploads or downloads.
  298.    * @memberof Tinode.LargeFileHelper#
  299.    */
  300.   cancel() {
  301.     this.xhr.forEach(req => {
  302.       if (req.readyState < 4) {
  303.         req.abort();
  304.       }
  305.     });
  306.   }
  307.   /**
  308.    * To use LargeFileHelper in a non browser context, supply XMLHttpRequest provider.
  309.    * @static
  310.    * @memberof LargeFileHelper
  311.    * @param xhrProvider XMLHttpRequest provider, e.g. for node <code>require('xhr')</code>.
  312.    */
  313.   static setNetworkProvider(xhrProvider) {
  314.     XHRProvider = xhrProvider;
  315.   }
  316. }