asciicast形式のファイルをasciinema playerで共有する

asciinema という端末を録画再生と共有の出来るツールやサービスがあります.

共有のためにはデフォルトでは asciinema.org にアップロードしますが,サイズの制限があり大きなものは共有できません.

$ asciinema rec sl_lolcat.cast (1)
asciinema: recording asciicast to sl.cast
asciinema: press <ctrl-d> or type "exit" when you're done
$ (2)
^d (3)
exit
asciinema: recording finished
asciinema: asciicast saved to sl.cast
$ ls -l sl_lolcat.cast
-rw-rw-r-- 1 matoken matoken 35881291 10月 21 06:51 sl_lolcat.cast
$ asciinema upload sl_lolcat.cast (4)
asciinema: upload failed: Sorry, the size of your recording exceeds the server-configured limit.
  1. asciinema コマンドで sl_lolcat.cast というファイル名で録画

  2. 録画したい操作

  3. <Ctrl-d> で録画終了

  4. ファイルサイズが大きいので asciinema.org へのアップロードに失敗

asciinema server 🏛️ をセルフホストすることできますがちょっと大げさ.asciinema player だけならお手軽そうなので試してみました.

asciinema player の releases page 🏛️ から asciinema-player.min.jsasciinema-player.css を入手します.

$ wget https://github.com/asciinema/asciinema-player/releases/latest/download/asciinema-player.css \
       https://github.com/asciinema/asciinema-player/releases/latest/download/asciinema-player.min.js

同じ場所に共有したい cast ファイルを置き,以下のような html ファイルを用意, /demo.cast 部分を自分の cast ファイルと置き換えます.

<!DOCTYPE html>
<html>
<head>
  ...
  <link rel="stylesheet" type="text/css" href="/asciinema-player.css" />
  ...
</head>
<body>
  ...
  <div id="demo"></div>
  ...
  <script src="/asciinema-player.min.js"></script>
  <script>
    AsciinemaPlayer.create('/demo.cast', document.getElementById('demo'));
  </script>
</body>
</html>

適当な httpd 経由でアクセスしてみると埋め込めました.そのまま再生できます :)

$ python -m http.server 8000 -d . -b localhost &
$ xdg-open http://localhost:8000/test.html

これを使うと大きな cast ファイルでも共有しやすくなりそうです.

SEE ALSO
環境
$ dpkg-query -W asciinema
asciinema       2.4.0-1
$ lsb_release -dr
Description:    Debian GNU/Linux trixie/sid
Release:        n/a
$ arch
x86_64

One thought to “asciicast形式のファイルをasciinema playerで共有する”

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

To respond on your own website, enter the URL of your response which should contain a link to this post's permalink URL. Your response will then appear (possibly after moderation) on this page. Want to update or remove your response? Update or delete your post and re-enter your post's URL again. (Find out more about Webmentions.)