Tampermonkey油猴 跨域请求下载图片示例

Tampermonkey油猴 跨域请求下载图片示例

  • 前言
  • 项目
    • 目标网站
    • 代码编写
  • 运行效果

前言

需要用油猴采集并下载一个网站的图片,直接下下不了,搜了一下,是禁止跨域,使用CORS Unblock也不行,所以使用油猴自带的GM_xmlhttpRequest发送跨域请求。

项目

目标网站

目标网站

代码编写

代码仅作为学习使用,禁止商用。

// ==UserScript==
// @name         ***** Image Downloader and Zipper with GM_xmlhttpRequest
// @namespace    http://tampermonkey.net/
// @version      1.7
// @description  Download all matching product images as a zip file from the **** product page using GM_xmlhttpRequest (For learning purposes only)
// @author       slowfeather@163.com
// @match        
// @icon         
// @grant        GM_xmlhttpRequest
// @grant        GM_download
// @require      https://cdnjs.cloudflare.com/ajax/libs/jszip/3.7.1/jszip.min.js
// @require      https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2.0.5/FileSaver.min.js
// ==/UserScript==

(function() {
    'use strict';

    // List to store image URLs
    let imageUrls = new Set();

    // Function to periodically collect image URLs
    function collectImageUrls() {
        const imageElements = document.querySelectorAll('img');
        const regex1 = /*****\.com\/package-screenshot\/.+?_scaled\.jpg$/;
        const regex2 = /*****\.****\.com\/key-image\/.+?\.jpg$/;

        imageElements.forEach((img) => {
            const url = img.src;
            if ((regex1.test(url) || regex2.test(url)) && !imageUrls.has(url)) {
                imageUrls.add(url);
                showNotification('捕获了一张图片地址 :'+url);
            }
        });
    }

    // Function to show notification
    function showNotification(message) {
        const notification = document.createElement('div');
        notification.innerText = message;
        notification.style.position = 'fixed';
        notification.style.top = '50px';
        notification.style.right = '10px';
        notification.style.zIndex = 1000;
        notification.style.backgroundColor = 'lightgreen';
        notification.style.padding = '5px';
        notification.style.border = '1px solid green';
        notification.style.borderRadius = '5px';
        document.body.appendChild(notification);

        setTimeout(() => {
            document.body.removeChild(notification);
        }, 1000);
    }

    // Set an interval to collect image URLs every second
    setInterval(collectImageUrls, 300);

    // Function to download all images in the list and zip them
    async function downloadAndZipImages() {
        const zip = new JSZip();
        let count = 0;

        const fetchImage = (url, filename) => {
            return new Promise((resolve, reject) => {
                GM_xmlhttpRequest({
                    method: 'GET',
                    url: url,
                    responseType: 'blob',
                    onload: function(response) {
                        if (response.status === 200) {
                            zip.file(filename, response.response);
                            count++;
                            resolve();
                        } else {
                            reject(`HTTP error! status: ${response.status}`);
                        }
                    },
                    onerror: function(error) {
                        reject(`Failed to fetch image ${url}: ${error}`);
                    }
                });
            });
        };

        const fetchPromises = Array.from(imageUrls).map((url, index) => {
            const filename = `image_${index + 1}.jpg`;
            return fetchImage(url, filename);
        });

        try {
            await Promise.all(fetchPromises);
            if (count > 0) {
                const content = await zip.generateAsync({ type: "blob" });
                saveAs(content, "images.zip");
            } else {
                alert("No matching images found.");
            }
        } catch (error) {
            console.error(error);
        }
    }

    // Wait for the page to fully load
    window.addEventListener('load', () => {
        // Create a button to trigger the download
        const button = document.createElement('button');
        button.innerText = 'Download All Images as Zip';
        button.style.position = 'fixed';
        button.style.top = '10px';
        button.style.right = '10px';
        button.style.zIndex = 1000;
        button.addEventListener('click', downloadAndZipImages);
        document.body.appendChild(button);
    });
})();

运行效果

成功捕获图片
下载图片

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/733366.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

The First项目报告:解读互链操作协议LayerZero

随着 DeFi 项目的兴起,跨链互操作性成为区块链领域的热门话题,在众多的跨链平台中,Layer Zero 凭借其创新技术和设计备受关注,近期Layer Zero发布代币空投方案,引发社区热议,随着其代币上线The First平台&a…

【STM32入门学习】学习嵌入式实时操作系统(RTOS)移植uc/OS到stm32F103上

目录 一、建立STM32HAL库工程 1.1实时操作系统 1.2基于HAL库创建工程 二、获取uC/OS-III源码 三、移植准备 3.1复制uC/OS-III文件到工程文件夹 3.2添加工程组件和头文件路径 四、移植修改代码 4.1.启动文件修改: 4.2.app_cfg.h &a…

【数据结构】线性表之《栈》超详细实现

栈 一.栈的概念及结构二.顺序栈与链栈1.顺序栈2.链栈1.单链表栈2.双链表栈 三.顺序栈的实现1.栈的初始化2.检查栈的容量3.入栈4.出栈5.获取栈顶元素6.栈的大小7.栈的判空8.栈的清空9.栈的销毁 四.模块化源代码1.Stack.h2.Stack.c3.test.c 一.栈的概念及结构 栈:一种…

Azure vs. AssemblyAI:深度解析语音转文本服务的对决

在技术飞速发展的今天,API已成为连接不同软件和服务的关键桥梁。对于需要语音转文本功能的应用,我们对比了两个广受欢迎的API接口:Azure 语音转文本和AssemblyAI AI语音转文本。 Azure 语音转文本 Azure 语音转文本提供快速、准确的语音转文本…

ArrayList知识点(面试)

上一篇我们说了hashmap的相关知识点,这一篇我们再说一些ArrayList的相关知识,因为ArrayList也是我们项目中比较常用的。 ArrayList(底层是数组) 底层工作原理 首先,在构造ArrayList的时候会先看有没有指定容量,如果没有&#xf…

音视频开发29 FFmpeg 音频编码- 流程以及重要API,该章节使用AAC编码说明

此章节的一些参数,需要先掌握aac的一些基本知识:​​​​​​aac音视频开发13 FFmpeg 音频 --- 常用音频格式AAC,AAC编码器, AAC ADTS格式 。_ffmpeg aac data数据格式-CSDN博客 目的: 从本地⽂件读取PCM数据进⾏AAC格…

FL论文专栏|设备异构、异步联邦

论文:Asynchronous Federated Optimization(12th Annual Workshop on Optimization for Machine Learning) 链接 实现Server的异步更新。每次Server广播全局Model的时候附带一个时间戳,Client跑完之后上传将时间戳和Model同时带回…

【办公类-50-01】20240620自主游戏观察记录表19周内容打乱

背景需求: 又到了期末,各种班级资料需要提交。 有一份自主游戏观察记录需要写19周(每周2次)的观察记录,并根据参考书填写一级、三级、五级的评价指标。 去年中六班的时候,我很认真的手写了21周的户外游戏…

基于CST的连续域束缚态(BIC)设计与机制研究

关键词:太赫兹,超表面,连续域束缚态,CST,高Q 束缚态的概念最先出现于量子力学中,当粒子被势场约束在特定的区域内运动,即在无限远处波函数等于零的态叫束缚态,例如势阱中的粒子就处…

Map集合之HashMap细说

最近在看面试题,看到了hashmap相关的知识,面试中问的也挺多的,然后我这里记录下来,供大家学习。 Hashmap为什么线程不安全 jdk 1.7中,在扩容的时候因为使用头插法导致链表需要倒转,从而可能出现循环链表问…

百度ai人脸识别项目C#

一、项目描述 本项目通过集成百度AI人脸识别API,实现了人脸检测和识别功能。用户可以上传图片,系统将自动识别人脸并返回识别结果。 二、开发环境 Visual Studio 2019或更高版本.NET Framework 4.7.2或更高版本AForge.NET库百度AI平台人脸识别API 三、…

Django 模版变量

1,模版变量作用 模板变量使用“{{ 变量名 }}” 来表示模板变量前后可以有空格,模板变量名称,可以由数字,字母,下划线组成,不能包含空格模板变量还支持列表,字典,对象 2,…

一文搞懂Linux信号【下】

目录 🚩引言 🚩阻塞信号 🚩信号保存 🚩信号捕捉 🚩操作信号集 1.信号集操作函数 2.其它操作函数 🚩总结: 🚩引言 在观看本博客之前,建议大家先看一文搞懂Linux信…

React hydrateRoot如何实现

React 服务器渲染中,hydrateRoot 是核心,它将服务器段的渲染与客户端的交互绑定在一起,我们知道 React 中 Fiber Tree 是渲染的的核心,那么 React 是怎么实现 hydrateRoot 的呢?首先我们验证一下,hydrateRo…

期货交易豆粕品种详细分析

文章目录 1、豆粕期货标准(2024年6月22号数据)2、豆粕是什么3、豆粕1、5、9合约区别4、影响豆粕的价格因素1、大豆的供应情况。2、豆粕的季节性3、油粕比(豆油和豆粕的价格关系 ) 5、美国大豆的生产/库存炒作6、豆粕双方&#xff…

uniapp实现路由拦截——遇到问题(三)

uniapp路由拦截开发过程中遇到问题 文章目录 uniapp路由拦截开发过程中遇到问题App 无法退出应用监听返回数据结构解决方式模拟原生物理返回键提示不提示,直接退出应用 微信小程序 登录成功返回页面报错效果图不同平台来源页面数据结构解决方式 App 无法退出应用 安…

2005年上半年软件设计师【上午题】试题及答案

文章目录 2005年上半年软件设计师上午题--试题2005年上半年软件设计师上午题--答案2005年上半年软件设计师上午题–试题

C++/Qt 小知识记录7

工作中遇到的一些小问题,总结的小知识记录:C/Qt 小知识7 编译FFMPEG遇到的问题CMakeLists.txt配置FFMPEG的依赖方式: x264在Windows下编译生成*.libVS编译Qt工程时,遇到提示Change Qt Version的情况在QtOsg的窗口上嵌入子窗口&…

面试官:请你实现三栏布局并且优先加载中间内容 我:稳啦- ̗̀(๑ᵔ⌔ᵔ๑)

前言 三栏布局是网页设计中一种经典布局方式,它将页面分为三个垂直部分:左栏、中栏和右栏,三栏在同一行显示。 这种布局模式在很多网站的首页或内容密集型页面中非常常见,因为它能够有效地组织信息,提供良好的用户体…

【产品应用】一体化步进伺服电机在吊装机器人中的应用

随着工业自动化和智能制造的发展,吊挂式智能巡检机器人逐渐成为许多工业场景中的重要角色。这类机器人不仅能够提升工作效率,减少人工干预,还能在复杂或危险环境中完成巡检任务。在这些机器人的设计与制造中,一体化步进伺服电机扮…