How can I obtain images in zhihu daily?

I am working on a third-party zhihu daily report, but can't I get the picture? Is there pure front-end implementation? I am working on a third-party zhihu daily report, but can't I get the picture? Is there pure front-end implementation?

Reply content:

I am working on a third-party zhihu daily report, but can't I get the picture? Is there pure front-end implementation?

Js regular expression.

Which of the following statements cannot be obtained?

It is reasonable to say that, as long as you get the image through API, the image address must be available (because I have also written a webpage version of zhihu daily report (front-end is a bit scum, it's a bit bad. It may be offline later ..), ).
However, if you directly reference the image address provided by the API on the webpage, congratulations,403 ForbiddenZhihu has enabled the anti-leech feature.

So we can't use it anymore? No! When you access the image address directly in the new tab/window of the browser, you can see the image. The principle of zhihu anti-leech is to check whether refer is empty or whether the refer is unknown.

Then we can use JS to put the image in an iframe, and then set the border of iframe to 0. The specific code is as follows:

var count = 0;window.img_array = new Array();// create a img framefunction create_img_iframe(url){    var frameid = 'frameimg' + Math.random();    window.img = '《script》window.onload = function() { parent.document.getElementById(\''+frameid+'\').height = document.getElementById(\'img\').height+\'px\'; }<'+'/script>';    window.img_array[count] = window.img;    ifr = document.createElement('iframe');    ifr.src = "javascript:parent.img_array[" + count + "];";    ifr.frameBorder="0";    ifr.scrolling="no";    ifr.width="100%";    ifr.id = frameid;    count++;    return ifr;}// hotlink, param id is the img parent idfunction hotlink_under_id(id){    var p = document.getElementById(id);    imgs = p.getElementsByTagName('img');    while (imgs.length > 0)    {        src = imgs[0].src;        ifr = create_img_iframe(src);        imgs[0].parentNode.replaceChild(ifr, imgs[0]);    }}

The above code is not my original one. I seem to have modified it based on a great online one (I don't remember whether it has been modified .. I carefully read the principles of this Code .)

In fact, this method is not perfect, because after this method, the bottom of the image will be cut off a bit (the position in the iframe will cause the part to be hidden ). A better solution is:
Use your server to cache the image and replace the image address in the API.

No matter which method you use, be sure to pay attentionCopyright issuesAh!