RubyでHTMLを作成する

今までどのように流行のウェブサイトのようなワンダーProduct Hunt or Medium 生成これらの空想Twitterのスクリーンショット?


スティーブン🖇
スティーブ

@テキサス州は、彼らの採用メールに拡張書面をもたらすためにマクドナルド社とサインしますlink.medium.com/XBc3nTBkUU
午前4時37分
2
16
もう驚きない!
本質的に、彼らはHTML/CSSをヘッドレスのクロムインスタンスでレンダリングし、スクリーンショットを取ります.音が複雑?はい.特に「ATスケール」
これにはAPIがあります.
この目的のために特別に構築されたAPIを使用してこれを行う方法を示します.HTML/CSS to Image API .

require "httparty"


auth = { username: 'user_id', password: 'api_key' }

html = "<div class=\"box\"><h3>Hello, world 😍</h3></div>"

css = ".box {
  border: 4px solid #8FB3E7;
  padding: 20px;
  color: white;
  font-size: 100px;
  width: 800px;
  height: 400px;
  font-family: 'Roboto';
  background-color: #8BC6EC;
  background-image: linear-gradient(135deg, #8BC6EC 0%, #9599E2 100%);
}"

image = HTTParty.post("https://hcti.io/v1/image",
                      body: { html: html, css: css },
                      basic_auth: auth)

# { url: https://hcti.io/v1/image/bfae7d68-86cc-4934-83ac-af3ba75a0d34 }

完了.画像がある✨.

レール+キャッシュ

あなたがRailsからこれらをつくっていて、すでにmemcachedを使うならば、あなたは一度だけそれらをつくることを確実とするための良いトリックです.

cache_key = "image/#{html}/#{css}"

image = Rails.cache.fetch(cache_key) do
  HTTParty.post("https://hcti.io/v1/image",
                      body: { html: html, css: css },
                      basic_auth: auth)
end

キャッシュキーを生成するためにHTML/CSSを使用します.それがあまりに長いことを心配しないでください.Rails/Dalliは自動的にキーをハッシュします.そして、それがユニークで正しい長さであると保証します.
このように、あなたが再び正確に同じペイロードを送るならば、Railsはそれを再生するよりむしろURLからURLを引きます.

別のレール先端

あなたがすべての内容のためにこれらを生成しているならば、それはAPIafter_create . 私はそれに忠告します.「リクエストで」絶対的な最小値にI/Oを保つのは常に最高です.たとえリクエストが30 msしか取ることができないとしても、エンドポイントがすでに多くをしているならば、それは増すことができます.
ソリューションは、バックグラウンドジョブを使用します.
それで、直接電話をする代わりにafter_create . 代わりにバックグラウンドジョブをafter_create . その後、画像がバックグラウンドで生成されます.あなたのレールの応答時間をスーパークイック保つ.

何かクールビルド？

このクールな何かを構築する場合は、私は私ができるように知らせてください!