您的位置:首页 > 编程语言 > Java开发

dwr js与java互相调用

2015-07-31 16:32 387 查看
一.创建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>


最终效果: 运行项目查看

不知道为什么图片传不上去了
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: