Introduce Automa

Automa is a Chrome plugin that allows you to automate everything you want, even if you don’t know how to write code. With it, you can automate some repetitive tasks, and it can take interface screenshots, use CSS Selector, Xpath to grab website data, set Proxy, conditions, submit forms, call Webhook, and can customize the time to perform tasks, etc.

Automa installation

If you are a development enthusiast, you can open the Automa project address, clone the project source, project address:

https://github.com/kholid060/automa
Copy the code

The download address of the plug-in is :(if you can not open it, there is a way to obtain it at the end of the article)

https://chrome.google.com/webstore/detail/automa/infppggnoaenmfagbfknfkancpbljcca/
Copy the code

Once installed, you can automate the extension of your browser by connecting blocks. What you want to do with this extension is up to you, from auto-filling forms, performing repetitive tasks, capturing screen shots, to grabbing web site data.

Objective of this paper

The goal of this article is through the Web end automation artifact, low code, automatic batch download the cover of the beautiful little sister of the network, for your appreciation, so that even if you do not have the programming foundation can also be imported here through the data, the process will run.

At the end of this article, I will inform you of the data acquisition method of the whole workflow for your reference.

Automatic search

Open site automatically: StackOverflow

The first Trigger block can be triggered manually, by specifying the week, by specifying the date and time, and by shortcut keys. The second block, NewTab, opens the Google site; In the third Forms block, navigate to the input box using an accessibility tool and type Stackoverflow; The fourth Click block locates the search button and clicks search

Realize automatic search function.

Custom data download

NewTab opens the following page, which is ready for download.

https://img.keaitupian.cn/uploads/*.jpg
Copy the code

Note: Because the home page of the website:

https://www.keaitupian.cn/
Copy the code

It is not the same domain name as img.keaitupian.cn, so there will be cross-domain problems, so open the image domain page and perform the JS action to download the image.

The LoopData LoopID is one (to be used later to terminate the loop), use CustomData, and insert Json data as follows:

[{"column": "https://img.keaitupian.cn/newupload/11/1637224362487977.jpg"
  },
  {
    "column": "https://img.keaitupian.cn/newupload/11/1636795162640425.jpg"}]Copy the code

JavaScriptCode block to download the image from the previous loopData block, which is referenced by prevBlockData, and then download the image: [

] (github.com/Kholid060/a…).

const url = automaRefData('prevBlockData'.' ')
//alert(url.column)
var x=new XMLHttpRequest();
// Need to open the img.keaitupian.cn website in the previous quick to solve the cross-domain problem
x.open("GET", url.column, true);
x.responseType = 'blob';
x.onload=function(e){
    var url = window.URL.createObjectURL(x.response)
    var a = document.createElement('a');
    a.href = url
    a.download = ' '
    a.click()
}
x.send();
Copy the code

The LoopBreakpoint block is used to terminate the LoopData loop by filling in LoopID: one above

Bulk download beauty cover

Workflow screenshot:

Tigger trigger mode is manual trigger. The loopID of LoopData is one, and the LoopData is Numbers from 1 to 119. This value is derived from the href value of the button on the last page:

NewTab will loop through each page and enter:

https://www.keaitupian.cn/meinv/list_4_{{ loopData@one}}.html
Copy the code

loopData@one retrieves the item whose loopID is one.

AttributeValue gets the value of the IMG attribute SRC in each pageSo CSSSelector.related_box a img

Select: Multiple to get all SRC classes under the related_box subtag.

Select Save Data. The storage key name is fengmianURL and the type is Array.

This ensures that subsequent loops can retrieve the data.

NewTab opens the img domain page to prevent cross-domain.

https://img.keaitupian.cn/newupload/11/1637224362487977.jpg
Copy the code

The loopID of LoopData is two, and the data source is DataColumns, which is the data from the Above AttributeValue block Save. Each time the loop gets a key. We saved only one key above: fengmianURL

JavaScriptCode block:

function download(url) {
  var x=new XMLHttpRequest();
    // You need to open img.keaitupian.cn in the previous flow to solve the cross-domain problem
    x.open("GET", url, true);
    x.responseType = 'blob';
    x.onload=function(e){
        var url = window.URL.createObjectURL(x.response)
        var a = document.createElement('a');
        a.href = url
        a.download = ' '
        a.click()
    }
    x.send();
}

const datas = automaRefData('prevBlockData'.' ')
// The format is: https://img.keaitupian.cn/newupload/11/1637224362487977.jpg,https://img.keaitupian.cn/newupload/11/1636795162640425.jpg
for (var i=0; i<datas.fengmianurl.length; i++)
{
    var url = datas.fengmianurl[i]
    console.log(url)
    
    if (url.indexOf("https://img.keaitupian.cn") != 0) 
    {
      continue
    }
    
    download(url)
}
Copy the code

We passed:

automaRefData('prevBlockData', '')
Copy the code

Get the output from the previous block and assign it to the datAS. Retrieve the array fengmianURL from datas, traverse it, and download the image address.

LoopBreakpoint Ends the loopData block whose loopID is two. The first CloseTab closes the IMG image domain page.

The second CloseTab loop closes each page.

The last LoopBreakpoint terminates the loopData block whose loopID is one.

Achieved effect

Taste the downloaded pictures

conclusion

For readers with zero code base, Automa is still friendly and easy to get started. The functions provided by Automa can basically meet the requirements of simple daily automation operations in Web browsers. For complex front-end automation scenarios, JavaScript can also be added to the workflow to complete them.

Of course, if you’re a hobbyist, scripting is recommended, but some of the design ideas behind Automa can be useful in real-world scenarios. It’s up to you.

I set up a wechat communication group, plug-in access method, communication within the group play, you can follow the public account reply [automa] to get and group communication.

reference

Github.com/Kholid060/a…

Github.com/Kholid060/a…

Github.com/Kholid060/a…

This article is the code farming actual combat original works, welcome to pay attention to “my small bowl of soup” public number, QQ group: 643418444

The original link: blog.csdn.net/ll837448792…

The author is simple

Author: Xiaowantang, a passionate and serious writer, currently maintains the original public account “My Xiaowantang”, focusing on writing the go language, Docker, Kubernetes, Java and other development, operation and maintenance knowledge to enhance the hard power of the article, looking forward to your attention. Note: Be sure to specify the source (note: from the official account: My Small bowl of soup, author: Small bowl of soup)