How DWR implements Ajax-JS Tutorial-php.cn

How DWR implements Ajax

零到壹度

Release： 2018-04-21 14:48:10

Original

1820 people have browsed it

The content of this article is about how DWR implements Ajax. It has a certain reference value. Now I share it with you. Friends in need can refer to it

一, Introduction to Ajax.

AJAX = Asynchronous JavaScript and XML.

AJAX is not a new programming language, but a new way of using existing standards.

The biggest advantage of AJAX is that it can exchange data with the server and update part of the web page content without reloading the entire page.

AJAX does not require any browser plug-ins, but requires the user to allow JavaScript to execute on the browser.

2. Introduction to DWR

1. Official website address http://directwebremoting.org

2. DWR is Easy Ajax for Java. DWR (Direct Web Remoting) is a remote server-side Ajax open source framework used to improve the interaction between web pages and Java classes. It can help developers develop websites that include AJAX technology. It allows code in the browser to use JAVA functions running on the WEB server as if it were inside the browser.

3. Code implementation

1. Download the jar package

It is best to go to the official website for the download address. It’s less than 1M in total, so it doesn’t take long to download.

Download address: https://github.com/directwebremoting/dwr/releases/download/3.0.2-RELEASE/dwr.jar

#2. Configure dwr

## (1) Eclipse or MyEclipse to create a web project. It is best to choose to display the web.xml file because it will be used later.

(2) Create the dwr.xml file in the WEB-INF directory. This is the configuration file of DWR. The code in the configuration file is as follows:

Other places do not need to be changed. It should be noted that javascript = "Demo" here "demo" here can be named by yourself,

and Value = " cn.smileyan.cy.Cyservice" can also be modified by yourself. Pay attention to the one-to-one correspondence with the src directory.

In other words, I have a class named Cyservice under the cn.smileyan.cy package. This class is the key class for Ajax methods to communicate with the background.

<?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>
    <create creator="new" javascript="Demo" scope="application">
      <include method="get"/>
      <param name="class" value="cn.smileyan.cy.Cyservice"/>
    </create>
  </allow>
</dwr>

Copy after login

#(3) Add DWR configuration in web.xml

 <servlet>
  	<display-name>DWR Servlet</display-name>
  	<servlet-name>dwr-invoker</servlet-name>  
  	<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
  	<init-param>
      <param-name>debug</param-name>
      <param-value>true</param-value>
  	</init-param>
  </servlet>

  <servlet-mapping>
    <servlet-name>dwr-invoker</servlet-name>
	<url-pattern>/dwr/*</url-pattern>
  </servlet-mapping>

Copy after login

#3. ## Special reminder, You need to pay attention to the script code that introduces DWR, remember to correspond to Demo.js

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script type="text/javascript" src="dwr/engine.js"></script>
<script type="text/javascript" src="dwr/util.js"></script>
<script type="text/javascript" src="dwr/interface/Demo.js"></script>
<script>
  
  function doTest(){
	Demo.get(callback);            /*此处.get对应的是Java类中的方法*/
  }
  
  var callback = function dddddddd(data){
  	dwr.util.setValue("demo",data);
  }
  
</script>

</head>
<body>
  <input type="button" value="time" onClick="doTest()"/>
  <input type="text" id="demo" size="40">
</body>
</html>

Copy after login

4. JAVA code

package cn.smileyan.cy;

public class Cyservice {
	public String get(String str) {
		return "Hello DWR !"; 
	}
}

Copy after login

5. Run, then click the button to see the effect

4. Summary

This example is very simple, but it is different from the simple js implementation of hiding and displaying. Because this actually converts java code into js code, that is, the Cyservice class corresponds to Demo.js, and the Demo.get method actually calls the get method of the Cyservice object.

The advantage of this is that it enables interaction with the background without jumping, which greatly improves the user experience.

Related recommendations:

DWR implements AJAX learning

The subtle relationship between DWR and AJAX

## Instant messaging in b/s mode, using the ajax framework dwr to achieve

DWR framework experience (achieving ajax-based non-refresh effect)

# #

The above is the detailed content of How DWR implements Ajax. For more information, please follow other related articles on the PHP Chinese website!