Spring MVC——Spring MVC(1)

1.SpringMVC概述

1.1.MVC介绍

MVC是一种设计模式,将软件按照模型、视图、控制器来划分:

  • M:Model,模型层,指工程中的JavaBean,作用是处理数据

    JavaBean分为两类:

    • 一类称为实体类Bean:专门存储业务数据的,如 Student、User 等
    • 一类称为业务处理 Bean:指 Service 或 Dao 对象,专门用于处理业务逻辑和数据访问。
  • V:View,视图层,指工程中的html或jsp等页面,作用是与用户进行交互,展示数据

  • C:Controller,控制层,指工程中的servlet,作用是接收请求和响应浏览器

MVC的工作流程:

在这里插入图片描述

​ 用户通过视图层发送请求到服务器,在服务器中请求被Controller接收,Controller调用相应的Model层处理请求,处理完毕将结果返回到Controller,Controller再根据请求处理的结果找到相应的View视图,渲染数据 后最终响应给浏览器

MVC与三层架构的关系:

​ 他们是两个毫无相关的东西,经典三层架构是一种分层思想,将开发模式分为了这三层,每个人根据自己的专长,开发不同的模块,比如,擅长前端的工程师,那么就专研表示层即可,想办法如何让页面变的更好看,如何吸引别人;而擅长数据库的工程师,就可以只关注操作数据库的活,让查询更加快速有效,而不必关注数据该如何显示这种问题,这就是分层带来的巨大好处。

​ 而MVC是一种设计模式,目的是让HTML代码和业务逻辑代码分开,让代码看起来更加清晰,便于开发。

​ 三层架构的分层模式是典型的上下关系,上层依赖于下层。但MVC作为表现模式是不存在上下关系的,而是相互协作关系。

​ 三层是基于业务逻辑来分的,而mvc是基于页面来分的。

1.2.Spring MVC介绍

  • Spring MVC 是Spring框架的一个模块,是一个基于 MVC 设计模式的轻量级 Web 开发框架,本质上相当于 Servlet。

  • SpringMVC 是 Spring 为表示层开发提供的一整套完备的解决方案。在表述层框架历经 Strust、WebWork、Strust2 等诸多产品的历代更迭之后,目前业界普遍选择了 SpringMVC 作为 Java EE 项目表述层开发的首选方案

2.SpringMVC 的入门

2.1.环境搭建

2.1.1.创建工程

在这里插入图片描述

2.1.2.添加web支持

  1. 右键项目选择Add framework support...

    在这里插入图片描述

2.添加web支持

在这里插入图片描述

3.效果

在这里插入图片描述

  • 注意:
    1. 不要先添加打包方式
    2. 将web目录要拖拽到main目录下,并改名为webapp

2.1.3.pom.xml

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>com.wt</groupId>
    <artifactId>SpringMVC_day01</artifactId>
    <version>1.0-SNAPSHOT</version>
    <!--打包方式-->
    <packaging>war</packaging>

    <dependencies>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-context</artifactId>
            <version>5.1.8.RELEASE</version>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-web</artifactId>
            <version>5.1.8.RELEASE</version>
        </dependency>
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-webmvc</artifactId>
            <version>5.1.8.RELEASE</version>
        </dependency>

        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>servlet-api</artifactId>
            <version>2.5</version>
            <scope>provided</scope>
        </dependency>

        <dependency>
            <groupId>javax.servlet.jsp</groupId>
            <artifactId>jsp-api</artifactId>
            <version>2.0</version>
            <scope>provided</scope>
        </dependency>
    </dependencies>
    <build>
        <plugins>
            <!-- 配置Tomcat插件 -->
            <plugin>
                <groupId>org.apache.tomcat.maven</groupId>
                <artifactId>tomcat7-maven-plugin</artifactId>
                <version>2.2</version>
                <configuration>
                    <!--端口号-->
                    <port>8080</port>
                    <!--项目名-->
                    <path>/</path>
                </configuration>
            </plugin>
        </plugins>
    </build>
</project>

2.2.入门案例

2.2.1.index.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>$Title$</title>
  </head>
  <body>
  <a href="/hello">hello</a>
  </body>
</html>

2.2.2.controller

@Controller
public class HelloController {

    @RequestMapping("/hello")
    public ModelAndView hello() {
        //ModelAndView对象封装了模型数据和视图名称
        ModelAndView mv = new ModelAndView();
        //添加数据,request.setAttribute(“hello”,”hello springmvc!!”)
        mv.addObject("hello", "欢迎你 springmvc");
        //设置逻辑视图路径(转发,设置url)
        mv.setViewName("success");
        //返回数据和视图
        return mv;
    }
}

2.2.3.springmvc.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:p="http://www.springframework.org/schema/p"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc.xsd
        http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd">
	<!-- 配置创建 spring 容器要扫描的包 -->
    <context:component-scan base-package="com.wt"></context:component-scan>

    <!-- 配置视图解析器 -->
    <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/pages/"></property>
        <property name="suffix" value=".jsp"></property>
    </bean>

    <!--开启springmvc注解支持:配置HandlerMapping和HandlerAdapter-->
    <mvc:annotation-driven></mvc:annotation-driven>
</beans>

2.2.4.success.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
	<h2>${msg}</h2>
</body>
</html>

2.2.5.web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    <servlet>
        <servlet-name>springmvc</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <!-- 配置初始化参数,用于读取 SpringMVC 的配置文件 -->
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:springmvc.xml</param-value>
        </init-param>
        <!-- 表示容器在启动时立即创建servlet对象 -->
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>springmvc</servlet-name>
        <url-pattern>/</url-pattern>
    </servlet-mapping>
</web-app>

2.2.6.测试

访问:http://localhost:8080/hello

2.3.springmvc组件

2.3.1.DispatcherServlet前端控制器

用户请求到达前端控制器,它就相当于mvc模式中的c,dispatcherServlet 是整个流程控制的中心,由它调用其它组件处理用户的请求,dispatcherServlet 的存在降低了组件之间的耦合性。

2.3.2.HandlerMapping处理器映射器

HandlerMapping负责根据用户请求找到 Handler 即处理器,SpringMVC 提供了不同的映射器实现不同的映射方式,例如:配置文件方式,实现接口方式,注解方式等。

2.3.3.Handler处理器

它就是我们开发中要编写的具体业务控制器。由DispatcherServlet 把用户请求转发到 Handler。由Handler对具体的用户请求进行处理。

2.3.4.HandlAdapter处理器适配器

通过 HandlerAdapter 对处理器进行执行,这是适配器模式的应用,通过扩展适配器可以对更多类型的处理器进行执行。

适配器对应的处理器以及这些处理器的作用:

  1. AnnotationMethodHandlerAdapter 主要是适配注解类处理器,注解类处理器就是我们经常使用的 @Controller 的这类处理器
  2. HttpRequestHandlerAdapter 主要是适配静态资源处理器,静态资源处理器就是实现了 HttpRequestHandler 接口的处理器,这类处理器的作用是处理通过 SpringMVC 来访问的静态资源的请求
  3. SimpleControllerHandlerAdapter 是 Controller 处理适配器,适配实现了 Controller 接口或 Controller 接口子类的处理器,比如我们经常自己写的 Controller 来继承 MultiActionController.
  4. SimpleServletHandlerAdapter 是 Servlet 处理适配器, 适配实现了 Servlet 接口Servlet 的子类的处理器,我们不仅可以在 web.xml 里面配置 Servlet,其实也可以用 SpringMVC 来配置 Servlet,不过这个适配器很少用到,而且 SpringMVC 默认的适配器没有他,默认的是前面的三种。

2.3.5.View Resolver视图解析器

ViewResolver首先根据逻辑视图名解析成物理视图名即具体的页面地址,再生成View视图对象返回给DispatcherServlet

2.3.6.View视图渲染器

view对象会调用render将model中的数据全部存放到request中完成了请求的处理,源码如下:

public interface View {
    String RESPONSE_STATUS_ATTRIBUTE = View.class.getName() + ".responseStatus";
    String PATH_VARIABLES = View.class.getName() + ".pathVariables";
    String SELECTED_CONTENT_TYPE = View.class.getName() + ".selectedContentType";

    @Nullable
    default String getContentType() {
        return null;
    }
   //把model里的数据存放到request,request和response负载跳转	
   void render(Map<String, ?> model, HttpServletRequest request, 
               			HttpServletResponse response) throws Exception;
}

2.4.SpringMVC执行流程

  • 具体步骤

    Ø 第一步:发起请求到前端控制器(DispatcherServlet)

    Ø 第二步:前端控制器请求HandlerMapping查找 Handler

    Ø 第三步:处理器映射器HandlerMapping向前端控制器返回Handler,HandlerMapping会把请求映射为HandlerExecutionChain对象(包含一个Handler处理器对象,多个HandlerInterceptor拦截器对象),通过这种策略模式,很容易添加新的映射策略

    Ø 第四步:前端控制器调用处理器适配器去执行Handler

    Ø 第五步:处理器适配器HandlerAdapter将会根据适配的结果去执行Handler

    Ø 第六步:Handler执行完成给适配器返回ModelAndView

    Ø 第七步:处理器适配器向前端控制器返回ModelAndView (ModelAndView是springmvc框架的一个底层对象,包括 Model和view)

    Ø 第八步:前端控制器请求视图解析器去进行视图解析 (根据逻辑视图名解析成真正的视图),通过这种策略很容易更换其他视图技术,只需要更改视图解析器即可

    Ø 第九步:视图解析器向前端控制器返回View

    Ø 第十步:前端控制器进行视图渲染 (将数据(在ModelAndView对象中)填充到request域)

    Ø 第十一步:前端控制器向用户响应结果

3.RequestMapping注解

3.1.使用说明

  • 作用:用于建立请求URL和处理请求方法之间的对应关系。

  • 出现位置:

    • 类上:

      请求 URL的第一级访问目录。此处不写的话,就相当于应用的根目录。写的话需要以/开头。它出现的目的是为了使我们的 URL 可以按照模块化管理,例如:

      账户模块:

      /account/add

      /account/update

      /account/delete …

      订单模块:

      /order/add

      /order/update

      /order/delete

      红色的部分就是把RequsetMappding写在类上,使我们的URL更加精细。

    • 方法上:

      请求URL的第二级访问目录,可以窄化请求路径

  • 属性:

    value:用于指定请求的URL。它和path属性的作用是一样的。

    method:用于指定请求的方式。

    注意:以上属性只要出现2个或以上时,他们的关系是与的关系。

3.2.窄化路径示例

  • 使用二级目录访问

    @Controller
    @RequestMapping("/account")
    public class AccountController {
    
        @RequestMapping("/findAccount")
        public ModelAndView findAccount() {
            ModelAndView mv = new ModelAndView();
            mv.addObject("msg", "欢迎你 springmvc");
            mv.setViewName("success");
            return mv;
        }
    }
    
  • 在index.jsp里面定义超链接

    <a href="/account/findAccount">窄化路径</a>
    

3.3.method属性示例

  • 描述需要使用指定的请求方式来请求该方法

    @Controller
    @RequestMapping("/account")
    public class AccountController {
    	//指定的请求方式
        @RequestMapping(value = "/findAccount1", method = RequestMethod.POST)
        public ModelAndView findAccount1() {
            ModelAndView mv = new ModelAndView();
            mv.addObject("msg", "欢迎你 springmvc");
            mv.setViewName("success");
            return mv;
        }
    }
    
  • 测试:在index.jsp里使用get方式请求

    <a href="/account/findAccount1">请求方式</a>
    

    结果:

  • 我们再换一种请求方式

      <form action="account/findAccount1" method="post">
        <input type="submit" value="保存账户,post 请求">
      </form>
    

    结果:

4.controller方法返回值

4.1.返回ModelAndView

  • 说明:controller方法中定义ModelAndView对象并返回,对象中可添加model数据、指定view

4.2.返回字符串

4.2.1.逻辑视图名

  • 说明:controller方法返回字符串可以指定逻辑视图名,通过视图解析器解析为物理视图地址。

  • 返回字符串

    @Controller
    @RequestMapping("/account")
    public class AccountController {
        @RequestMapping(value = "/findAccount2")
        public String findAccount2(Model model) {
            //添加数据
            model.addAttribute("msg", "欢迎你 springmvc");
            return "success";
        }
    }
    
  • 在index.jsp里面定义超链接

    <a href="/account/findAccount2">返回字符串</a>
    

4.2.2.Redirect重定向

  • 说明:

    • Contrller方法返回结果重定向到一个url地址,如下商品修改提交后重定向到商品查询方法,参数无法带到商品查询方法中。
    • redirect方式相当于“response.sendRedirect()”,转发后浏览器的地址栏变为转发后的地址,因为转发即执行了一个新的request和response。
    • 由于新发起一个request原来的参数在转发时就不能传递到下一个url,如果要传参数可以/item/queryItem后边加参数,如下:/item/queryItem?...&…..
  • 重定向

    @Controller
    @RequestMapping("/account")
    public class AccountController {
        
        @RequestMapping(value = "/findAccount3")
        public String findAccount3() {
            return "redirect:/account/findAccount4";
        }
    
        @RequestMapping(value = "/findAccount4")
        public String findAccount4(Model model) {
            //添加数据
            model.addAttribute("msg", "这是springmvc的重定向");
            return "success";
        }
    }
    
  • 在index.jsp里面定义超链接

    <a href="/account/findAccount3">重定向</a>
    

4.2.3.forward转发

  • 说明:

    • controller方法执行后继续执行另一个controller方法,如下商品修改提交后转向到商品查询页面,修改商品的id参数可以带到商品查询方法中。
    • forward方式相当于request.getRequestDispatcher().forward(request,response),转发后浏览器地址栏还是原来的地址。转发并没有执行新的request和response,而是和转发前的请求共用一个request和response。所以转发前请求的参数在转发后仍然可以读取到。
  • 重定向

    @Controller
    @RequestMapping("/account")
    public class AccountController {
        
        @RequestMapping(value = "/findAccount3")
        public String findAccount3() {
            return "forward:/account/findAccount4";
        }
    
        @RequestMapping(value = "/findAccount4")
        public String findAccount4(Model model) {
            //添加数据
            model.addAttribute("msg", "这是springmvc的重定向");
            return "success";
        }
    }
    
  • 在index.jsp里面定义超链接

    <a href="/account/findAccount3">重定向和请求转发</a>
    

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/311511.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Deep Reinforment Learning Note 1

文章目录 Terminology Terminology st : stateot : observationat : action π θ ( a t ∣ o t ) \pi_\theta (a_t | o_t) πθ​(at​∣ot​) : policy π θ ( a t ∣ s t ) \pi_\theta (a_t | s_t) πθ​(at​∣st​) : policy (fully observed) Observation result from…

完整的模型训练套路(一、二、三)

搭建神经网络 model import torch from torch import nn#搭建神经网络 class Tudui(nn.Module):def __init__(self):super(Tudui, self).__init__()self.model nn.Sequential(nn.Conv2d(3, 32, 5, 1, 2),nn.MaxPool2d(2),nn.Conv2d(32, 32, 5, 1, 2),nn.MaxPool2d(2),nn.Conv…

蓝桥杯练习题(二)

&#x1f4d1;前言 本文主要是【算法】——蓝桥杯练习题&#xff08;二&#xff09;的文章&#xff0c;如果有什么需要改进的地方还请大佬指出⛺️ &#x1f3ac;作者简介&#xff1a;大家好&#xff0c;我是听风与他&#x1f947; ☁️博客首页&#xff1a;CSDN主页听风与他 …

单片机中的PWM(脉宽调制)的工作原理以及它在电机控制中的应用。

目录 工作原理 在电机控制中的应用 脉宽调制&#xff08;PWM&#xff09;是一种在单片机中常用的控制技术&#xff0c;它通过调整信号的脉冲宽度来控制输出信号的平均电平。PWM常用于模拟输出一个可调电平的数字信号&#xff0c;用于控制电机速度、亮度、电压等。 工作原理 …

【Helm 及 Chart 快速入门】03、Chart 基本介绍

目录 一、Chart 基本介绍 1.1 什么是 Chart 1.2 Chart ⽬录结构 1.3 Chart.yaml ⽂件 二、创建不可配置 Chart 2.1 创建 Chart 2.2 安装 Chart 三、创建可配置的 Chart 3.1 修改 chart 3.2 安装 Chart 一、Chart 基本介绍 1.1 什么是 Chart Helm 部署的应…

List列表操作中的坑

使用 Arrays.asList 把数据转换为 List 的三个坑 在如下代码中&#xff0c;我们初始化三个数字的 int[]数组&#xff0c;然后使用 Arrays.asList 把数组转换为 List&#xff1a; int[] arr {1, 2, 3}; List list Arrays.asList(arr); log.info("list:{} size:{} class…

每天刷两道题——第十二天+第十三天

1.1合并区间 以数组 i n t e r v a l s intervals intervals 表示若干个区间的集合&#xff0c;其中单个区间为 i n t e r v a l s [ i ] [ s t a r t i , e n d i ] intervals[i] [starti, endi] intervals[i][starti,endi] 。请你合并所有重叠的区间&#xff0c;并返回 …

Visual Studio Code 连接远程服务器方法

1、输入用户名和服务器ip连接远程服务器 2、选择配置文件 配置文件路径&#xff1a;C:\Users\Administrator\.ssh\config config的内容大致如下&#xff1a; Host 192.168.134.3HostName 192.168.134.3User zhangshanHost 192.168.134.3HostName 192.168.134.3User lisiHost…

基础篇_快速入门(Java简介,安装JDK,cmd命令行运行Java文件产生乱码问题的解决方式,IDE工具,实用工具)

文章目录 一. Java 简介1. JVM2. JRE3. JDK 二. 安装 JDK1. 下载和安装2. 配置 Path3. 配置 JAVA_HOME&#xff08;选讲&#xff09;优化 三. 入门案例1. 第一行代码1) jshell2) 代码解读总结 3) 为何要分成对象与方法 2. 第一份源码1) 源码结构2) 编写 java 源代码3) 编译 jav…

聊一聊 C# 线程切换后上下文都去了哪里

一&#xff1a;背景 1. 讲故事 总会有一些朋友问一个问题&#xff0c;在 Windows 中线程做了上下文切换&#xff0c;请问被切的线程他的寄存器上下文都去了哪里&#xff1f;能不能给我挖出来&#xff1f;这个问题其实比较底层&#xff0c;如果对操作系统没有个体系层面的理解…

groovy XmlParser 递归遍历 xml 文件,修改并保存

使用 groovy.util.XmlParser 解析 xml 文件&#xff0c;对文件进行修改&#xff08;新增标签&#xff09;&#xff0c;然后保存。 是不是 XmlParser 没有提供方法遍历每个节点&#xff0c;难道要自己写&#xff1f; 什么是递归&#xff1f; 不用说&#xff0c;想必都懂得~ …

基于Pixhawk和ROS搭建自主无人车(一):底盘控制篇

参考 ArduPilot Development超维空间科技乐迪MiniPix车船使用说明书 1. 硬件篇 1.1 底盘构成一览 1.2 底盘接线示意 2. 软件篇 2.1 APM 固件下载 pixhawk 是硬件平台&#xff0c;PX4 是 pixhawk 的原生固件&#xff0c;APM&#xff08;Ardupilot Mega&#xff09;是硬件平台…

C++里main函数int main(int argc, char **argv)

C里main函数int main(int argc, char **argv), 这两个参数argc和argv分别是什么

安全帽/反光衣检测AI智能分析网关V4如何查看告警信息并进行处理?

智能分析网关V4属于高性能、低功耗的软硬一体AI边缘计算硬件设备&#xff0c;目前拥有3种型号&#xff08;8路/16路/32路&#xff09;&#xff0c;支持Caffe / DarkNet / TensorFlow / PyTorch / MXNet / ONNX / PaddlePaddle等主流深度学习框架。硬件内部署了近40种AI算法模型…

9个icon图标网站,海量免费矢量图标库!

​划到最后“阅读原文”——领取工具包&#xff08;超过1000工具&#xff0c;免费素材网站分享和行业报告&#xff09; Hi&#xff0c;我是胡猛夫~&#xff0c;专注于分享各类价值网站、高效工具&#xff01; 更多内容&#xff0c;更多资源&#xff0c;欢迎交流&#xff01;公…

MacOS安装Miniforge、Tensorflow、Jupyter Lab等(2024年最新)

大家好&#xff0c;我是邵奈一&#xff0c;一个不务正业的程序猿、正儿八经的斜杠青年。 1、世人称我为&#xff1a;被代码耽误的诗人、没天赋的书法家、五音不全的歌手、专业跑龙套演员、不合格的运动员… 2、这几年&#xff0c;我整理了很多IT技术相关的教程给大家&#xff0…

应用案例 | 基于三维机器视觉的自动化无序分拣解决方案

​ 近年来&#xff0c;电商行业蓬勃发展&#xff0c;订单的海量化、订单类型的碎片化&#xff0c;使物流行业朝着“多品种、无边界、分类广”的方向迅速发展。根据许多研究机构的预测&#xff0c;电子商务销售额预计将以每年两位数的速度增长&#xff0c;推动整个行业的规模不…

【排序】快速排序(C语言实现)

文章目录 前言1. Hoare思想2. 挖坑法3. 前后指针法4. 三路划分5. 快速排序的一些小优化5.1 三数取中常规的三数取中伪随机的三数取中 5.2 小区间优化 6. 非递归版本的快排7. 快速排序的特性总结 前言 快速排序是Hoare于1962年提出的一种二叉树结构的交换排序方法&#xff0c;其…

Leetcode 416 分割等和子集

题意理解&#xff1a; 给你一个 只包含正整数 的 非空 数组 nums 。请你判断是否可以将这个数组分割成两个子集&#xff0c;使得两个子集的元素和相等。 即将数组的元素分成两组&#xff0c;每组数值sum(nums)/2 若能分成这样的两组&#xff0c;则返回true,否则返回false 本质上…

国标28181平台的手机视频监控客户端的电子地图功能对比

目 录 一、手机客户端 1、概述 2、具体功能简述 二、电子地图功能 1、经纬度定位 2、附近设备 3、实时浏览功能 4、录像回放 5、缩放功能 三、手机web客户端和CS客户端上的电子地图功能对比 1、对比表 2、测距&#xff08;PC客户端功能&#xff09; 3…