WebGL 出力時に Unity 側のプログラムとブラウザの JavaScript とやりとりをする方法
Unity 側のプログラムからブラウザの JavaScript 関数を実行する方法は基本的な部分は Web Player の時と同様です。
UnityのWeb PlayerとWebページ上のJavaScriptとでデータのやり取りをするサンプル - 強火で進め
http://d.hatena.ne.jp/nakamura001/20110606/1307350528
今見てみると公式ドキュメントとかリンク切れになってますね。自分が自作したサンプルコードなんかは見る事ができます。
Web Player 出力は非推奨になってるのでもうドキュメント無くなってるのかな？
これからは WebGL 出力を使うようにしましょう。
Unity 側のプログラム → ブラウザの JavaScript
Application.ExternalCall
自分が定義した JavaScript の関数を呼ぶ場合には Application.ExternalCall() を使います。
引数を複数指定する事も可能です。
【使用例】
Unity側
Application.ExternalCall("MyFunction1");
Application.ExternalCall("MyFunction2", "Hello from Unity!");
Application.ExternalCall("MyFunction3", "one", 2, 3.0F);ブラウザの JavaScript 側
var result;
window.onload = function()
{
result = document.getElementById("result");
};
function MyFunction1() {
result.innerHTML = "[MyFunction1]";
}
function MyFunction2(arg) {
res = "[MyFunction2]<br>";
// 引数が1つと確定している時
res += "arg:"+arg;
result.innerHTML = res;
}
function MyFunction3(arg) {
res = "[MyFunction3]<br>";
res += "arg:"+arg+"<br>";
// 引数の数が確定してない時
for (var i = 0; i < arguments.length; i++) {
res += "arguments[" + i + "]" + arguments[i]+"<br>";
}
result.innerHTML = res;
}
Unity - スクリプティング API: Application.ExternalCall
https://docs.unity3d.com/jp/460/ScriptReference/Application.ExternalCall.html
Application.ExternalEval
Application.ExternalEval() は JavaScript の eval() と同等の動作をします。
【使用例】
Unity側
Application.ExternalEval("alert('hoge');");
Application.ExternalEval("history.back()");
Unity - スクリプトリファレンス: Application.ExternalEval
https://docs.unity3d.com/jp/current/ScriptReference/Application.ExternalEval.html
ブラウザの JavaScript → Unity 側のプログラム
以下の記述を WebGL ビルドのテンプレート(※)部分に記述する事で Unity 側のでプログラムにデータを送れます。
※WebGL ビルド時のテンプレートについてはこちらを参照下さい。
ブラウザ側でデータの入力と出力を行う場所を追加。
<div> ここにテキストを入力：<input id="input_text" type="input" value="abc"><input onClick="SendTextToUnity()" type="button" value="Send"> </div> <div> [Unity側からのアクションの結果]<div id="result" /> </div>
ボタンが押された時に Unity(Canvas) 側にデータを送る処理を JavaScript で記述。
function SendTextToUnity() {
var inputText = document.getElementById("input_text");
SendMessage ('TestScript', 'FromJS', inputText.value);
};実際にどこにどの様に差し込むかは Assets/WebGLTemplates/Custom/index.html を参照下さい。テンプレートは Default をベースにCSSファイル( Assets/WebGLTemplates/Custom/TemplateData/style.css )の一部内容を修正しました。
