XamarinでWebviewを使ってのJavascriptとAndroidの連携ができません。

###前提・実現したいこと
現在、VisualStudioのXamarinを使ってAndroid,iOS両方対応のアプリ開発を始めています。
ほとんどのページをWebViewでアプリ専用のWebページを見せる方向で進めているのですが
どうしてもWebページ上からネイティブのAndroid側にデータを送信しなくてはいけない事情が発生した為
addjavascriptinterfaceを使って連携させようと思ったのですがこれがうまくいきません。

AndroidStudioでの参考はいくつか調べて出てくるのですがXamarinはなかなか出てきませんので、
解決方法を教えていただけないでしょうか？

###発生している問題・エラーメッセージ

エミュレータから動作テストした際に「これ押してみて1」のボタンを押したら、デバッグ情報で以下のような内容が出てきました。

[INFO:CONSOLE(14)] "Uncaught ReferenceError: Android is not defined", source: http://192.168.11.17/App_resource/html/index.php (14)
07-10 09:27:17.413 I/chromium( 2401): [INFO:CONSOLE(14)] "Uncaught ReferenceError: Android is not defined", source: http://192.168.11.17/App_resource/html/index.php (14)

###該当のソースコード
アクセス対象のindex.php

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1">
<script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
<div id="test1"></div>
<br>
<label class="buttons click_tome" onclick="Android.Test_001();">これ押してみて1</label><br>
<div class="output"></div>
</body>
<script type="text/javascript">
$("#test1").html(Android.Test_001());
</script>
</html>

MainActivity.cs

using
1using Android.Widget;
2using Android.OS;
3using Android.Webkit;
4
5using Java.Lang;
6using Java.Interop;
7
8namespace App5_jstest
9{
10	[Activity(Label = "App5_jstest", MainLauncher = true, Icon = "@drawable/icon")]
11	public class MainActivity : Activity
12	{
13		protected override void OnCreate(Bundle bundle)
14		{
15			base.OnCreate(bundle);
16
17			// Set our view from the "main" layout resource
18			SetContentView (Resource.Layout.Main);
19
20			WebView Webs = FindViewById<WebView>(Resource.Id.webView1);
21			Webs.SetWebViewClient(new WebViewClient());
22			Webs.Settings.JavaScriptEnabled=true;
23			Webs.ClearCache(true);
24			Webs.Settings.JavaScriptCanOpenWindowsAutomatically = true;
25			Webs.LoadUrl("http://192.168.11.17/App_resource/html/index.php");
26			Webs.AddJavascriptInterface(new sampleClass(), "Android");
27
28		}
29	}
30	public class sampleClass : Java.Lang.Object
31	{
32		[JavascriptInterface]
33		public void Test_001()
34		{
35			//本来はこれがデバッグに表示されるはず....↓
36			System.Diagnostics.Debug.WriteLine("あれこれテストしてみたが.....");
37		}
38	}
39}

Main.axml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:minWidth="25px"
    android:minHeight="25px">
    <android.webkit.WebView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/webView1" />
</LinearLayout>

AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="App5_jstest.App5_jstest" android:versionCode="1" android:versionName="1.0" android:installLocation="auto">
	<uses-sdk android:minSdkVersion="16" />
	<uses-permission android:name="android.permission.INTERNET" />
	<application android:label="App5_jstest"></application>
</manifest>

###試したこと

AddJavascriptInterfaceのAndroidをsampleClassに変更しても同じでした。
sampleClassには今:Java.Lang.Object付けていますがこれを外すと
「引数1;は'App5_jstest.sampleClass'から'Java.Lang.Object'へ変換することはできません」とエラーで表示されます

###補足情報(言語/FW/ツール等のバージョンなど)

Androidエミュレータ
・Android6.0(API 23)

・Webページ
Xampp内に任意の個所にindex.phpファイルを置いてそれをWebViewで見せています

参照
https://developer.xamarin.com/recipes/android/controls/webview/call_csharp_from_javascript/

行動規範の内容に同意します

回答2件

自己解決

下記の方法で解決しました！

参照↓
https://developer.xamarin.com/recipes/android/controls/webview/call_csharp_from_javascript/
Xamarin.Androidで画面遷移を行うには？(必要なアセンブリの参照を追加)

MainActivity.csの

C#
1        [JavascriptInterface]
2        public void Test_001()
3        {
4            //本来はこれがデバッグに表示されるはず....↓
5            System.Diagnostics.Debug.WriteLine("あれこれテストしてみたが.....");
6        }

JavascriptInterfaceの上にExportを追加します

C#
1        [Export]
2        [JavascriptInterface]
3        public void Test_001()
4        {
5            //本来はこれがデバッグに表示されるはず....↓
6            System.Diagnostics.Debug.WriteLine("あれこれテストしてみたが.....");
7        }

ただこれだとMono.Android.Exportが無いよというエラーが返ってくるので
「プロジェクト」→「参照の追加」→「拡張」を選択後「Mono.Android.Export」を探してチェックを入れたら
Web側からAndroid側のメソッドを実行することができました。

投稿2017/07/12 05:40

buteneko_san

総合スコア34

普通にブラウザ開いて
http://192.168.11.17/App_resource/html/index.php
するとアクセスはできますでしょうか？
グローバルのURLを入れてアクセスできたら？
https://でしたら？

http通信ではなくファイルを読み込みたいようでしたら
Webs.LoadUrl("file:///App_resource/html/index.php");

のように記述してみるのはいかがでしょうか。

投稿2017/07/11 08:25

Kimsehwa

総合スコア312

buteneko_san

2017/07/11 09:19

回答ありがとうございます。 http://192.168.11.17/App_resource/html/index.php は自身のPCにXAMPPを起動させてのローカル経由でのURLです。 (192.168.11.17はプライベートIPアドレスです) ブラウザで開くことは確認できています。ちなみにhttpではなくLoadDataで直接htmlタグを入れても試したのですが「Click!」を押してもデバッグで同じような内容になります "Uncaught TypeError: Android.Test001 is not a function" 変更箇所は Webs.LoadUrl("http://192.168.11.17/App_resource/html/index.php"); を下記の内容に変更しただけです。 string html = "<html><body><a onclick=\'Android.Test001();\'>Click!</a></body></html>"; Webs.LoadData(html,"text/html","utf-8"); LoadDataの配置を入れ替えたりしても駄目でした。 (AddJavascriptInterfaceの前後等)

行動規範の内容に同意します

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.29%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問