웹에서 가사를 자동으로 가져옵니다.

10129 단어 puppeteerNode.js
오늘 "https://mp3.zing.vn/zing-chart-tuan/bai-hat-US-UK/IWZ9Z0BW.html"에서 가사를 얻는 자동 도구를 작성하십시오.

기술




기술
버전


Nodejs
10.14.1

Puppeteer
1.12.2


준비


  • 새로운 폴더 만들기 (이름은 무엇이든 좋다)
  • "1"로 만든 폴더에 액세스하고 터미널에서 npm init -> npm i puppeteer 쓰기
  • index.js 만들기
  • 가사를 저장할 폴더 만들기
  • Google 크롬 사용



  • Puppeteer API



    page.evaluate 만 사용하기 때문에 다른 API는 여기에서 참조하십시오.

    개발


  • page.evaluate는 웹에서 스크립트를 실행하여 결과를 반환합니다. 그래서 HTML 구축 분석이 필요합니다.


  • 각 노래는
    의 "e-item"에 있습니다.
    - txt-primary _trackLink 클래스가 있는 : 노래 이름- href: 노래 세부정보 링크 2. Google 크롬 콘솔에서 스크립트를 사용해 보세요.let songs = document.getElementsByClassName('e-item'); songs = [...songs]; let array = songs.map(song => ({ title: song.getElementsByClassName('txt-primary _trackLink')[0].innerHTML.trim(), url: song.getElementsByClassName('txt-primary _trackLink')[0].href })); 결과
    이미지와 같은 결과가 나오면 성공입니다.
    3. 다음은 웹에서 가사 검색 스크립트를 시도합니다

    가사는 fn-wlyrics fn-content의 클래스가 있는

    입니다.
    또한
    가 있으므로 replace를 사용하여 생략합니다.
    스크립트: document.getElementsByClassName('fn-wlyrics fn-content')[0].innerHTML.replace(/\<br\>/g,"")결과

    4. 이제 index.js를 작성합니다. 가사는 파일에 저장합니다.

    index.js

    const puppeteer = require('puppeteer');
    const fs = require('fs');
    
    (async()=>{
      const browser=await puppeteer.launch({headless:true});
      const page=await browser.newPage();
    
      await page.goto('https://mp3.zing.vn/zing-chart-tuan/bai-hat-US-UK/IWZ9Z0BW.html');
      const songs = await page.evaluate(() => {
        let songs = document.getElementsByClassName('e-item');
        songs = [...songs];
        let array = songs.map(song => ({
            title: song.getElementsByClassName('txt-primary _trackLink')[0].innerHTML.trim(),
            url: song.getElementsByClassName('txt-primary _trackLink')[0].href
        }));
        return array;
      });
    
      for(let song of songs){
        await page.goto(song.url);
        let lyric = await page.evaluate(()=>{
          const evaluatedLyric = document.getElementsByClassName('fn-wlyrics fn-content')[0];
          // 歌詞はいつもあるわけではないので、条件をチェック
          if (evaluatedLyric !== undefined) {
            return evaluatedLyric.innerHTML.replace(/\<br\>/g,"");
          } else return "歌詞無し";
        });
        await fs.writeFile(`songs/${song.title}.txt`,lyric,function(err){
          if(err) throw err;
          console.log("取得: "+song.title);
        });
      }
      await browser.close();
    })();
    

    결국 다음과 같은 결과가 나온다




    요약



    이 방법은 매우 간단하지만 HTML 구축 분석이 필요하기 때문에 때로는 싫어할 수 있습니다. 그래서 사용하기 전에 주의해야 합니다.

    좋은 웹페이지 즐겨찾기