java+selenium爬取圖片簽名

java+selenium爬取圖片簽名

學習記錄:
1.注意
對應的版本非常重要,使用selenium得下載與遊覽器版本相對應的插件,有火狐和谷歌我用的谷歌,貼下谷歌driver的插件:http://npm.taobao.org/mirrors/chromedriver/
查看谷歌版本:
在這裏插入圖片描述
2.插件存放路徑
在這裏插入圖片描述
3.獲取簽名圖片存放路徑
在這裏插入圖片描述
4.Controller代碼如下

 @ResponseBody
    @RequestMapping(value = "signatureGenerationv")
    public String signatureGeneration(String userName, HttpServletRequest request) throws Exception{
        System.setProperty("webdriver.chrome.driver", ".\\Tools\\chromedriver.exe");
        //初始化一個谷歌瀏覽器實例,實例名稱叫driver
        WebDriver driver = new ChromeDriver();
        // get()打開一個站點
        driver.get("https://www.yishuzi.cn/qianming/");
        //簽名
        driver.findElement(By.xpath("//*[@id=\"text\"]")).clear();
        driver.findElement(By.xpath("//*[@id=\"text\"]")).sendKeys(userName);
        //簽名配色
        driver.findElement(By.xpath("//*[@id=\"index\"]/div[1]/div/div[4]/div[2]/div/div[7]/div/div/p[2]/a[2]")).click();
        //最大化窗口
        driver.manage().window().maximize();
        Thread.sleep(2000);
        WebElement webElement = driver.findElement(By.xpath("//*[@id=\"SaveImg\"]"));
        //生成簽名圖片,裁剪圖片
        byte[] imageData = BrowserUtil.captureElement(webElement);
        //設置隱性等待時間
        driver.manage().timeouts().implicitlyWait(8, TimeUnit.SECONDS);
        //getTitle()獲取當前頁面title的值
        System.out.println("當前打開頁面的標題是: "+ driver.getTitle());
        //關閉並退出瀏覽器
        driver.quit();
        //把圖片轉換成能夠在頁面直接展示的BASE64Encoder格式
        BASE64Encoder base64Encoder = new BASE64Encoder();
        String img =  base64Encoder.encode(imageData);
        return  img;
        }

5.BrowserUtil工具類代碼

public static byte[] captureElement(WebElement element) throws Exception {
        WrapsDriver wrapsDriver = (WrapsDriver) element;
        // 截圖整個頁面
        byte[] screen = ((TakesScreenshot) wrapsDriver.getWrappedDriver()).getScreenshotAs(OutputType.BYTES);

        ByteArrayOutputStream out = new ByteArrayOutputStream();
        try {
            BufferedImage img = ImageIO.read(new ByteArrayInputStream(screen));
            ImageIO.write(img, "png", new File("img/imgs/img"+System.currentTimeMillis()+".png"));

            // 獲得元素的高度和寬度
            int width = element.getSize().getWidth();
            int height = element.getSize().getHeight();
            // 創建一個矩形使用上面的高度,和寬度
            java.awt.Rectangle rect = new java.awt.Rectangle(width, height);
            // 得到元素的座標
            Point p = element.getLocation();

            float rate = img.getWidth()/1280;
            BufferedImage dest = img.getSubimage(
                    (int)(p.getX()*rate),
                    (int)(p.getY()*rate),
                    (int)(rect.width*rate),(int)(rect.height*rate));
            ImageIO.write(dest, "png", new File("img/"+System.currentTimeMillis()+".png"));
            boolean flag = ImageIO.write(dest, "png", out);
            byte[] imageData = out.toByteArray();
            return imageData;
        } finally {
            out.close();
        }
    }

6.index.html代碼

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>簽名生成</title>
    <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
</head>
<body>
<div>
    請輸入名字:<input type="text" id="userName" name="userName"><input type="button" id="btn" value="生成">
    <!--<img id="img" src="">-->
    <div id="img"></div>
</div>
<script>

        $("#btn").click(function () {
            var userName = $("#userName").val();
            $.ajax({
                url : "signatureGenerationv",
                type : "post",
                // dataType :"string",
                data :{'userName':userName},
                success : function(data) {
                   data = data.replace(/\\n/g,'\n')//去換行
                    var str = data.substring(0,data.length)
                    var base = "data:image/png;base64,"+str;
                    var img = new Image();//創建img容器
                    img.src = base;
                    document.body.appendChild(img);
                },
                error : function(data) {
                    alert("失敗"+data.responseText)
                }
            })
        })



</script>
</body>
</html>

7.結果圖
在這裏插入圖片描述
8.pom包

<!--selenium依賴文件-->
        <!-- https://mvnrepository.com/artifact/org.seleniumhq.selenium/selenium-java -->
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-java</artifactId>
            <version>3.8.1</version>
        </dependency>
        <!-- https://mvnrepository.com/artifact/org.seleniumhq.selenium/selenium-server -->
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-server</artifactId>
            <version>3.8.1</version>
        </dependency>
        <!-- https://mvnrepository.com/artifact/org.seleniumhq.selenium/selenium-chrome-driver -->
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-chrome-driver</artifactId>
            <version>3.8.1</version>
        </dependency>
        <!-- https://mvnrepository.com/artifact/org.seleniumhq.selenium/selenium-chrome-driver -->
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-chrome-driver</artifactId>
            <version>3.8.1</version>
        </dependency>
        <dependency>
            <groupId>org.seleniumhq.selenium</groupId>
            <artifactId>selenium-htmlunit-driver</artifactId>
            <version>2.52.0</version>
        </dependency>
        <dependency>
            <groupId>com.google.code.gson</groupId>
            <artifactId>gson</artifactId>
            <version>2.8.5</version>
        </dependency>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章