about samples/2024/webrick_vrchat_instanceinfo.html

※下の方に、この解説の日本語版もあります

Description-en:

Just to be clear, let me explain about the Outvoke sample code samples/2024/webrick_vrchat_instanceinfo.html that was set up on GitLab Pages.

This explanation is current as of December 10, 2024. It assumes that the Ruby version is 3.x and the Outvoke version is 0.1 (including 0.0.99.x). The Japanese version of this explanation was written first. In the event of any discrepancies in content, the original Japanese version shall prevail.

The "sample" mentioned here does not refer to the free version under the circumstances where both paid and free versions are available. It refers to an example of using Outvoke.

When I say the page that was set up on GitLab Pages, I mean https://cleemy-desu-wayo.gitlab.io/ov/webrick_vrchat_instanceinfo.html as the URL.

The only thing you get by using the page at the above URL is that you can be sure that it is possible to actually operate cross-domain cooperatively. If the purpose is to use it as a tool to display real-time information about the instance you are in, there is no merit in continuing to use it as a daily use item.

Here are the steps to make it work for those who want to see if it actually works.

What I have written here has little to do with the essence of Outvoke. However, if you get a general feel for what is written here, it may be easier to guess the intent of the code when you see Outvoke samples that use JSON. Also, it might be easier to imagine how to place something that outputs JSON when you try to write your own script that uses Outvoke.

Note that the assumption is that your environment is Linux with Ruby, and that VRChat running on Proton GE or similar is already installed. The author (cleemy desu wayo) has not tested if it works on WSL.

In fact, all that is required is that the VRChat client log files be readable through the OS file system, not necessarily that the VRChat itself be installed on the same machine.

This explanation is written in a verbose manner, with the assumption that there may be some readers who are not familiar with web technologies or who are beginners in programming. Even if you are a beginner in programming itself, it is assumed that you can search for error messages and other information yourself and determine the cause to some extent on your own.

If you are still not satisfied even after researching, or if you cannot figure out what the error is no matter how much you search, please feel free to send me a message via Odaibako ( https://odaibako.net/u/cleemy_desu_wayo ).

# starting Outvoke 0.1 (version 0.0.99.20241206) ---- 2024-12-09 10:58:32 +0900
# ----
# given ruby code:
# hooksec
# ----

[2024-12-09 10:58:33 +0900] 2024-12-09 10:58:33 +0900
[2024-12-09 10:58:34 +0900] 2024-12-09 10:58:34 +0900
[2024-12-09 10:58:35 +0900] 2024-12-09 10:58:35 +0900
[2024-12-09 10:58:36 +0900] 2024-12-09 10:58:36 +0900
[2024-12-09 10:58:37 +0900] 2024-12-09 10:58:37 +0900

# starting Outvoke 0.1 (version 0.0.99.20241206) ---- 2024-12-09 11:02:40 +0900
# ----
# given ruby code:
# hook("vrchat-001", /entering room/i)
# ----

[2024-12-09 11:02:40 +0900] [outvoke-system] vrchat-001: a new log file was found.
[2024-12-09 11:02:40 +0900] [outvoke-system] vrchat-001: first time log check has done.
[2024-12-09 11:04:08 +0900] [Behaviour] Entering Room: Beyond a bit - 想像のちょっと先へ
[2024-12-09 11:05:35 +0900] [Behaviour] Entering Room: Japan Street 0․430
[2024-12-09 11:08:20 +0900] [Behaviour] Entering Room: Moonlit Perch -月明かりの泊まり木-
[2024-12-09 11:08:46 +0900] [Behaviour] Entering Room: Moonlit Perch -月明かりの泊まり木-
[2024-12-09 11:10:48 +0900] [Behaviour] Entering Room: Xen Hall
[2024-12-09 11:13:20 +0900] [Behaviour] Entering Room: Cyber Chill Out Room

  HTTP/1.1 200 OK
  Content-Type: text/html; charset=UTF-8
  Vary: Origin
  Cache-Control: no-store
  Pragma: no-cache
  Server: WEBrick/1.7.0 (Ruby/3.0.2/2021-07-07)
  Date: Mon, 09 Dec 2024 02:18:04 GMT
  Content-Length: 230
  Connection: Keep-Alive
{
  "world": {
    "name": "Cyber Chill Out Room",
    "id": "wrld_dc80e8f2-5d48-4bdd-b7f4-3faca6678833",
    "instance": "32470",
    "region": "jp"
  },
  "users": {
    "usr_eced6a32-b25c-43ae-87aa-ab36c0eee2c5": "cleemy"
  }
}

Now, let's go back to my first point about "there is no merit in continuing to use it".

If you follow the steps explained so far, the JSON data is delivered at localhost:8080. Therefore, you can also use samples/2024/webrick_vrchat_instanceinfo.html by placing it at localhost:8080.

In other words, all you need to do is put the latest version of webrick_vrchat_instanceinfo.html in the directory you have just created.

If you visit http://localhost:8080/webrick_vrchat_instanceinfo.html using your web browser under the circumstances where JSON delivery is possible (where the previous Outvoke process running), a localhost version of webrick_vrchat_instanceinfo.html should be available.

In this case, there is no need to configure CORS. Both the side that reads JSON and the side that delivers JSON are placed at localhost:8080. It is safer to delete the outvoke.conf.rb file that was just prepared.

Generally speaking, if an application that has characteristics of a SPA is updated frequently, it is beneficial to put it on GitLab Pages or similar. This is because the latest version is always available as long as you have access to it. However, samples/2024/webrick_vrchat_instanceinfo.html is just a sample program and is not updated often.

That's all the explanation from me for now.

If you have any questions, you can use Odaibako ( https://odaibako.net/u/cleemy_desu_wayo ).

Description-ja:

GitLab Pages 上に置いたOutvokeのサンプルコード samples/2024/webrick_vrchat_instanceinfo.html について、念のために解説しておきます。

この解説は2024年12月10日時点のものです。Rubyのバージョンは3.xで、Outvokeのバージョンは0.1（0.0.99.x を含む）を想定しています。この解説は日本語版を先に書いています。内容に食い違いがある場合は、オリジナルの日本語版の記述を優先させてください。

ここで言う「サンプル」というのは、有料版と無料版が用意されている状況での無料版のほうという意味ではなく、作例（an example of using Outvoke）ということです。

GitLab Pages 上に置いたものというのは、URLとしては https://cleemy-desu-wayo.gitlab.io/ov/webrick_vrchat_instanceinfo.html のことです。

上記のURLのものは、実際にクロスドメインで協調的に動作させるのが可能ということを確認できるだけです。自分のいるインスタンスの情報をリアルタイム表示するためのツールとして使うという目的であれば、普段使いのものとして継続的に使用するメリットはありません。

ここでは実際に動作するのかどうかを確認したいという人のために、動作させるまでの手順を示しておきます。

ここに書いたことは、Outvokeの本質とはあまり関係はありません。ただ、ここに書かれていることについての全体的な感触をつかんでおけば、Outvokeのサンプルの中でJSONを利用したものがあった時に、そのコードの意図が推測しやすくなるということはあるかもしれません。また、Outvokeを利用したスクリプトを自分で書こうとした時に、JSONを出力するようなものをどのように配置すればいいかがイメージしやすくなるかもしれません。

なお、お手元の環境はRubyが入っているLinuxで、そこに Proton GE などの上で動くVRChatがすでにインストールされているというのが前提です。WSLでも動くかどうかについては、作者（cleemy desu wayo）は試していません。

実際のところ、必要なのはVRChatクライアントのログファイルがOSのファイルシステムを通じて読み取り可能という状況だけであり、必ずしもVRChat本体が同じマシン上にインストールされている必要はありません。

この解説は、Web技術に詳しくない人やプログラミング初心者が読むことがあるかもしれないということを想定して、冗長な書き方をしています。プログラミングそのものは初心者であったとしても、エラーメッセージなどは自分で検索して、ある程度は自分で原因を特定できるというのが前提です。

調べても納得がいかないとか、いくら検索してもどういうエラーなのかが不明とか、そういう場合は遠慮なくお題箱（ https://odaibako.net/u/cleemy_desu_wayo ）からメッセージをどうぞ。

# starting Outvoke 0.1 (version 0.0.99.20241206) ---- 2024-12-09 10:58:32 +0900
# ----
# given ruby code:
# hooksec
# ----

[2024-12-09 10:58:33 +0900] 2024-12-09 10:58:33 +0900
[2024-12-09 10:58:34 +0900] 2024-12-09 10:58:34 +0900
[2024-12-09 10:58:35 +0900] 2024-12-09 10:58:35 +0900
[2024-12-09 10:58:36 +0900] 2024-12-09 10:58:36 +0900
[2024-12-09 10:58:37 +0900] 2024-12-09 10:58:37 +0900

# starting Outvoke 0.1 (version 0.0.99.20241206) ---- 2024-12-09 11:02:40 +0900
# ----
# given ruby code:
# hook("vrchat-001", /entering room/i)
# ----

[2024-12-09 11:02:40 +0900] [outvoke-system] vrchat-001: a new log file was found.
[2024-12-09 11:02:40 +0900] [outvoke-system] vrchat-001: first time log check has done.
[2024-12-09 11:04:08 +0900] [Behaviour] Entering Room: Beyond a bit - 想像のちょっと先へ
[2024-12-09 11:05:35 +0900] [Behaviour] Entering Room: Japan Street 0․430
[2024-12-09 11:08:20 +0900] [Behaviour] Entering Room: Moonlit Perch -月明かりの泊まり木-
[2024-12-09 11:08:46 +0900] [Behaviour] Entering Room: Moonlit Perch -月明かりの泊まり木-
[2024-12-09 11:10:48 +0900] [Behaviour] Entering Room: Xen Hall
[2024-12-09 11:13:20 +0900] [Behaviour] Entering Room: Cyber Chill Out Room

  HTTP/1.1 200 OK
  Content-Type: text/html; charset=UTF-8
  Vary: Origin
  Cache-Control: no-store
  Pragma: no-cache
  Server: WEBrick/1.7.0 (Ruby/3.0.2/2021-07-07)
  Date: Mon, 09 Dec 2024 02:18:04 GMT
  Content-Length: 230
  Connection: Keep-Alive
{
  "world": {
    "name": "Cyber Chill Out Room",
    "id": "wrld_dc80e8f2-5d48-4bdd-b7f4-3faca6678833",
    "instance": "32470",
    "region": "jp"
  },
  "users": {
    "usr_eced6a32-b25c-43ae-87aa-ab36c0eee2c5": "cleemy"
  }
}

さてここで、最初の「継続的に使用するメリット」がないという話に戻ります。

ここまで説明してきた手順のとおりなら、そもそもJSONのデータは localhost:8080 で配信しています。だから samples/2024/webrick_vrchat_instanceinfo.html についても、localhost:8080 で利用できるようにすればいいわけです。

つまり、今回作成したディレクトリに最新版の webrick_vrchat_instanceinfo.html も置けばいいのです。

JSON配信が可能な状態で（先ほどのOutvokeが起動された状態のままで）ブラウザで http://localhost:8080/webrick_vrchat_instanceinfo.html にアクセスすれば、localhost版の webrick_vrchat_instanceinfo.html が利用可能になるはずです。

この場合は、CORSの設定をする必要もありません。JSONを読み取る側も、JSONを配信する側も、ともに localhost:8080 だからです。先ほどの outvoke.conf.rb は削除してしまったほうが安全です。

一般論として、SPAとしての性質を持つアプリケーションは、頻繁に更新されているならば GitLab Pages などに置いておくことにはメリットがあります。そこにアクセスさえできれば、常に最新版が利用できるからです。でも samples/2024/webrick_vrchat_instanceinfo.html はただのサンプルプログラムであり、頻繁に更新されることはありません。

とりあえず解説は以上です。

疑問点などはお題箱（ https://odaibako.net/u/cleemy_desu_wayo ）へどうぞ。