• DWR框架--让前端JS代码调用JAVA后端的方法


    目录

    1.DWR框架简介

    2.使用步骤

    2.1.pom.xml导入包

    2.2.配置web.xml文件

    2.2.1.先了解dwr的jar包(不同版本不一样,需注意)

    2.2.2.在web.xml中增加dwr配置

    2.3.配置dwr.xml

    2.4.dwr.xml常用的标签解释(不完全)

    2.5.前端引用

    2.6.dwr包自带的测试页

    3.闲话


    1.DWR框架简介

    • DWR框架是一个可以允许你去创建AJAX WEB站点的JAVA开源库。
    • 允许在浏览器的JavaScript代码中调用Web服务器的Java代码
    • 通过动态把Java类生成JavaScript,让使用者感觉调用就像发生在浏览器端
    • 核心是ajax提交,实现页面数据局部刷新

    2.使用步骤

    2.1.pom.xml导入包

    1. <dependency>
    2. <groupId>dwrgroupId>
    3. <artifactId>dwrartifactId>
    4. <version>1.1.3version>
    5. dependency>
    6. <dependency>
    7. <groupId>commons-logginggroupId>
    8. <artifactId>commons-loggingartifactId>
    9. <version>1.2version>
    10. dependency>

    这里我选择的dwr包是1.1.3版本,不同的版本后续的配置也不一样,需要注意

    2.2.配置web.xml文件

    2.2.1.先了解dwr的jar包(不同版本不一样,需注意)

    需要引入dwr的DWRServlet.class,具体可以打开dwr的jar包,查看具体路径和DWRServlet.class的路径

     可以发现DWRServlet.class的路径是\uk\ltd\getahead\dwr

    这里要留心几个文件,在当前jar的目录下:

    dwr.xml:dwr框架的配置文件,后续需要配置

    engine.js:前端需要引用,后续再说

    util.js:前端需要引用,后续再说

    2.2.2.在web.xml中增加dwr配置

    1. <servlet>
    2. <servlet-name>dwr-invokerservlet-name>
    3. <servlet-class>uk.ltd.getahead.dwr.DWRServletservlet-class>
    4. <init-param>
    5. <param-name>debugparam-name>
    6. <param-value>trueparam-value>
    7. init-param>
    8. servlet>
    9. <servlet-mapping>
    10. <servlet-name>dwr-invokerservlet-name>
    11. <url-pattern>/dwr/*url-pattern>
    12. servlet-mapping>

    其中标签中设置成true,可以启用dwr包自带的测试页面,便于后端自己调测,测试环境下推荐打开true,正式环境下推荐设置成关闭false,默认是false,不打开。

    2.3.配置dwr.xml

    2.2中提到了dwr.xml,这里需要配置自定义的配置文件

    创建一个空的dwr.xml文件,将它放在web.xml所在的WEB-INF目录下

    自定义的dwr.xml的头文件需要参照dwr包里的dwr.xml

    这里给出自定义的dwr.xml示例

    1. "1.0" encoding="UTF-8"?>
    2. dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN" "http://www.getahead.ltd.uk/dwr/dwr10.dtd">
    3. <dwr>
    4. <allow>
    5. <create creator="new" javascript="SysUserTask" >
    6. <param name="class" value= "com.achi.system.service.SysUserTaskService" />
    7. <include method="getTaskProgress"/>
    8. create>
    9. <convert match="com.achi.system.SysUserTask " converter="bean">
    10. <param name="include" value="name,age">param>
    11. convert>
    12. <convert converter="exception" match="java.lang.Exception"/>
    13. <convert converter="bean" match="java.lang.StackTraceElement"/>
    14. allow>
    15. dwr>

    2.4.dwr.xml常用的标签解释(不完全)

    : 部分定义了DWR能够创建和转换的类,以供 javascript 访问。

    : 标签中指定 javascript 中可以访问的 java 类,并定义 dwr 应当如何获得要进行远程的类的实例,其中 javascript=" testClass " 属性指定 javascript 代码访问对象时使用的名称。

    creator是类构造器,creator="new" 属性指定 java 类实例的生成方式, new 意味着 DWR 应当调用类的默认构造函数来获得实例,其他的还有 spring 方式,通过与 IOC 容器 Spring 进行集成来获得实例等

    默认情况下DWR1.1有8种创造器。它们是:

    new: 用Java的new关键字创造对象。
    none: 它不创建对象。 (v1.1+)
    scripted: 通过BSF使用脚本语言创建对象,例如BeanShell或Groovy。
    spring: 通过Spring框架访问Bean。
    jsf: 使用JSF的Bean。 (v1.1+)
    struts: 使用Struts的FormBean。 (v1.1+)
    pageflow: 访问Beehive或Weblogic的PageFlow。 (v1.1+)
    还有一个属性为scope,默认为page ,其值还有application、session、request、script。

    下的配置节点:
    标签指定要公开给 javascript 的 java 类名。
    标签指定要公开给 javascript 的方法。不指定的话就公开所有方法。
    标签指定要防止被访问的方法。
    标签指定一个J2EE角色作为访问控制检查。

    : 标签由于dwr只支持json的数据格式,因此在dwr中我们要读取javaBean中的属性,就必须将其转换成json的数据格式,这需要配置convert进行转换。

    1. <convert converter="bean" match="com.tgb.DwrTest"/>
    2.   <param name="include" value="property1, property2"/>
    3. convert>

    其中include表示只允许value中的属性可以访问,exclude表示除了value中的属性,其他属性均可访问。如果不设定param,则所有属性均可访问。

    2.5.前端引用

    在页面中引入以下javascript脚本

    1. <script type="text/javascript" src="dwr/engine.js" >script>
    2. <script type="text/javascript" src="dwr/util.js" >script>
    3. <script type="text/javascript">
    4. function saySomething(){
    5. var name=document.getElementById("name");
    6. var result=document.getElementById("result");
    7. //dwr调用sayhello方法
    8. //脚本中的SysUserTask,应该与dwr.xml文件中的'javascript="SysUserTask"'这一致。
    9. SysUserTask.getTaskProgress(name.value,function(ret){
    10. //将相应打印到页面上 result.innerHTML=ret;
    11. } );
    12. }

    1.第一句是由DWR框架在运行时自动生成的,dwr/是一个虚拟的路径,我们并不能真是的看到这个文件的存在。

    后面两句中的js文件在dwr的jar包中可以找到,可以选择拷贝这两个文件到前端,前后端分离开发模式下也可以远程访问后端的文件

    2.编写javascript调用后台java代码。如果从后台获取了返回值,还可以通过DOM技术将值表现在页面上,这时页面并不会被全局刷新,只是局部发生改变,可以极大提高用户体验。

    3.前端可以定时刷新调用后端方法

     对应的后端java端方法如下:

    1. private volatile static List currentCacheList = new CopyOnWriteArrayList<>();
    2. /**
    3. * 暴露给前端,生成js文件
    4. * 访问测试地址:http://127.0.0.1:8080/项目名/dwr/index.html
    5. * @return
    6. */
    7. public List getTaskProgress(){
    8. return currentCacheList;
    9. }

    2.6.dwr包自带的测试页

    地址:http://xxxx:8080/项目名/dwr/index.html

     点击SysUserTask,进入

     点击Execute按钮即可模拟前端进行测试。

    3.闲话

    前后端分离下,消息实时或者非实时推送到前端,有多种方案,dwr可以作为一种备选方案,亲测可用,其他的方案如:SSE,WebSocket,前端定时轮询后端接口等方案均可,但是资源消耗的代价比较高而已。

  • 相关阅读:
    认识3dmax 轴心
    Kubernetes(k8s)安装NFS动态供给存储类并安装KubeSphere
    Qt应用开发(基础篇)——视图基类 QAbstractItemView
    (三) Spring Security Oauth2.0 源码分析--认证中心全流程分析
    时代落在英伟达身上的是粒什么沙,国产GPU的机会又在哪?
    Unity技术手册-UGUI零基础详细教程-Text文本(打字、阴影、渐变)
    JavaScript常用事件
    [netcore] ASP.NET Core 中间件
    (Nacos)—nacos server集群+docker compose+节点IP问题+多数据库
    YOLOv5使用pycocotools进行评估
  • 原文地址:https://blog.csdn.net/weixin_42211693/article/details/127752694