{"id":21991853,"url":"https://github.com/tlabaltoh/tlabwebview","last_synced_at":"2026-04-13T22:32:25.252Z","repository":{"id":160882620,"uuid":"635658469","full_name":"TLabAltoh/TLabWebView","owner":"TLabAltoh","description":"Plug-in for WebView that runs in Unity and can display WebView results as Texture2D","archived":false,"fork":false,"pushed_at":"2024-04-13T21:02:30.000Z","size":11862,"stargazers_count":1,"open_issues_count":1,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2024-04-14T00:38:20.138Z","etag":null,"topics":["android","unity","unity3d","webview"],"latest_commit_sha":null,"homepage":"https://tlabgames.gitbook.io/tlabwebview/","language":"C#","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/TLabAltoh.png","metadata":{"files":{"readme":"README-ja.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2023-05-03T07:13:02.000Z","updated_at":"2024-04-15T15:57:16.479Z","dependencies_parsed_at":null,"dependency_job_id":"41e936d6-f08f-4442-9a69-03dc4319ccc5","html_url":"https://github.com/TLabAltoh/TLabWebView","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TLabAltoh%2FTLabWebView","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TLabAltoh%2FTLabWebView/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TLabAltoh%2FTLabWebView/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TLabAltoh%2FTLabWebView/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/TLabAltoh","download_url":"https://codeload.github.com/TLabAltoh/TLabWebView/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245052619,"owners_count":20553161,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","unity","unity3d","webview"],"created_at":"2024-11-29T20:11:56.156Z","updated_at":"2026-04-13T22:32:25.245Z","avatar_url":"https://github.com/TLabAltoh.png","language":"C#","funding_links":["https://www.buymeacoffee.com/tlabaltoh"],"categories":[],"sub_categories":[],"readme":"\u003cimg src=\"Media/header.png\" width=\"800\"\u003e\n\n# TLabWebView  \n\nAndroid で使用可能なブラウザコンポーネント ([```WebView```](https://developer.android.com/reference/android/webkit/WebView) / [```GeckoView```](https://mozilla.github.io/geckoview/)) を uGUI (Texture2D) として利用するためのプラグイン．3Dウェブブラウザ (3D WebView) の実装が可能になります．\n\n- [x] キーボード入力\n- [x] タッチ操作\n- [x] ファイルダウンロード (blob, data urlを含む)\n- [x] リサイズ\n- [x] Javascriptの実行\n- [x] 複数インスタンスの同時実行をサポート\n- [x] 複数のブラウザエンジンをサポート\n  - [x] [```WebView```](https://developer.android.com/reference/android/webkit/WebView): 安定していて，javascriptインターフェースが充実\n  - [x] [```GeckoView```](https://mozilla.github.io/geckoview/): WebViewと比べて，拡張性が高い（ポップアップ等）\n- [x] 複数のレンダリング方法をサポート\n  - [x] ```HardwareBudder```: Androidの低レイヤー機能を使用した実装．パフォーマンス⭕️\n  - [x] ```ByteBuffer```: C＃側でbyte配列として結果を取得するためフレームへのアクセスが容易．安定性⭕️．**デフォルトではこのオプションが使用されています．**\n  - [x] ```Surface```: Androidの ```Surface``` クラスに直接レンダリングを行う．[```CompositionLayers```](https://docs.unity3d.com/Packages/com.unity.xr.compositionlayers@0.5/manual/usage-guide.html)などを活用する際に利用することを想定\n\n[ドキュメントはこちら](https://tlabgames.gitbook.io/tlabwebview)  \n[スニペットはこちら](https://gist.github.com/TLabAltoh/e0512b3367c25d3e1ec28ddbe95da497#file-tlabwebview-snippets-md)  \n[Javaプラグインのソースコードはこちら](https://github.com/TLabAltoh/TLabWebViewPlugin)\n\n[![\"Buy Me A Coffee\"](https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png)](https://www.buymeacoffee.com/tlabaltoh)\n\n## 対応しているUnityのバージョン\n- [x] Unity 2021\n- [x] Unity 2022\n- [x] Unity 6000 (`WebView`のみテスト済みです．`GeckoView`はまだテストしていません．)\n\n## 対応するグラフィックスAPI\n- [x] OpenGLES\n- [x] Vulkan\n\n## スクリーンショット  \nAndroid13, Adreno 619で実行した画面  \n\n\u003cimg src=\"Media/tlab-webview.png\" width=\"256\"\u003e\u003c/img\u003e  \n\nVR サンプル  \n\u003ca href=\"https://github.com/TLabAltoh/TLabWebViewVR\"\u003e\u003cimg src=\"Media/tlab-webview-vr.gif\" width=\"256\"\u003e\u003c/img\u003e\u003c/a\u003e\n\n## 動作環境\n\n|       |                          |\n| ----- | ------------------------ |\n| OS    | Android 10 ~ 14          |\n| GPU   | Qualcomm Adreno 505, 619 |\n| Unity | 2021.3                   |\n\n## スタートガイド\n\n### 依存するライブラリ\n\n- [TLabVKeyborad](https://github.com/TLabAltoh/TLabVKeyborad) ```v1.0.1```\n\n### インストール\n\u003cdetails\u003e\u003csummary\u003eこちらをご覧ください\u003c/summary\u003e\n\n#### Submodule\n以下のコマンドでリポジトリをクローンしてください\n```\ngit clone https://github.com/TLabAltoh/TLabWebView.git\n```\nor\n```\ngit submodule add https://github.com/TLabAltoh/TLabWebView.git\n```\n\n#### UPM\nUnity Package Managerで```add package from git ...```から以下のurlでパッケージをダウンロードしてください\n```\nhttps://github.com/TLabAltoh/TLabWebView.git#upm\n```\n\n#### アプリストア互換性\nこのプラグインを使用したアプリをアプリストアに出した場合，以下のような警告を受ける場合があります．\n\n\u003e ### Unsafe SSL override in WebViews\n\u003e Your application may contain an unsafe implementation of the WebView's [onReceivedSslError() method](https://www.oculus.com/lynx/?u=https%3A%2F%2Fdeveloper.android.com%2Freference%2Fandroid%2Fwebkit%2FWebViewClient.html%23onReceivedSslError(android.webkit.WebView%2C%2520android.webkit.SslErrorHandler%2C%2520android.net.http.SslError)\u0026e=AT0HN6RWgLynCRtwcCSOzSVvlpMDUhi7C5saZwaY5p4unt4S4-GxIACJX_OPzTQp1Fn4oADk7Q_rwvZvRiF5XstftUzyuAWAolfkkk_WAtDpvOgW0Llcn_BXIEpgYobFNELMZ31ntKzTQXflaLkeRA) with a call to `handler.proceed() with insufficient validations. This may cause the WebView to ignore SSL certificate validation errors, making the application vulnerable to man-in-the-middle attacks.  \n\u003e \n\u003e https://www.meta.com/experiences/\n\n\n\u003e ### Security and trust\n\u003e #### onReceivedSslError\n\u003e your app is using an unsafe implementation of [```WebviewClient.onReceivedSslError```](https://developer.android.com/reference/android/webkit/WebViewClient#onReceivedSslError(android.webkit.WebView,%20android.webkit.SslErrorHandler,%20android.net.http.SslError)) handler\n\u003e \n\u003e https://developer.android.com/distribute/console\n\nその場合は，アプリストアに対応したバージョンのパッケージに切り替えてください．\n\n```add package from git URL ...```\n```\nhttps://github.com/TLabAltoh/TLabWebView.git#appstore-compatible-upm\n```\n\nアプリストア対応バージョンはセキュアではないウェブサイトを読み込むことができない点をあらかじめご了承ください．\n\n\u003c/details\u003e\n\n### セットアップ\n\n\u003cdetails\u003e\u003csummary\u003eこちらをご覧ください\u003c/summary\u003e\n\n- Build Settings\n\n| Property | Value   |\n| -------- | ------- |\n| Platform | Android |\n\n- Project Settings\n\n| Property          | Value                                 |\n| ----------------- | ------------------------------------- |\n| Color Space       | Linear                                |\n| Minimum API Level | 26                                    |\n| Target API Level  | 30 (Unity 2021), 31 ~ 32 (Unity 2022) |\n\n\n- Project Settings --\u003e Player --\u003e Other Settings に以下のシンボルを追加(ビルド時に使用)\n\n```\nUNITYWEBVIEW_ANDROID_USES_CLEARTEXT_TRAFFIC\n```\n```\nUNITYWEBVIEW_ANDROID_ENABLE_CAMERA\n```\n```\nUNITYWEBVIEW_ANDROID_ENABLE_MICROPHONE\n```\n\n- Scene\n\n```BrowserManager```をシーン内のいずれかのGameObjectにアタッチしてください．(EventSystemにアタッチするのが一番望ましいかも ...)．\n\n#### ```GeckoView``` をブラウザエンジンとして使用したい場合\n\nPluginsフォルダーをAssets以下に作成し，以下のファイルを置いてください．また，```BrowserContainer.browser```に```WebView```の代わりに```GeckoView```をアタッチしてください．また，```GeckoView```の使用には API level ```33``` ~ が求められます．```Project Settings```からターゲットAPIレベルを33以上に設定してください．\n\n1. gradleTemplate.properties\n\n```properties\norg.gradle.jvmargs=-Xmx**JVM_HEAP_SIZE**M\norg.gradle.parallel=true\n# android.enableR8=**MINIFY_WITH_R_EIGHT**\nunityStreamingAssets=**STREAMING_ASSETS**\n**ADDITIONAL_PROPERTIES**\nandroid.useAndroidX=true\n# android.enableJetifier=true\n```\n\n2. mainTemplate.gradle\n\n```gradle\n    ...\n\n    dependencies {\n        implementation \"androidx.annotation:annotation-jvm:1.9.1\"\n\n        def collection_version = \"1.4.3\"\n        implementation \"androidx.collection:collection:$collection_version\"\n\n        def lifecycle_version = \"2.6.1\"\n        implementation \"androidx.lifecycle:lifecycle-viewmodel-ktx:$lifecycle_version\"\n        implementation \"androidx.lifecycle:lifecycle-viewmodel-compose:$lifecycle_version\"\n        implementation \"androidx.lifecycle:lifecycle-livedata-ktx:$lifecycle_version\"\n        implementation \"androidx.lifecycle:lifecycle-runtime-ktx:$lifecycle_version\"\n        implementation \"androidx.lifecycle:lifecycle-runtime-compose:$lifecycle_version\"\n        implementation \"androidx.lifecycle:lifecycle-viewmodel-savedstate:$lifecycle_version\"\n        implementation \"androidx.lifecycle:lifecycle-common-java8:$lifecycle_version\"\n        implementation \"androidx.lifecycle:lifecycle-service:$lifecycle_version\"\n        implementation \"androidx.lifecycle:lifecycle-process:$lifecycle_version\"\n        implementation \"androidx.lifecycle:lifecycle-reactivestreams-ktx:$lifecycle_version\"\n    }\n\n    ...\n```\n\n3. GeckoView plugin (```.aar```) (現在 [125.0.20240425211020 version](https://mvnrepository.com/artifact/org.mozilla.geckoview/geckoview/125.0.20240425211020) のみで開発・テストを行っているので，同じバージョンのものをダウンロードしてください．)\n\n\u003c/details\u003e\n\n### Prefab\n以下に置いてあるプレハブをCanvasに追加することでWebViewを実装できます\n```\n/Resources/TLab/WebView/Browser.prefab\n```\n\n### Keyborad\nこのパッケージでは，デフォルトでuGUIをベースに実装されたバーチャルキーボードが利用できます．しかし，uGUIをベースにしたバーチャルキーボードはデザインなどの拡張性の点で利点がありますが，場合によってはOS標準のシステムキーボードを利用したい場面もあるかもしれません．その場合は，各プラットフォームの設定に従って，アプリ側でパーミッション等を使用してシステムキーボードを有効にしてください (例: Meta Quest での設定は[こちら](https://developers.meta.com/horizon/documentation/unity/unity-keyboard-overlay/))．アプリ側での設定が完了すると，WebViewでのシステムキーボードの利用が可能になります．\n\n## \n\u003e [!NOTE]\n\u003e 外部ストレージ(```/Download```や```/Picture```など)にファイルをダウンロードしたい場合，以下のパーミッションを```AndroidManifest.xml```に追加してください．これは，Android 11以降のデバイスで必要になります (詳細は[こちら](https://developer.android.com/training/data-storage/manage-all-files?hl=ja))．\n\u003e ```.xml\n\u003e \u003cuses-permission android:name=\"android.permission.MANAGE_EXTERNAL_STORAGE\" /\u003e\n\u003e ```\n\n\u003e [!NOTE]\n\u003e WebViewで実装されているjavascriptインターフェース`window.tlab`は現在GeckoViewではサポートされていません．これはGeckoViewとjavaネイティブプラグイン（`.aar`）間の通信処理の実装の複雑さに起因します．現状は`window.tlab.unitySendMessage`の代替として`window.postMessage`の呼び出しでC#コンポーネントにメッセージを送信する機能のみ実装されていますが，将来的には`window.tlab`の機能をGeckoViewでも完全にサポートする計画です．\n\u003e GeckoViewのページスクリプトからC#コンポーネントにメッセージを送信する際は，以下のようにjavascriptを記述してください．\n\u003e ```.js\n\u003e let payload = { go: \"Test\", method: \"OnMessage\", message: \"this is test message.\" };\n\u003e window.postMessage({ type: \"TLABWEBVIWE_GECKO_NATIVE_MESSAGE\", payload: { method: \"unitySendMessage\", payload: payload } }, \"*\");\n\u003e ```\n\n\u003e [!WARNING]\n\u003e このプラグインはAndroidデバイス上でのみ動作します．Unity Editor上で実行してもWebページは表示されないことに注意してください．\n\n\u003e [!WARNING]\n\u003e `HardwareBuffer` モードは，プラグインを実行するデバイスによっては正常に動作しない場合があるかもしれません. その場合は，プロジェクトの`Graphics API`を`Vulkan`から`OpenGLES`に変更する (`HardwareBuffer`モードにおける問題は，ほとんどが，プロジェクトで`Vulkan` APIを使用している場合に報告されています)．もしくは，`HardwareBuffer` から `ByteBuffer` へ `CaptureMode` を切り替えてください (安定したレンダリングオプションです).\n\u003e \n\u003e \u003cimg src=\"Media/image.0.png\" width=\"256\"\u003e\u003c/img\u003e\n\n\u003e [!WARNING]\n\u003e Android WebViewは [WebXR API](https://developer.mozilla.org/ja/docs/Web/API/WebXR_Device_API/Fundamentals) をサポートしません．\n\n\u003e [!WARNING]\n\u003e OculusQuestはいくつかのHTML5 input タグをサポートしていません(下記参照)．それらを使用したい場合，```GeckoView```を```WebView```の代わりに```Browser```として使用してください．uGUIで実装したウィジェットを表示します．以下は，このプラグインによる，HTML5 inpu タグの対応状況です．\n\u003e \n\u003e - [x] [datetime-local](https://developer.mozilla.org/ja/docs/Web/HTML/Element/input/datetime-local)\n\u003e - [x] [date](https://developer.mozilla.org/ja/docs/Web/HTML/Element/input/date)\n\u003e - [x] [time](https://developer.mozilla.org/ja/docs/Web/HTML/Element/input/time)\n\u003e - [x] [color](https://developer.mozilla.org/ja/docs/Web/HTML/Element/input/color)\n\u003e - [ ] [week](https://developer.mozilla.org/ja/docs/Web/HTML/Element/input/week)\n\u003e - [ ] [month](https://developer.mozilla.org/ja/docs/Web/HTML/Element/input/month)\n\u003e - [ ] [image](https://developer.mozilla.org/ja/docs/Web/HTML/Element/input/image)\n\u003e - [ ] [file](https://developer.mozilla.org/ja/docs/Web/HTML/Element/input/file)\n\n\u003e [!WARNING]\n\u003e このプラグインは，```OpenGLES```と```Vulkan```の両方をサポートしていますが，```Vulkan API``` を使用する場合は，デバイスが```OpenGLES 3.1```以上をサポートしている必要があることに留意してください．\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftlabaltoh%2Ftlabwebview","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftlabaltoh%2Ftlabwebview","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftlabaltoh%2Ftlabwebview/lists"}