ソース掲示板




すべてから検索

キーワード   条件 表示 現行ログ 過去ログ トピックス 名前 本文
Android Studio : WebView を介してサーバーのデータベースのデータにアクセスする
日時: 2015/10/12 16:09
名前: lightbox






1) Android で入力した値を、javascript: で呼び出した関数に引数を文字列として渡す
2) その値で、Web ページはサーバーから必要な値を JSON オブジェクトでもらう( jQuery なので )
3) そのオブジェクトを JSON で文字列に変換して、Android に送る
4) Android では、その文字列を Gson で Android 内のオブジェクトに変換
5) UI スレッドへその値を送る
Syain クラス
public class Syain {
	String 社員コード;
	String 氏名;
	String フリガナ;
	String 所属;
	int 性別;
	String 作成日;
	String 更新日;
	int 給与;
	int 手当;
	String 管理者;
	String 生年月日;
}
package sample.lightbox.webview1011;

import android.graphics.Bitmap;
import android.os.Bundle;
import android.os.Handler;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.view.View;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.EditText;
import android.widget.TextView;

import com.google.gson.Gson;

public class MainActivity extends AppCompatActivity {

	// WebView のインスタンス
	private WebView wv = null;
	// 表示されているページの URL
	private String startPage = null;
	// 初期表示ページ
	private String initPage = "http://10.0.2.2/test/001.php";

	private Gson gson = null;
	private Syain syain = null;
	private Handler handler = null;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		handler = new Handler();
		gson = new Gson();

		// WebView のインスタンスを取得
		wv = (WebView) MainActivity.this.findViewById(R.id.webView);
		// Webページとのインターフェイスを登録します
		// Webページ上からは、androidObject.toAndroid で呼ぶ事ができます
		// (toAndroid は、@JavascriptInterface で登録したメソッド)
		wv.addJavascriptInterface(new JavaScriptAccess(new JavaScriptAccess.OnGetWebDataListener() {
			@Override
			public void onWebGetDataListener(String textData) {

				try {
					syain = gson.fromJson(textData,Syain.class);

					// 別スレッドから UI スレッドへのアクセス
					handler.post(new Runnable() {
						@Override
						public void run() {
							TextView tv = (TextView) MainActivity.this.findViewById(R.id.textView);
							tv.setText(syain.氏名);
						}
					});

				} catch (Exception e) {
					e.printStackTrace();
				}

				Log.i("lightbox", syain.社員コード);
				Log.i("lightbox", syain.フリガナ);
				Log.i("lightbox", Integer.toString(syain.性別));
				Log.i("lightbox", syain.作成日);
				Log.i("lightbox", syain.更新日);
				Log.i("lightbox", Integer.toString(syain.給与));
				Log.i("lightbox", Integer.toString(syain.手当));
				if ( syain.管理者 == null ) {
					Log.i("lightbox", "NULL");
				}
				else {
					Log.i("lightbox", syain.管理者 );
				}
				if ( syain.生年月日 == null ) {
					Log.i("lightbox", "NULL");
				}
				else {
					Log.i("lightbox", syain.生年月日 );
				}

			}
		}), "androidObject");



		// WebView の表示履歴を戻る為のボタン
		MainActivity.this.findViewById(R.id.button).setOnClickListener(new View.OnClickListener() {
			@Override
			public void onClick(View v) {
				wv.goBack();
			}
		});
		// Webページの JavaScript の呼び出し
		MainActivity.this.findViewById(R.id.button2).setOnClickListener(new View.OnClickListener() {
			@Override
			public void onClick(View v) {
				EditText et = (EditText) MainActivity.this.findViewById(R.id.editText);
				String scode =((EditText) MainActivity.this.findViewById(R.id.editText)).getText().toString();
				String callString = String.format("javascript:getWebPageData(\"%s\")",scode);
				wv.loadUrl(callString);
			}
		});

		// 必ず必要な JavaScript を有効にする設定
		wv.getSettings().setJavaScriptEnabled(true);
		// 必ず必要な設定
		wv.setWebViewClient(new WebViewClient(){

			// 必ず必要な設定 : 常に WebView 内でページを表示する為
			@Override
			public boolean shouldOverrideUrlLoading(WebView view, String url) {
				Log.i("lightbox", "shouldOverrideUrlLoading"+url);
				return super.shouldOverrideUrlLoading(view, url);
			}

			// オプション : 表示されたページの URL を変数にセット
			@Override
			public void onPageStarted(WebView view, String url, Bitmap favicon) {
				super.onPageStarted(view, url, favicon);

				Log.i("lightbox", "onPageStarted:" + url);
				startPage = url;

			}

			// オプション : ページを表示し終わってから発生するイベント
			@Override
			public void onPageFinished(WebView view, String url) {
				super.onPageFinished(view, url);

			}
		});

		// 目的のページを表示する
		wv.loadUrl(initPage);
	}

	@Override
	protected void onStop() {
		super.onStop();
		wv.clearHistory();
		wv.clearCache(true);

		Log.i("lightbox", "onStop");

	}

}
メンテナンス

Webページとの橋渡しをする クラス : JavaScriptAccess ( No.1 )
日時: 2015/10/12 14:11
名前: lightbox


日時: 2015/10/12 14:11
名前: lightbox
package sample.lightbox.webbrowser;

import android.util.Log;
import android.webkit.JavascriptInterface;

/**
 * Created by lightbox on 2015/09/24.
 */
public class JavaScriptAccess {
	// Webページからデータを取得するイベント用
	public interface OnGetWebDataListener {
		abstract public void onWebGetDataListener( String textData );
	}

	private OnGetWebDataListener ogwdl = null;

	public JavaScriptAccess( OnGetWebDataListener ogwdl ) {
		this.ogwdl = ogwdl;
	}

	// Webページ上の JavaScript から、Android Studio の logcat に表示します
	@JavascriptInterface
	public void logcat(String message) {
		Log.i("lightbox", message);
	}

	// コンストラクタで取得したインターフェイスのインスタンス内のメソッドを
	// 呼び出して、Webページから取得したデータを渡します
	@JavascriptInterface
	public void toAndroid(String message) {
		this.ogwdl.onWebGetDataListener(message);
	}


}
このアーティクルの参照用URLをクリップボードにコピー メンテナンス
Webページ( 001.php ) ( No.2 )
日時: 2015/10/11 22:08
名前: lightbox
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
function getWebPageData(scode) {
	// ***************************************
	// Android WebView の中のこのページ
	// より、サーバへアクセスします
	// ***************************************
	$.get("dbdata_json.php?scode="+scode,function( data ){
		if ( typeof androidObject !== 'undefined' ) {
			// サーバから受け取った application/json データ
			// を文字列に変換して Android に渡します
			androidObject.toAndroid(JSON.stringify(data));
		}
		else {
			// 通常のブラウザではこちらが実行されます
			console.log(JSON.stringify(data,null,"   "));
		}
	})
}
</script>
</head>
<body>
<pre>
<?php
// Android の呼び出しテスト
?>
<input type="button" value="logcat test" onclick="androidObject.logcat('OK')">

<?php
// サーバからのデータで Android の呼び出しテスト
?>
<input type="button" value="toAndroid test" onclick="getWebPageData('0001')">

</pre>
</body>
</html>
このアーティクルの参照用URLをクリップボードにコピー メンテナンス
MySQL から JSON データを取得する dbdata_json.php ( No.3 )
日時: 2015/10/12 13:36
名前: lightbox
<?php
header( "Content-Type: application/json; Charset=utf-8" );
header( "pragma: no-cache" );
header( "Expires: Wed, 31 May 2000 14:59:58 GMT" );
header( "Cache-control: no-cache" );
header( "Access-Control-Allow-Origin: *" );

$server = 'localhost';
$db_name = 'lightbox';
$user = 'root';
$password = 'パスワード';

$json_type =  JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT;
$db_data_type = MYSQLI_ASSOC;

// 接続
$connect = @ new mysqli($server, $user, $password, $db_name);
if ($connect->connect_error) {
	die('Connect Error (' . $connect->connect_errno . ') '
	. $connect->connect_error);
}
$connect->set_charset("utf8"); 

// クエリ
$_GET["scode"] = str_replace("'","''",$_GET["scode"]);
$result = $connect->query("select * from 社員マスタ where 社員コード = '{$_GET["scode"]}'"); 
if ( !$result ) {
	die('クエリーに誤りがあります : ' . $connect->error );
}

// 内容を書き込むファイルの準備
$log_file = "rowdata_002.json";
file_put_contents( $log_file,"" );

$check = false;
while ($row = $result->fetch_array($db_data_type)) {

	$check = true;
	print json_encode($row,JSON_UNESCAPED_UNICODE|JSON_PRETTY_PRINT);
	print "\n";

	// ファイルに追加出力
	file_put_contents( $log_file, print_r(json_encode($row,$json_type)."\n",true), FILE_APPEND );
}

// 開放
$result->close();
// 接続解除
$connect->close();

if (!$check) {
	print <<< ERROR
{
    "社員コード": "{$_GET["scode"]}",
    "氏名": "ERROR",
    "フリガナ": null,
    "所属": null,
    "性別": null,
    "作成日": null,
    "更新日": null,
    "給与": null,
    "手当": null,
    "管理者": null
}	
ERROR;
}

?>
このアーティクルの参照用URLをクリップボードにコピー メンテナンス
画面定義 ( No.4 )
日時: 2015/10/12 16:30
名前: lightbox
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context=".MainActivity">

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:id="@+id/action">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="戻る"
            android:id="@+id/button"
            android:layout_alignParentEnd="true"
            android:layout_weight="1"/>

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="JS 呼び出し"
            android:id="@+id/button2"
            android:layout_weight="1"/>
    </LinearLayout>

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/editText"
        android:layout_below="@+id/action"
        android:layout_alignParentStart="true"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="Large Text"
        android:id="@+id/textView"
        android:layout_below="@+id/editText"/>

    <WebView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/webView"
        android:visibility="visible"
        android:layout_below="@+id/textView"
        android:layout_alignParentStart="true"
        />

</RelativeLayout>
このアーティクルの参照用URLをクリップボードにコピー メンテナンス
dbdata_json.php : 社員マスタに別テーブルを結合した別バージョン ( No.5 )
日時: 2015/10/16 12:36
名前: lightbox
<?php
header( "Content-Type: application/json; Charset=utf-8" );
header( "pragma: no-cache" );
header( "Expires: Wed, 31 May 2000 14:59:58 GMT" );
header( "Cache-control: no-cache" );
header( "Access-Control-Allow-Origin: *" );

$server = 'localhost';
$db_name = 'lightbox';
$user = 'root';
$password = 'パスワード';

$json_type =  JSON_UNESCAPED_UNICODE | JSON_PRETTY_PRINT;
$db_data_type = MYSQLI_ASSOC;

// 接続
$connect = new mysqli($server, $user, $password, $db_name);
if ($connect->connect_error) {
	die('Connect Error (' . $connect->connect_errno . ') '
	. $connect->connect_error);
}
$connect->set_charset("utf8"); 

$_GET["scode"] = str_replace("'","''",$_GET["scode"]);

$query = <<< QUERY
select 社員マスタ.*,コード名称マスタ.名称 as sname from 社員マスタ
left outer join コード名称マスタ

on 社員マスタ.所属 = コード名称マスタ.コード

where コード名称マスタ.区分 = 2	
and 社員コード = '{$_GET["scode"]}'
QUERY;

// クエリ
$result = $connect->query($query); 
if ( !$result ) {
	die('クエリーに誤りがあります : ' . $connect->error );
}

$check = false;
while ($row = $result->fetch_array($db_data_type)) {

	$check = true;
	print json_encode($row,JSON_UNESCAPED_UNICODE|JSON_PRETTY_PRINT);
	print "\n";

}

// 開放
$result->close();
// 接続解除
$connect->close();

if (!$check) {
	print <<< ERROR
{
    "社員コード": "{$_GET["scode"]}",
    "氏名": "ERROR",
    "フリガナ": null,
    "所属": null,
    "性別": null,
    "作成日": null,
    "更新日": null,
    "給与": null,
    "手当": null,
    "管理者": null
}	
ERROR;
}

?>
このアーティクルの参照用URLをクリップボードにコピー メンテナンス