码迷,mamicode.com
首页 > 移动开发 > 详细

Android WebView与服务端交互Demo

时间:2014-06-22 18:08:30      阅读:394      评论:0      收藏:0      [点我收藏+]

标签:android   webview 服务端 交互   js   

使用WebView可以让Android端的开发工作大量减少,原因是在服务端可以为其做一定的工作,下面这个小Demo就实现了从Android客户端与服务端的交互。我这里客户端使用的工具是Eclipse,服务端使用MyEclipse。

实现效果图:

客户端:

bubuko.com,布布扣

点击登录按钮后,页面跳转,而在服务端Console中看到如下(只看最后一行即可):

可以看到服务端收到了客户端发过来的用户名:yao。

bubuko.com,布布扣

源代码:

客户端:

activity_main:

<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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <WebView
        android:id="@+id/webView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerHorizontal="true" />

</RelativeLayout>


MainActivity:

package com.webviewdemo1;

import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.content.DialogInterface.OnClickListener;
import android.os.Bundle;
import android.webkit.JsResult;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;

public class MainActivity extends Activity {
	private WebView webView;
	/**
	 * 服务端地址
	 */
	private String url = "http://172.16.17.36:8080/mywebviewserver/myhtml.html";

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

		webView = (WebView) findViewById(R.id.webView);
		WebSettings webSettings = webView.getSettings();
		webSettings.setJavaScriptEnabled(true);
		webView.setWebChromeClient(new WebChromeClient(){

			@Override
			public boolean onJsAlert(WebView view, String url, String message,
					final JsResult result) {
				AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
				builder.setTitle("警告");
				builder.setMessage(message);
				builder.setPositiveButton("ok", new OnClickListener() {
					
					@Override
					public void onClick(DialogInterface dialog, int which) {
						result.confirm();
					}
				});
				builder.create().show();
				return true;
			}
			
		});
		webView.loadUrl(url);
	}
}

服务端:

bubuko.com,布布扣

myhtml.html:

<!DOCTYPE html>
<html>
<head>
<title>myhtml.html</title>

<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--客户端访问服务端的URL地址:
 http://172.16.17.36:8080/mywebviewserver/myhtml.html
 -->

<script type="text/javascript">
	function dosubmit() {
		var th = document.form1;
		if (th.username.value == "") {
			alert("请输入用户名称!!");
			return;
		}
		th.action = "/mywebviewserver/servlet/Login";
	}
</script>
</head>

<body>
	<form name="form1" action="" method="post">
		<table border="1" bordercolor="#CCCCCC" cellpadding="1" width="300"
			cellspacing="1">
			<tr>
				<td align="right">用户名</td>
				<td><input type="text" name="username" value=""></td>
			</tr>
			<tr>
				<td align="right">密码</td>
				<td><input type="password" name="pswd" value=""></td>
			</tr>
			<tr>
				<td colspan="2" align="center"><input type="submit"
					name="submit" value="登陆" onclick="dosubmit()">   <input
					type="reset" name="reset" value="重置">
				</td>

			</tr>
		</table>
	</form>

</body>
</html>

Login.java:

package com.cn.login;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class Login extends HttpServlet {

	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
	}

	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		response.setContentType("text/html;chareset=utf-8");
		PrintWriter out = response.getWriter();
		String name = request.getParameter("username");
		System.out.println("---客户端输入的用户名为:->>>" + name);
		out.flush();
		out.close();
	}

}

下面给出客户端和服务端的源代码,感兴趣的可以试着运行一下:

点击下载源码


Android WebView与服务端交互Demo,布布扣,bubuko.com

Android WebView与服务端交互Demo

标签:android   webview 服务端 交互   js   

原文地址:http://blog.csdn.net/u012440207/article/details/32336633

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!