摘要：最近看到抖音那么火，心想著是不是要做個(gè)抖圖，就這樣，拖拖拉拉就開(kāi)始干了。一個(gè)多月了，終于有成果了。二期會(huì)對(duì)這個(gè)爬蟲(chóng)做出修改，優(yōu)化，希望能夠一次性完成所有的爬取工作。

換了新公司，沒(méi)什么時(shí)間寫博客了。最近看到抖音那么火，心想著是不是要做個(gè)“抖圖”，就這樣，拖拖拉拉就開(kāi)始干了。一個(gè)多月了，終于有成果了。

從某圖片網(wǎng) 爬了8w張圖片，爬的只是鏈接（因?yàn)槭擎溄樱院竺娉霈F(xiàn)一些問(wèn)題）

將鏈接存到本地的mysql數(shù)據(jù)庫(kù)

用express 寫了一些接口

前端用react 做了這個(gè)滑動(dòng)的交互和首頁(yè)的刷新

爬圖片網(wǎng)站，我用的方法比較笨。中間經(jīng)過(guò)本地文件中轉(zhuǎn)了一下，執(zhí)行效率不是很好，為了防止對(duì)方反爬蟲(chóng)，我設(shè)置了一個(gè)定時(shí)器，2秒鐘一次。爬到第二天早上還沒(méi)結(jié)束。二期會(huì)對(duì)這個(gè)爬蟲(chóng)做出修改，優(yōu)化Promise，希望能夠一次性完成所有的爬取工作。

后端我用的是node，使用mysqlyi的包，拼湊一個(gè)插入語(yǔ)句，把所有的數(shù)據(jù)存進(jìn)去。

要開(kāi)始寫接口了。寫了兩個(gè)接口，一個(gè)是根據(jù)前端傳值頁(yè)數(shù)和每頁(yè)多少條，到數(shù)據(jù)庫(kù)進(jìn)行分頁(yè)查詢①，記得上面提到過(guò)我爬取的都是圖片鏈接，你訪問(wèn)別人cdn上的圖片，人家肯定不樂(lè)意，所以就有了防盜鏈技術(shù)，當(dāng)然也就有了反防盜鏈技術(shù)，我是用的node轉(zhuǎn)發(fā)圖片請(qǐng)求②。

前端用的是react + dva，首頁(yè)用了swiper③的插件。

技術(shù)方面難度不到，就不上github地址了。貼幾段看看就好。

① nodejs、mysql 分頁(yè)查詢

/**
 * @description 分頁(yè)查詢
 * @param {number} pageNo 一頁(yè)多少條
 * @param {number} pageSize 多少頁(yè)
 */
function funcSelectImgs(pageNo, pageSize) {

  let promise1 = new Promise((resolve) => {
    let SQLSelect = `select * from girl_img_tbl limit ${(pageNo - 1) * (pageSize)}, ${pageSize};`
    connection.query(`${SQLSelect}`, function (error, results, fields) {
      if (error) throw error;
      let arr1 = []
      results.map((item, index, arr) => {
        arr1.push(item.girl_img_url)
      })
      resolve(arr1)
    })
  });

  let promise2 = new Promise((resolve) => {
    let SQLSelect = `select  count(*) from girl_img_tbl;`
    connection.query(`${SQLSelect}`, function (error, results, fields) {
      if (error) throw error;
      resolve(results);
    });
  })

  return Promise.all([promise1, promise2]);
}

② 為了反防盜鏈，使用nodejs轉(zhuǎn)發(fā)圖片請(qǐng)求，使用request庫(kù)

var options = {
    url: str,
    headers: {
      "Referer": "targetUrl"
    }
  };
  request(options)
    .on("error", function (err) {
      console.log(err)
    })
    .pipe(res);

③ 在react中使用swiper

  if (this.swiper) {
      this.swiper.slideTo(0, 0)
      this.swiper.destroy();
      this.swiper = null;
    }
    this.swiper = new Swiper(this.refs.lun, {
      direction: "vertical",
      lazy: {
        loadPrevNext: true,
        loadPrevNextAmount: 2
      },
    });
  }

...
// render方法中使用


  

  {arrImgUrls.map((urlItem, index, arr) => {
    return (
      
{this.handleImgClick(urlItem)}}>
        

      
    )
  })}
  

剛才有提到為了反防盜鏈，我用我的nodejs服務(wù)器轉(zhuǎn)發(fā)圖片請(qǐng)求。我的是1M的騰訊云服務(wù)器，轉(zhuǎn)發(fā)圖片速度太慢了。昨天升級(jí)到了10M，兩天時(shí)間就要36塊錢，太貴了。

貼上鏈接吧，http://115.159.47.17:8081/ 我沒(méi)買域名，直接用的ip地址。估計(jì)明天就限速了，我就升級(jí)了兩天時(shí)間8月8號(hào)和8月9號(hào)。不過(guò)現(xiàn)在也能打開(kāi)，不過(guò)會(huì)很慢?？创蠹倚枨蟀桑绻邢矚g的話，私信我，我看是繼續(xù)升級(jí)帶寬，還是換家服務(wù)器廠商。