Springcloud项目-前后端联调(一）
项目采用SpringCloud整体构建，nacos作为注册中心，Mysql和Redis进行数据存储，整体项目类似于平时使用的出行APP,idea2023编写后端，vscode编写前端
后端代码先前已经编写完毕
这部分功能主要是通过前端输入出发地和目的地之后调用后端接口计算得到总价返回到前端进行展示：
以下是前端界面，前端采用Vue框架搭建，可以使用element-ui美化界面
前端输入出发地和目的地调用高德地图提供的API计算得到出发地经纬度和目的地经纬度
可到高德地图API注册得到key
获取成功之后可以到console.log(F12查看控制台)打印获取到的经纬度，看是否能获取到
前后端联调:
后端开启Nacos后,启动以下两个微服务
前端采用npm run dev运行：
联调时可能存在跨域问题：后端可以加上@CrossOrigin(前端可以有其他解决方法）
后端接口参数进行了封装,包含以下6个参数：
前端调用三方接口得到经纬度之后加上cityCode,vehicleType共6个参数传递到后端
后端计算得到总价(与计价规则有关)返回到前端：
控制台展示：
计价规则接口：城市代码，车辆类型，起步费用，起步公里数，每公里多少钱，每分钟多少钱（可提前设定存入Mysql)
前端展示：
相关文章：
Springcloud项目-前后端联调(一）
项目采用SpringCloud整体构建，nacos作为注册中心，Mysql和Redis进行数据存储，整体项目类似于平时使用的出行APP,idea2023编写后端，vscode编写前端 后端代码先前已经编写完毕 这部分功能主要是通过前端输入出发地和目的地之后调用…...
洛谷P1525 [NOIP2010 提高组] 关押罪犯（种子并查集基础）
题目链接：P1525 [NOIP2010 提高组] 关押罪犯 - 洛谷 | 计算机科学教育新生态 题目难度：普及+/提高 题目描述： S 城现有两座监狱，一共关押着 N 名罪犯，编号分别为 1∼N，有m对罪犯，每对之间有仇恨值，问如何分配罪犯使得现 Z 市长要看到其中最大的矛盾值最小。 输入格…...
【算法刷题指南】模拟
前些天发现了一个巨牛的人工智能学习网站，通俗易懂，风趣幽默，忍不住分享一下给大家。点击跳转到网站 🌈个人主页： 南桥几晴秋 🌈C专栏： 南桥谈C 🌈C语言专栏： C语言学习系…...
学习笔记078——Java Properties类使用详解
文章目录 概述常见方法写入读取遍历 概述 Properties 继承于 Hashtable。表示一个持久的属性集，属性列表以key-value的形式存在，key和value都是字符串。 Properties 类被许多Java类使用。例如，在获取环境变量时它就作为System.getPropertie…...
若依使用 Undertow 替代 Tomcat 容器
文章目录 需求提出应用场景解决思路注意事项完整代码第一步：在 ruoyi-framework/pom.xml 文件中进行依赖配置第二步：修改 application.yml 配置文件第三步：修改文件上传工具类 FileUploadUtils.java 运行结果 需求提出 在开发若依框架的前后…...
多输入多输出 | Matlab实现WOA-CNN鲸鱼算法优化卷积神经网络多输入多输出预测
多输入多输出 | Matlab实现WOA-CNN鲸鱼算法优化卷积神经网络多输入多输出预测 目录 多输入多输出 | Matlab实现WOA-CNN鲸鱼算法优化卷积神经网络多输入多输出预测预测效果基本介绍模型背景程序设计参考资料 预测效果 基本介绍 Matlab实现WOA-CNN鲸鱼算法优化卷积神经网络多输入…...
Elasticsearch：基础概念
一、什么是Elasticsearch Elasticsearch是基于 Apache Lucene 构建的分布式搜索和分析引擎、可扩展数据存储和矢量数据库。它针对生产规模工作负载的速度和相关性进行了优化。使用 Elasticsearch 可以近乎实时地搜索、索引、存储和分析各种形状和大小的数据。Elasticsearch 是…...
Spring MVC的@ResponseBody与@RequestBody
ResponseBody注解用于将Controller的方法返回的对象，通过springmvc提供的HttpMessageConverter接口转换为指定格式的数据如：json,xml等，通过Response响应给客户端。 RequestBody注解用于读取http请求的内容(字符串)，通过springmv…...
智能商业分析 Quick BI
Quick BI 是阿里云提供的一款智能商业分析（BI）工具，旨在帮助企业快速获取业务洞察、优化决策过程、提升数据分析效率。通过强大的数据可视化和分析功能，Quick BI 能够帮助用户轻松连接多种数据源、创建多维度的报表和仪表盘&#…...
LUA基础语法
目录 变量篇 算数运算符 条件分支语句与循环语句 函数 表 Table 全局变量与本地变量 协程 元表 面向对象（封装，继承，多态） 常用自带库 垃圾回收 变量篇 print("hello") print("lua") --注释 --[[…...
SpringBoot的pom.xml文件中，scope标签有几种配置？
1.compile（默认） 含义：表示该依赖在项目的所有阶段（编译、测试、运行）都需要。 当你依赖一个库，并且这个库是你项目的核心部分，比如 Spring Boot 的spring - boot - starter - web，…...
Leetcode729： 我的日程安排表 I
题目描述： 实现一个 MyCalendar 类来存放你的日程安排。如果要添加的日程安排不会造成 重复预订 ，则可以存储这个新的日程安排。 当两个日程安排有一些时间上的交叉时（例如两个日程安排都在同一时间内），就会产生 重复…...
青少年编程与数学 02-006 前端开发框架VUE 02课题、创建工程
青少年编程与数学 02-006 前端开发框架VUE 02课题、创建工程 一、开发环境（一）WebStorm安装WebStorm配置WebStorm安装中文语言包安装 Translation插件 （二）Node.jsWindows系统安装Node.jsLinux系统安装Node.jsNode.js与Vue.js的关…...
Redis的生态系统和社区支持
Redis的生态系统和社区支持 1. Redis 生态系统 1.1 Redis核心 Redis 是一个高性能的内存存储系统，支持丰富的数据结构（如字符串、列表、集合、哈希和有序集合）。它的核心提供了： 高性能数据存储：单线程模型支持每秒数百万级别的操作。多种数据结构：适用于多样化场景，如…...
Tomcat解析
架构图 核心功能 Tomcat是Apache开源的轻量级Java ServletServlet容器，其中一个Server（Tomcat实例）可以管理多个Service（服务），一个Service包含多个Connector和一个Engine，负责管理请求到应用的…...
UML之组合与聚合
关联和链接关系在很多情况下是对称的，即被关联的两个类都有以自己为源端对方为目标端的角色存在，而且角色与源端类的属性是等价的，即在关联一端的关联端（角色）等价于另外一端的属性。例如，在下图中…...
数据结构理论篇（期末突击）
找往期文章包括但不限于本期文章中不懂的知识点： 个人主页：我要学编程(ಥ_ಥ)-CSDN博客 所属专栏： 学校课程突击 下面均是为了应付学校考试所用，如果有涉及部分知识点下面未说明，可以去我的数据结构专栏看看或者自行在…...
《一文读懂PyTorch核心模块：开启深度学习之旅》
《一文读懂PyTorch核心模块：开启深度学习之旅》 一、PyTorch 入门：深度学习的得力助手二、核心模块概览：构建深度学习大厦的基石三、torch：基础功能担当（一）张量操作：多维数组的神奇变换（二）自动微分：梯度求解的幕后英雄（三）设备管理：CPU 与 GPU 的高效调度四、to…...
摆脱Zotero存储限制：WebDAV结合内网穿透打造个人文献管理云平台
文章目录 前言一、Zotero安装教程二、群晖NAS WebDAV设置三、Zotero设置四、使用公网地址同步Zotero文献库五、使用永久固定公网地址同步Zotero文献库 前言 如果你是科研工作者、学生或者任何需要频繁处理大量学术资料的人士，你一定对如何高效管理和引用文献感到头…...
Flutter封装一个三方ViewPager学习
Flutter如何实现一个增强的 PageView，支持自定义页面切换动画。 前置知识点学习 CrossAxisAlignment CrossAxisAlignment 是 Flutter 中用于控制布局子组件在交叉轴（cross axis）方向上的对齐方式的一个枚举类。它主要在 Flex 布局模型中使…...
接口测试中缓存处理策略
在接口测试中，缓存处理策略是一个关键环节，直接影响测试结果的准确性和可靠性。合理的缓存处理策略能够确保测试环境的一致性，避免因缓存数据导致的测试偏差。以下是接口测试中常见的缓存处理策略及其详细说明： 一、缓存处理的核…...
Android Wi-Fi 连接失败日志分析
1. Android wifi 关键日志总结 (1) Wi-Fi 断开 (CTRL-EVENT-DISCONNECTED reason3) 日志相关部分： 06-05 10:48:40.987 943 943 I wpa_supplicant: wlan0: CTRL-EVENT-DISCONNECTED bssid44:9b:c1:57:a8:90 reason3 locally_generated1解析： CTR…...
linux之kylin系统nginx的安装
一、nginx的作用 1.可做高性能的web服务器 直接处理静态资源（HTML/CSS/图片等），响应速度远超传统服务器类似apache支持高并发连接 2.反向代理服务器 隐藏后端服务器IP地址，提高安全性 3.负载均衡服务器 支持多种策略分发流量…...
Admin.Net中的消息通信SignalR解释
定义集线器接口 IOnlineUserHub public interface IOnlineUserHub {/// 在线用户列表Task OnlineUserList(OnlineUserList context);/// 强制下线Task ForceOffline(object context);/// 发布站内消息Task PublicNotice(SysNotice context);/// 接收消息Task ReceiveMessage(…...
【网络安全产品大调研系列】2. 体验漏洞扫描
前言 2023 年漏洞扫描服务市场规模预计为 3.06（十亿美元）。漏洞扫描服务市场行业预计将从 2024 年的 3.48（十亿美元）增长到 2032 年的 9.54（十亿美元）。预测期内漏洞扫描服务市场 CAGR（增长率&…...
聊聊 Pulsar：Producer 源码解析
一、前言 Apache Pulsar 是一个企业级的开源分布式消息传递平台，以其高性能、可扩展性和存储计算分离架构在消息队列和流处理领域独树一帜。在 Pulsar 的核心架构中，Producer（生产者） 是连接客户端应用与消息队列的第一步。生产者…...
【第二十一章 SDIO接口(SDIO)】
第二十一章 SDIO接口 目录 第二十一章 SDIO接口(SDIO) 1 SDIO 主要功能 2 SDIO 总线拓扑 3 SDIO 功能描述 3.1 SDIO 适配器 3.2 SDIOAHB 接口 4 卡功能描述 4.1 卡识别模式 4.2 卡复位 4.3 操作电压范围确认 4.4 卡识别过程 4.5 写数据块 4.6 读数据块 4.7 数据流…...
Vue2 第一节_Vue2上手_插值表达式{{}}_访问数据和修改数据_Vue开发者工具
文章目录 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染2. 插值表达式{{}}3. 访问数据和修改数据4. vue响应式5. Vue开发者工具--方便调试 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染 准备容器引包创建Vue实例 new Vue()指定配置项 ->渲染数据 准备一个容器,例如: …...
2021-03-15 iview一些问题
1.iview 在使用tree组件时，发现没有set类的方法，只有get，那么要改变tree值，只能遍历treeData，递归修改treeData的checked，发现无法更改，原因在于check模式下，子元素的勾选状态跟父节…...
ffmpeg（四）：滤镜命令
FFmpeg 的滤镜命令是用于音视频处理中的强大工具，可以完成剪裁、缩放、加水印、调色、合成、旋转、模糊、叠加字幕等复杂的操作。其核心语法格式一般如下： ffmpeg -i input.mp4 -vf "滤镜参数" output.mp4或者带音频滤镜： ffmpeg…...