chrome.download + fix fb_storySaver

HoangTran0410 · HoangTran0410 · commit 3e062977cc25 · 2024-07-09T12:24:26.000+07:00
diff --git a/scripts/content-scripts/ufs_global.js b/scripts/content-scripts/ufs_global.js
@@ -143,6 +143,12 @@ function runInContentScript(fnPath, params) {
   });
 }
 function runInBackground(fnPath, params) {
+  if (typeof chrome?.runtime?.sendMessage == "function") {
+    return chrome.runtime.sendMessage({
+      action: "ufs-runInBackground",
+      data: { fnPath, params },
+    });
+  }
   return sendToContentScript("ufs-runInBackground", {
     fnPath,
     params,
@@ -165,15 +171,31 @@ async function fetchByPassOrigin(url, options = {}) {
 function getURL(filePath) {
   return runInContentScript("chrome.runtime.getURL", [filePath]);
 }
-function download(options) {
-  return runInBackground("chrome.downloads.download", [options]);
-}
 function trackEvent(scriptId) {
   return runInBackground("trackEvent", [scriptId]);
 }
 function waitForTabToLoad(tabId) {
   return runInBackground("utils.waitForTabToLoad", [tabId]);
 }
+
+// https://developer.chrome.com/docs/extensions/reference/api/downloads#type-DownloadOptions
+/**
+ * A function to trigger a download using chrome.downloads API.
+ *
+ * @param {Object} options - The options for the download operation.
+ * @param {string} options.url - The URL to download.
+ * @param {string} [options.body] - Post body.
+ * @param {{name: string, value: string}[]} [options.headers] - Extra HTTP headers to send with the request if the URL uses the HTTP[s] protocol. Each header is represented as a dictionary containing the keys name and either value or binaryValue, restricted to those allowed by XMLHttpRequest.
+ * @param {'GET'|'POST'} [options.method] - The HTTP method to use for the download.
+ * @param {string} [options.filename] - A file path relative to the Downloads directory to contain the downloaded file, possibly containing subdirectories.
+ * @param {string} [options.saveAs] - Use a file-chooser to allow the user to select a filename regardless of whether filename is set or already exists.
+ * @param {'uniquify'|'overwrite'|'prompt'} [options.conflictAction] - The action to take if filename already exists.
+ * @return {Promise<number>} - A promise that resolves to the ID of the created download.
+ */
+function download(options) {
+  return runInBackground("chrome.downloads.download", [options]);
+}
+
 // #endregion
 
 // #region DOM
@@ -1834,9 +1856,7 @@ function downloadBlob(blob, filename) {
   a.href = blobUrl;
   a.download = filename;
   a.style.display = "none";
-  document.body.appendChild(a);
   a.click();
-  document.body.removeChild(a);
   URL.revokeObjectURL(blobUrl);
 }
 // https://stackoverflow.com/a/15832662/11898496
@@ -1846,9 +1866,7 @@ function downloadURL(url, name) {
   link.target = "_blank";
   link.download = name;
   link.href = url;
-  document.body.appendChild(link);
   link.click();
-  document.body.removeChild(link);
 }
 function downloadData(data, filename, type = "text/plain") {
   let file = new Blob([data], { type: type });
diff --git a/scripts/douyin_downloadWachingVideo.js b/scripts/douyin_downloadWachingVideo.js
@@ -1,3 +1,5 @@
+import { UfsGlobal } from "./content-scripts/ufs_global.js";
+
 export default {
   icon: "https://www.douyin.com/favicon.ico",
   name: {
@@ -12,18 +14,10 @@ export default {
 
   popupScript: {
     onClick: async function () {
-      const { UfsGlobal } = await import("./content-scripts/ufs_global.js");
       const { runScriptInCurrentTab, showLoading } = await import(
         "./helpers/utils.js"
       );
 
-      // const {
-      //   downloadURL,
-      //   downloadBlob,
-      //   getBlobFromUrlWithProgress,
-      //   formatSize,
-      // } = UfsGlobal.Utils;
-
       const { closeLoading, setLoadingText } = showLoading(
         "Đang tìm video url..."
       );
@@ -36,21 +30,7 @@ export default {
         alert("Không tìm thấy video nào.");
       } else {
         setLoadingText("Đang tải video...");
-        // downloadURL(src, "douyin_video.mp4");
         window.open(src);
-        // const blob = await getBlobFromUrlWithProgress(
-        //   src,
-        //   ({ loaded, total, speed }) => {
-        //     const percent = ((loaded / total) * 100) | 0;
-        //     setLoadingText(
-        //       `Đang tải video...<br/>` +
-        //         `Vui lòng không tắt popup <br/>` +
-        //         `${formatSize(loaded)}/${formatSize(total)} (${percent}%)` +
-        //         ` - ${formatSize(speed)}/s`
-        //     );
-        //   }
-        // );
-        // await downloadBlob(blob, "douyin_video.mp4");
       }
       closeLoading();
     },
diff --git a/scripts/fb_downloadWatchingVideo.js b/scripts/fb_downloadWatchingVideo.js
@@ -29,15 +29,25 @@ export default {
       );
       try {
         let listVideoId = await shared.getListVideoIdInWebsite();
-        if (!listVideoId?.length > 0) throw Error("Không tìm thấy video");
+        if (!listVideoId?.length > 0) throw Error("Không tìm thấy video nào");
 
         setLoadingText("Đang lấy token dtsg...");
         let dtsg = await fb_videoDownloader.getDtsg();
 
+        let downloaded = 0;
         for (let videoId of listVideoId) {
           setLoadingText("Đang tìm video url...");
           let videoUrl = await fb_videoDownloader.getLinkFbVideo(videoId, dtsg);
-          if (videoUrl) UfsGlobal.Utils.downloadURL(videoUrl, "fb_video.mp4");
+          if (videoUrl) {
+            downloaded++;
+            UfsGlobal.Extension.download({
+              url: videoUrl,
+              filename: "fb_video.mp4",
+            });
+          }
+        }
+        if (downloaded === 0) {
+          alert("Không tìm thấy link video");
         }
       } catch (e) {
         alert("ERROR: " + e);
diff --git a/scripts/fb_storySaver.js b/scripts/fb_storySaver.js
@@ -11,7 +11,7 @@ export default {
     vi: "Tải facebook story / video bình luận bạn đang xem",
   },
 
-  contentScript: {
+  pageScript: {
     onClick: function () {
       // Source code extracted from: https://chrome.google.com/webstore/detail/story-saver/mafcolokinicfdmlidhaebadidhdehpk
 
@@ -22,45 +22,55 @@ export default {
         if (videos[i].offsetHeight === 0) continue;
         let reactKey = "";
         let keys = Object.keys(videos[i]);
-        for (let key of keys) {
-          if (key.indexOf("__reactFiber") != -1) {
-            reactKey = key.split("__reactFiber")[1];
+        for (let j = 0; j < keys.length; j++) {
+          if (keys[j].indexOf("__reactFiber") != -1) {
+            reactKey = keys[j].split("__reactFiber")[1];
             break;
           }
         }
         let storyUrl;
         try {
-          //prettier-ignore
-          storyUrl = videos[i].parentElement.parentElement.parentElement.parentElement['__reactProps' + reactKey].children[0].props.children.props.implementations[1].data.hdSrc;
+          storyUrl =
+            videos[i].parentElement.parentElement.parentElement.parentElement[
+              "__reactProps" + reactKey
+            ].children[0].props.children.props.implementations[1].data.hdSrc;
         } catch (e) {}
         if (storyUrl == null) {
           try {
-            //prettier-ignore
-            storyUrl = videos[i].parentElement.parentElement.parentElement.parentElement['__reactProps' + reactKey].children[0].props.children.props.implementations[1].data.sdSrc;
+            storyUrl =
+              videos[i].parentElement.parentElement.parentElement.parentElement[
+                "__reactProps" + reactKey
+              ].children[0].props.children.props.implementations[1].data.sdSrc;
           } catch (e) {}
         }
         if (storyUrl == null) {
           try {
-            //prettier-ignore
-            storyUrl = videos[i].parentElement.parentElement.parentElement.parentElement['__reactProps' + reactKey].children.props.children.props.implementations[1].data.hdSrc;
+            storyUrl =
+              videos[i].parentElement.parentElement.parentElement.parentElement[
+                "__reactProps" + reactKey
+              ].children.props.children.props.implementations[1].data.hdSrc;
           } catch (e) {}
         }
         if (storyUrl == null) {
           try {
-            //prettier-ignore
-            storyUrl = videos[i].parentElement.parentElement.parentElement.parentElement['__reactProps' + reactKey].children.props.children.props.implementations[1].data.sdSrc;
+            storyUrl =
+              videos[i].parentElement.parentElement.parentElement.parentElement[
+                "__reactProps" + reactKey
+              ].children.props.children.props.implementations[1].data.sdSrc;
           } catch (e) {}
         }
         if (storyUrl == null) {
           try {
-            //prettier-ignore
-            storyUrl = videos[i]['__reactFiber' + reactKey].return.stateNode.props.videoData.$1.hd_src;
+            storyUrl =
+              videos[i]["__reactFiber" + reactKey].return.stateNode.props
+                .videoData.$1.hd_src;
           } catch (e) {}
         }
         if (storyUrl == null) {
           try {
-            //prettier-ignore
-            storyUrl = videos[i]['__reactFiber' + reactKey].return.stateNode.props.videoData.$1.sd_src;
+            storyUrl =
+              videos[i]["__reactFiber" + reactKey].return.stateNode.props
+                .videoData.$1.sd_src;
           } catch (e) {}
         }
         if (storyUrl != null) {
@@ -69,16 +79,24 @@ export default {
       }
 
       let storyImgUrl = Array.from(
-        document.querySelectorAll('div[data-id] img[draggable="false"]')
+        document.querySelectorAll('img[draggable="false"]')
       ).find((_) => _.alt)?.src;
       if (storyImgUrl) {
         listUrls.push({ url: storyImgUrl, type: "img" });
       }
 
+      let profile_pic = document.querySelector(
+        "a[role=link][tabindex='0'][href*='https://www.facebook']>img"
+      );
+      let username = profile_pic?.alt || "fb_story";
+
       if (!listUrls.length) {
         alert("Không tìm thấy facebook story nào trong trang web.");
       } else if (listUrls.length === 1) {
-        UfsGlobal.Utils.downloadURL(listUrls[0].url, "fb_story_video.mp4");
+        UfsGlobal.Extension.download({
+          url: listUrls[0].url,
+          filename: username + (listUrls[0].type === "img" ? ".jpg" : ".mp4"),
+        });
       } else {
         let w = window.open("", "", "width=500,height=700");
         w.document.write(
diff --git a/scripts/screenshotFullPage.js b/scripts/screenshotFullPage.js
@@ -45,10 +45,10 @@ export default {
           console.log(img);
 
           setLoadingText("Đang lưu ảnh...");
-          UfsGlobal.Utils.downloadURL(
-            "data:image/png;base64," + img.data,
-            "fullpage.png"
-          );
+          UfsGlobal.Extension.download({
+            url: "data:image/png;base64," + img.data,
+            filename: "fullpage.png",
+          });
         }
         await detachDebugger(tab);
       } catch (e) {
diff --git a/scripts/screenshotVisiblePage.js b/scripts/screenshotVisiblePage.js
@@ -72,10 +72,10 @@ export default {
         console.log(img);
 
         setLoadingText("Đang lưu ảnh...");
-        UfsGlobal.Utils.downloadURL(
-          "data:image/png;base64," + img.data,
-          "webpage.png"
-        );
+        UfsGlobal.Extension.download({
+          url: "data:image/png;base64," + img.data,
+          filename: "webpage.png",
+        });
 
         await detachDebugger(tab);
       } catch (e) {
diff --git a/scripts/tiktok_downloadWatchingVideo.js b/scripts/tiktok_downloadWatchingVideo.js
@@ -84,8 +84,15 @@ export default {
         setLoadingText(
           t({ vi: `Đang tải video ${title}...`, en: `Downloading ${title}...` })
         );
-        const { formatSize, downloadBlob } = UfsGlobal.Utils;
-        const blob = await UfsGlobal.Utils.getBlobFromUrlWithProgress(
+
+        // UfsGlobal.Extension.download({
+        //   url: link,
+        //   filename: title + ".mp4",
+        // });
+
+        const { formatSize, downloadBlob, getBlobFromUrlWithProgress } =
+          UfsGlobal.Utils;
+        const blob = await getBlobFromUrlWithProgress(
           link,
           ({ loaded, total, speed }) => {
             let desc =
diff --git a/scripts/webToPDF.js b/scripts/webToPDF.js
@@ -33,11 +33,10 @@ export default {
         });
         await detachDebugger(tab);
 
-        // https://stackoverflow.com/a/59352848/11898496
-        UfsGlobal.Utils.downloadURL(
-          "data:application/pdf;base64," + res.data,
-          "web.pdf"
-        );
+        UfsGlobal.Extension.download({
+          url: "data:application/pdf;base64," + res.data,
+          filename: "web.pdf",
+        });
       } catch (e) {
         if (
           confirm(
diff --git a/working_note.md b/working_note.md
@@ -2,6 +2,8 @@
 
 ## 01/07/2024 - ?
 
+- [ ] hotfix - use chrome.downloads instead of library
+
 - [x] get fb profile pic <https://www.facebook.com/profile/pic.php?cuid={}&square_px=1000> -> dont know now cuid was generated
 
 - [x] find fb account using phone or email <https://www.facebook.com/login/web/?email={phone_or_email}> -> too hard, fb not always show user's avatar/name
