调整

public/js/download.js

@@ -1,3 +1,8 @@
+function matchSheinDomain(url) {
+    const urlPattern = /https:\/\/([\da-z\.-]+)\.shein\.com\/([\S.-]+)-p-([\S.-]+)/
+    return urlPattern.test(url);
+}
+
 function init() {
     if (window.location.href.startsWith('https://www.aliexpress.com/item/')) {
         const popup = document.createElement("div")
@@ -187,6 +192,111 @@ function init() {
             })
             document.body.appendChild(popup)
         }
+    } else if (matchSheinDomain(window.location.href)) {
+        const popup = document.createElement("div")
+        popup.innerText = "下载图片"
+        const styles = {
+            position: "fixed",
+            right: '10px',
+            top: '60px',
+            zIndex: 9999,
+            padding: "8px",
+            background: "#409EFF",
+            color: "#fff",
+            borderRadius: "8px",
+            cursor: "pointer"
+        }
+        for (const e in styles) {
+            popup.style[e] = styles[e]
+        }
+        
+        popup.addEventListener('click', async () => {
+            var baseList = [];
+            var downloadList = []
+
+            let bannerIdx = 1, detailIdx = 1
+            baseList.push({type: 0, index: bannerIdx++, src: window.gbRawData.productIntroData.goods_imgs.main_image.origin_image})
+            var detailImages = window.gbRawData.productIntroData.goods_imgs.detail_image
+
+            for (var i = 0; i < detailImages.length; i++) {
+                if (!(detailImages[i].isMoreDetail)) {
+                    baseList.push({type: 0, index: bannerIdx++, src: detailImages[i].origin_image})
+                } else {
+                    baseList.push({type: 1, index: detailIdx++, src: detailImages[i].origin_image})
+                }
+            }
+
+            var video = document.querySelector('video')
+            if (window.gbRawData.productIntroData.goods_imgs.video_url) {
+                baseList.push({type: 2, index: 1, src: window.gbRawData.productIntroData.goods_imgs.video_url})
+            }
+
+            var zip = new JSZip();
+            var imgsBanner = zip.folder("轮播图");
+            var imgsDetail = zip.folder("详情图");
+            var videos = zip.folder("视频");
+
+            for (var k = 0; k < baseList.length; k++) {
+                let type = baseList[k].type
+                let index = baseList[k].index
+                if (type == 2) {
+                    let x = new XMLHttpRequest()
+                    x.open('GET', baseList[k].src, true)
+                    x.responseType = 'blob'
+                    x.onload = (e) => {
+                        downloadList.push({type: type, index: index, data: x.response});
+                        if (downloadList.length === baseList.length && downloadList.length > 0) {
+                            for (let l = 0; l < downloadList.length; l++) {
+                                if (downloadList[l].type == '0') {
+                                    imgsDetail.file(`详情图${downloadList[l].index}.png`, downloadList[l].data, { base64: true });
+                                } else if (downloadList[l].type == '1') {
+                                    imgsBanner.file(`轮播图${downloadList[l].index}.png`, downloadList[l].data, { base64: true });
+                                } else if (downloadList[l].type == '2') {
+                                    videos.file(`视频.mp4`, downloadList[l].data, { Blob: true });
+                                }
+                            }
+                            zip.generateAsync({ type: "blob" }).then(function (content) {
+                              // see FileSaver.js
+                              saveAs(content, "shein_" + id + ".zip");
+                            });
+                        }
+                    }
+                    x.send()
+                } else {
+                    let image = new Image();
+                    // 解决跨域 Canvas 污染问题
+                    image.setAttribute("crossOrigin", "anonymous");
+                    image.onload = function () {
+                      let canvas = document.createElement("canvas");
+                      canvas.width = image.width;
+                      canvas.height = image.height;
+                      let context = canvas.getContext("2d");
+                      context.drawImage(image, 0, 0, image.width, image.height);
+                      let url = canvas.toDataURL(); // 得到图片的base64编码数据
+                      canvas.toDataURL("image/png");
+                      downloadList.push({type: type, index: index, data: url.substring(22)}); // 去掉base64编码前的     data:image/png;base64,
+                      if (downloadList.length === baseList.length && downloadList.length > 0) {
+                        for (let l = 0; l < downloadList.length; l++) {
+                            if (downloadList[l].type == '0') {
+                                imgsDetail.file(`详情图${downloadList[l].index}.png`, downloadList[l].data, { base64: true });
+                            } else if (downloadList[l].type == '1') {
+                                imgsBanner.file(`轮播图${downloadList[l].index}.png`, downloadList[l].data, { base64: true });
+                            }  else if (downloadList[l].type == '2') {
+                                videos.file(`视频.mp4`, downloadList[l].data, { Blob: true });
+                            }
+                        }
+                        zip.generateAsync({ type: "blob" }).then(function (content) {
+                          // see FileSaver.js
+                          saveAs(content, "shein_" + id + ".zip");
+                        });
+                      }
+                    };
+                    image.src = baseList[k].src;
+                }
+              }
+        })
+        document.body.appendChild(popup)
+        
     }
 }