생초는 아이의 동력을 높인다[경품] 헤로쿠편~svg 이미지를 pg 이미지로 변환합니다~

네, 그것도 좋아요.
시리즈 작품의 번외편이다.
pixela의 그림을 사용하고 싶지만,gas만svg에서 pg로 바꾸는 것은 매우 어렵다.
파워게임으로 pg로 바꾼 이야기
  • 생초가 아이의 동기를 높인다 [저것1] 방법~설계편
  • 생초가 아이의 동력을 높인다[의2] 실장편
  • 생초가 아이의 동력을 높인다[그 3] 테스트편
  • 생초가 아이의 동력을 높인다[경품] 헤로쿠편
  • 생초가 아이의 동력을 높인다[그 4]운용편
  • 과제&해결 방법(다시)
    아이(특히 장남)가 물었다. "지금 뭐 하세요?"우산 챙기는 것을 잊기 쉬워 숙제와 준비를 계속할 수 없다.
    작업 도중에 다른 일을 했어요.
    자녀용 ToDo 목록을 시각적으로 표시하십시오.
    중점 낚시로 무슨 방법이 있을까 해서요.

  • 규격.
  • 퀘스트 완성 후 누적

  • 일상적인 작업의 발생과 종료를 보존합니다.

  • 부가 편,svg 파일 변환
    상술한 작업에서, 나는 "Pixela 그림을 Trello의 카드 이미지에 삽입하고 싶다."
    pixela는 공식에서svg의 API만 반환합니다.
    그래서 자동 테스트에서 배양된 기술을 이용한다(거짓말이다.puppeteer와koa는 모두 처음 사용한다. 나는 초보자다.)
    공식 화면에 포착된 이미지만 반납할 수 있는 웹 애플리케이션을 긴급 제작했다.
    기술을 이용하다
  • heroku
  • puppeteer
  • koa
  • 참고 자료
    - Heroku에서 Pupeteer의 실행 환경 구축
    - koa 서버 개발을 통해 빠른 시작
    코드
    index.js
    const Koa = require('koa');
    const Router = require('koa-router');
    const bodyParser = require('koa-bodyparser');
    
    const app = new Koa();
    const router = new Router();
    const mime = require('mime-types')
    const fs = require('fs');
    
    router.get('/', async (ctx, next) => {
    
      const pixela_user = ctx.request.query['pixela-user']
      const pixela_graph = ctx.request.query['pixela-graph']
      url = "https://pixe.la/v1/users/" + pixela_user + "/graphs/" + pixela_graph + "?mode=short&appearance=dark"
      const filename = getNowStr()+'.png'
      await crawler(filename, url); // クローラーの実行
    
      var mimeType = mime.lookup(filename);
      ctx.response.set("content-type", mimeType);
      const src = fs.createReadStream(filename);
      ctx.body = src;
    });
    
    app.use(router.routes());
    app.use(router.allowedMethods());
    app.use(bodyParser());
    app.listen(process.env.PORT || 3000);
    
    // ここからはクローラーのロジック
    const puppeteer = require('puppeteer');
    // Heroku環境かどうかの判断
    const LAUNCH_OPTION = process.env.DYNO ? { args: ['--no-sandbox', '--disable-setuid-sandbox'] } : { headless: false };
    
    
    const crawler = async (filename,url) => {
    
      const browser = await puppeteer.launch(LAUNCH_OPTION)
      const page = await browser.newPage()
    
      await page.goto(url)
      // スクリーンショットを保存
      img = await page.screenshot({path: filename})
      await browser.close()
    }
    
    function getNowStr(){
      var date = new Date();
      return date.toTimeString()
    }
    
    이용 방법
    http://xxxxxx.herokuapp.com/?pixela-user=who&pixela-graph=something에 방문하면 pg 이미지가 표시됩니다.
    Trello에 등록할 때 URL을 통해 등록할 수 있기 때문에 API를 통해 위의 URL을 표지 이미지를 업데이트하는 URL로 POST를 진행하면 OK입니다.

    총결산
    허우쿠에selenium을 싣는 일을 해 봤지만 퓨퍼터도 의외로 간단했다. 나는 그렇게 생각했다. 한번 해 봤는데 아주 간단했다.
    배웠어.
    제가 한번 해봤어요.β판본이 있다는 통지를 받다.
    정부 당국자는트위터에서 이런 답변을 받았다.
    Qita에 써도 돼요!그렇게 말씀하셔서 여기 적었어요.

    좋은 웹페이지 즐겨찾기