dwr js与java互相调用

一.创建web项目

以简易的网页版群聊为列子

所需jar：commons-logging-1.0.4.jar dwr3.0.jar

1.实体类

package com.test.vo;

public class Message {
 private String userName; //用户名
 private String messgaes; //发送的消息
 public String getUserName() {
  return userName;
 }
 public void setUserName(String userName) {
  this.userName = userName;
 }
 public String getMessgaes() {
  return messgaes;
 }
 public void setMessgaes(String messgaes) {
  this.messgaes = messgaes;
 }
 
 
}

2.编写接口方法和实现

package com.dwr.test;

public interface IUserServer {
	public boolean login(String userName,String passWord);

}

3.接口简单实现

package com.dwr.testImpl;

import java.util.Collection;

import org.directwebremoting.ScriptSession;
import org.directwebremoting.WebContext;
import org.directwebremoting.proxy.dwr.Util;

import uk.ltd.getahead.dwr.WebContextFactory;

import com.dwr.test.IUserServer;
import com.test.vo.Message;

public class UserServerImpl implements IUserServer {

	@Override
	public boolean login(String userName,String passWord) {
		System.out.println("userName="+userName +"\t" + "password="+passWord);
		return userName!=null && !userName.equals("");
	}

	public void receive(Message message){
		this.broadacstMessage(message);
	}
	
	public void broadacstMessage(Message message){
		WebContext webctx = WebContextFactory.get();
		String currPage = webctx.getCurrentPage();
		Collection<ScriptSession> sessoin = webctx.getScriptSessionsByPage(currPage);
		Util util =new Util(sessoin);
		util.addFunctionCall("<span style="color:#FF0000;">updateDivMsg</span>",message); <span style="color:#FF0000;">js方法名称</span>
	}
}

4.web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" 
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5">
  <display-name>dwrDemo</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
	<servlet>
		<!-- 指定DWR核心Servlet的名字 -->
		<servlet-name>dwr</servlet-name>
		<servlet-class>
			<!-- 指定DWR核心Servlet的实现类 -->
			org.directwebremoting.servlet.DwrServlet
		</servlet-class>
		<!-- 指定DWR核心Servlet处于调试状态 -->
		<init-param>
			<param-name>debug</param-name>
			<param-value>true</param-value>
		</init-param>
		
		<init-param>
		  <param-name>pollAndCometEnabled</param-name>
		  <param-value>true</param-value>	
		</init-param>
		
		<init-param>
             <param-name>crossDomainSessionSecurity</param-name>
             <param-value>false</param-value>
      </init-param>
      <init-param>
            <param-name>allowScriptTagRemoting</param-name>
            <param-value>true</param-value>
      </init-param>
		
	</servlet>
	<!-- 指定核心Servlet的URL映射 -->
	<servlet-mapping>
		<servlet-name>dwr</servlet-name>
		<url-pattern>/dwr/*</url-pattern>
	</servlet-mapping>
</web-app>

5.dwr.xm

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC
    "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN"
    "http://getahead.org/dwr/dwr30.dtd">
<dwr>
  <allow>
    <!-- 发布dwr -->
    <create javascript="<span style="color:#FF0000;">jsUserServer</span>"  creator="new">  <span style="color:#FF0000;">jsUserServer为js页面调用时所用</span>
       <param name="class" value="<span style="color:#FF0000;">com.dwr.testImpl.UserServerImpl</span>"></param> <span style="color:#FF0000;">接口实现</span>
    </create>
    
    <convert match="com.test.vo.Message" converter="bean"></convert><span style="color:#FF0000;">//将实体类转换为json</span>
  </allow>

</dwr>

发布地址:http://127.0.0.1:8089/dwrDemo/dwr

发布成功后会产生

<script type='text/javascript' src='/dwrDemo/dwr/interface/jsUserServer.js'></script>
<script type='text/javascript' src='/dwrDemo/dwr/engine.js'></script>
<script type='text/javascript' src='/dwrDemo/dwr/util.js'></script>

复制到jsp页面

6.index.jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<script type='text/javascript' src='/dwrDemo/dwr/interface/jsUserServer.js'></script>
<script type='text/javascript' src='/dwrDemo/dwr/engine.js'></script>
<script type='text/javascript' src='/dwrDemo/dwr/util.js'></script>
<head>
<Meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<script type="text/javascript">
var currUserName = "匿名";
	function toLogin() {
		var _userName = $("userName").value;
		var _passWord = $("password").value;
		jsUserServer.login(_userName,_passWord,function(result){ <span style="color:#FF0000;">//js调用后台方法</span>
			currUserName = _userName;
			document.getElementById("resultDiv").innerHTML="登录的结果是："+result;
		});
		
	}
function toSend() {
	var _msgs = $("msg").value;
	var _msgJson = {userName:currUserName,messgaes:_msgs};
	jsUserServer.receive(_msgJson);
}

function updateDivMsg(msg) {
	var _userName = msg.userName;
	var _msgStr = msg.messgaes;
	if(currUserName == _userName){
		_msgStr = "<font color='red'>我说:"+_msgStr +"</font>";
	}else{
		_msgStr = _userName+"说:"+_msgStr;
	}
	$("msgDiv").innerHTML=$("msgDiv").innerHTML+"<br/>"+_msgStr;
}

</script>
</head>
<body onload="dwr.engine.setActiveReverseAjax(true);">
  userName:<input type="text" name="userName" id="userName"/><br/>
  password:<input type="text" name="password" id="password"/><br/>
  <input type="button" value="登录" onclick="toLogin()"/>
  
  <div id="resultDiv">
       请先登录
  </div>
  
  <input type="text" name="msg" id="msg"/> <input type="button" value="发送" onclick="toSend()"/><br/>
     聊天信息:
  <div id="msgDiv">
  </div>
</body>
</html>

最终效果: 运行项目查看

不知道为什么图片传不上去了

dwr js与java互相调用

猜你在找的Ajax相关文章