HTML5コメントジェネレーターと連携する

HTML5コメジェネと連携させることで、OBSなどでコメントを画面表示させることが出来ます。

Youtubeの解説動画(2:10~HTML5コメジェネの解説)~

必要なもの

設定方法(Windows)

  • HTML5コメントジェネレーターを適当な場所に解凍し、「hcg_setting.exe」を起動してコメジェネの場所(フォルダ)を指定

設定方法(macOS)

  • 「/Users/(userName)」以下に「AppData/Roaming/hcg」というディレクトリ階層を作成
  • HTML5コメントジェネレーターの各ファイルを上記hcgディレクトリにコピー。(「setting.xml」が「/Users/(userName)/AppData/Roaming/hcg/setting.xml」というパスになるように)
    ディレクトリ構成
  •  「setting.xml」をテキストエディタで開き、「HcgPath」を「/Users/(userName)/AppData/Roaming/hcg」に書き換え。((userName)は自分のユーザー名に置き換えてください)
    ディレクトリ構成

設定方法(共通)

  • ひまストコメントビューアーの環境設定で「HTML5コメントジェネレーターと連携する」にチェックを入れます。
    ディレクトリ構成
  • OBSでソースに「ブラウザ」を追加して、「ローカルファイル」にチェックを入れ参照から「CommentGenerator.html」を選択します。
  • 幅と高さをそれぞれ「512」「100」などと指定します。

うまく動かない場合

コメジェネ連携にチェックを入れると「AppData/Roaming/hcg/setting.xml」が見つかりませんとのメッセージが表示される

ユーザーフォルダ配下の「AppData/Roaming/hcg/setting.xml」を読み込みコメジェネの場所を取得しています。~
Windowsの場合「hcg_setting.exe」を起動し、コメジェネの場所を参照したあとOKすれば、自動的に作成されるはずですが、作成されない場合は自分で 「C:\Users\ユーザー名\AppData\Roaming\hcg」フォルダにコメジェネのフォルダに有る「setting.xml」ファイルをコピーしてください。
macOSの場合は「/Users/(userName)/AppData/Roaming/hcg/setting.xml」を読み込みに行きます。setting.xmlの「HcgPath」も自分で書き換えて設定する必要があります。

コメントが表示されない

コメジェネのフォルダに有る「comment.xml」を開いてコメントが追記されているか確認してください。
書き込まれていない場合、コメビュのHTML5コメジェネ連携のチェックが入っているか確認してください。
また、コメジェネの配置場所をCドライブ直下など書き込みが制限されていない場所に変えてみてください。
「comment.xml」にコメントは追記されているもののOBS上で表示されていない場合はブラウザソースがうまく動いていない可能性があります。再度ブラウザソースの追加と削除をしてみてください。

「ロード失敗」のダイアログが出る

コメントファイルに書き込むタイミングでコメジェネが新しいコメントを読み込むと時々エラーが出ます。
対処法として「CommentGenerator.html」または「CommentGenerator_multi.html」使用している方を開いて「alert("ロード失敗");」という行を探し、その行の先頭に「//」を追加してコメントアウトしてください。

alert("ロード失敗");

//alert("ロード失敗");

マルチ版(複数サイトの同時表示)でひまストの名前を表示させるには

「CommentGenerator_multi.html」をソースとして使用すると他の配信サイトのコメントと区別してサイト名を表示させることが出来ます。

} else if(xml[i].getAttributeNode("service").value == "Mixer") {
handle = "【Mixer】" + handle;
}

という部分を探し、その下に下記を追記します

else if(xml[i].getAttributeNode("service").value == "himast") {
handle = "【ひまスト】" + handle;
}

トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2019-06-02 (日) 23:26:29 (46d)