Come and have a look at the live wallpaper in The Genki wallpaper gallery

Small knowledge, big challenge! This article is participating in the creation activity of “Essential Tips for Programmers”

This article has participated in the “Digitalstar Project” and won a creative gift package to challenge the creative incentive money.

Recently, lively wallpaper has been installed on my computer, so I can run the dynamic wallpaper. Hard work pays off (I don’t know how I found it), yuqi wallpaper is not the threshold of resources, as long as you go to see it? Resource direct plaintext path pull and run, too

Dynamic resources of Yuanqi wallpaper

However, when using found a pain in the details, resources only loaded the first screen a total of 24?? Debug requests found total 777? Big brother, where’s your next page? This is afraid not monkey master?

Fetch fetch fetch fetch fetch fetch fetch fetch fetch fetch fetch fetch fetch

Ok, the resource of the first screen is resolved, along with the parameter of paging, change the page number to see if it is available

Good ~, the interface is normal, their front end is really inverse big day

This kind of gameplay looks uncomfortable, resources are all output in the console, there is no way to look good, then can only help hit a patch

The enhanced code looks like this:

function search(page) {
    let key = document.getElementsByClassName('nav-item-input') [0].value;
    fetch("https://pcwallpaper.zhhainiao.com/v20526/wplive/search", {
        "headers": {
            "accept": "application/json, text/plain, */*"."accept-language": "zh-CN,zh; Q = 0.9, en - US; Q = 0.8, en. Q = 0.7"."content-type": "application/json; charset=UTF-8"."sec-ch-ua": "\"Google Chrome\"; v=\"95\", \"Chromium\"; v=\"95\", \"; Not A Brand\"; v=\"99\""."sec-ch-ua-mobile": "? 0"."sec-ch-ua-platform": "\"Windows\""."sec-fetch-dest": "empty"."sec-fetch-mode": "cors"."sec-fetch-site": "cross-site"
        },
        "referrer": "https://bizhi.cheetahfun.com/"."referrerPolicy": "strict-origin-when-cross-origin"."body": `{"kw":"${key}","page":${page},"pageSize":24}`."method": "POST"."mode": "cors"."credentials": "omit"
    }).then(r= >r.json()).then(d= >{
        let childs = document.getElementsByClassName('wallpaper-wrapper') [0].children;
        d.data.list.forEach((n,i) = >{
            let child = childs[i];
            child.getElementsByTagName('img') [0].setAttribute('src', n.preview_jpg);
            child.getElementsByTagName('video') [0].setAttribute('src', n.preview_video); })})}document.getElementsByClassName('paging-btn-next') [0].onclick = function() {
    console.log('111')
    let curr = document.getElementsByClassName('paging-item-active') [0].getElementsByTagName('a') [0].text;
    curr++;
    document.getElementsByClassName('paging-item-active') [0].getElementsByTagName('a') [0].text = curr;
    search(curr)
}
Copy the code

Each time the next page is loaded, the resource image and link of the current page will be modified. Since it is the search interface, the content searched in the upper right corner of the page will be used as the interface request parameter

Of course, the code part may not be in place, welcome to point out ~