[交互]接口与路由问题
[交互]接口与路由问题
- 场景描述
- 问题分析
- 解决方案
这是在实战开发过程中遇到的一个问题,所以导致产生了服务端如何区分浏览器请求的是前端路由还是 api 接口的问题??
场景描述
这是一个前后端分离开发的项目,因此前端一般都会使用客户端路由,现在的场景是前端代码打包后作为 java web 的静态资源在 tomcat 中部署时,并且没有修改相关代码
此时,通过浏览器端输入域名,进入指定的 index.html 页面,加载前端路由设定,可以正常的一步步进行后续路由页面的访问
如果前端使用的 hash 路由,在浏览器直接修改路由也可以正常的进行路由的访问,与接口并不会混淆
但是如果使用的路由是浏览器路由,也即 history 模式,此时当访问非’/’(也即非根目录)的其它路由时就会出现问题
例如访问:https://xxxx 会直接跳转到前端路由"/"指定跳转到的页面.在页面中点击导航形成的跳转,会正常访问,但是当直接修改浏览器的访问路径为一个路由例如:xxxx/router/about 时服务端会将该请求直接导向 404,并不会请求前端的路由
服务端或者前端如何判断浏览器发出的请求是路由请求,还是 api 接口的请求?因为此时它们在浏览器的地址形式是完全相同的
问题分析
该问题是很久之前遇到的一个问题,当时并没有有效的解决方案,所以最终是通过将路由改为 hash 路由的方式解决的
现在在看这个问题,发现:
虽然采用了前后端分离,但是并不是完全的前后端分离
- 前后端的域名是相同的,因此导致了可能触发接口的情况
部署时将前端项目,复制到了 Java 的项目中,最终还是像未分离时部署的方式是一样的,因此域名一致 - java 项目的 xml 文件设置了静态资源的路径,指向单页面首页
- 浏览器地址非 html 后,所以没有加载前端的路由,此时自然无法实现路由的跳转
解决方案
- 完全的前后端分离,此时域名分离,自然不存在无法区分的问题
- java 配置,所有的地址指向前端的首页
相关文章:
[交互]接口与路由问题
[交互]接口与路由问题 场景描述问题分析解决方案 这是在实战开发过程中遇到的一个问题,所以导致产生了服务端如何区分浏览器请求的是前端路由还是 api 接口的问题?? 场景描述 这是一个前后端分离开发的项目,因此前端一般都会使用…...
linux 6中4T磁盘识别并分区格式化挂接
存储端划分4T的LUN后,主机端操作如下 1、主机识别,本例中hba卡的端口是host11和host12 [rootdb1 ~]# echo "- - -" > /sys/class/scsi_host/host11/scan [rootdb1 ~]# echo "- - -" > /sys/class/scsi_host/host12/scan …...
【Unity】ShaderGraph应用(浮动气泡)
【Unity】ShaderGraph应用(浮动气泡) 实现效果 一、实现的方法 1.使用节点介绍 Position:获取模型的顶点坐标 Simple Noise:简单的噪声,用于计算顶点抖动 Fresnel Effect:菲涅耳效应,用于实现气泡效果 计算用节点 Add&…...
Android EditText setTranslationY导致输入法覆盖问题
平台 RK3288 Android 8.1 显示: 1920x1080 160 dpi 概述 碰到一个问题: 弹出的输入法会覆盖文本输入框。 原因:输入框使用了setTranslationY() 位置偏移后, 输入法无法正确获取焦点的位置。 分析 先上图: 初始布局 调用etTranslation…...
MySQL 导出和导入数据
文章目录 一,导出数据(一)使用SELECT ... INTO OUTFILE语句导出数据(二)使用mysqldump工具导出数据(三)使用SELECT ... INTO DUMPFILE语句导出数据 二,导入数据(一&#…...
ubuntu22.04 设置网卡开机自启
配置文件路径 在Ubuntu中,网络配置文件通常位于/etc/netplan/目录下,其文件名以.yaml为后缀。Netplan是Ubuntu 17.10及更高版本中默认的网络配置工具,用于配置网络接口、IP地址、网关、DNS服务器等。 我们可以看到配置文件为 01-network-ma…...
持续部署:提高敏捷加速软件交付(内含教程)
在当今快节奏的数字化环境中,企业不断寻求更快地交付软件、增强客户体验并在竞争中保持领先的方法。持续部署(Continuous Deployment, CD)已成为一种改变游戏规则的方法,使企业能够简化软件交付、提高敏捷性并缩短上市时间。持续部…...
Spark_Spark内存模型管理
工作中经常用到Spark内存调参,之前还没对这块记录,这次记录一下。 环境参数 spark 内存模型中会涉及到多个配置,这些配置由一些环境参数及其配置值有关,为防止后面理解混乱,现在这里列举出来,如果忘记了&a…...
C++之operator=与operator==用法区别(二百一十八)
简介: CSDN博客专家,专注Android/Linux系统,分享多mic语音方案、音视频、编解码等技术,与大家一起成长! 优质专栏:Audio工程师进阶系列【原创干货持续更新中……】🚀 人生格言: 人生…...
【漏洞复现】WordPress插件wp-file-manager任意文件上传漏洞(CVE-2020-25213)
文章目录 前言声明一、简介二、插件介绍三、漏洞概述四、影响范围五、漏洞分析六、环境搭建七、漏洞复现手工验证file_Manager_Rce.pyfile_manager_upload.py八、修复建议前言 WordPress插件WPFileManager中存在一个严重的安全漏洞,攻击者可以在安装了此插件的任何WordPress网…...
基于安卓Java试题库在线考试系统uniapp 微信小程序
本文首先分析了题库app应用程序的需求,从系统开发环境、系统目标、设计流程、功能设计等几个方面对系统进行了系统设计。开发出本题库app,主要实现了学生、教师、测试卷、试题、考试等。总体设计主要包括系统功能设计、该系统里充分综合应用Mysql数据库、…...
Java入坑之语法糖
一、for和for-each 1.1for和for-each概念 for 循环是一种常用的循环结构,它可以通过一个变量(通常是 i)来控制循环的次数和范围。for 循环的语法格式如下: for (初始化; 布尔表达式; 更新) {//代码语句 }for-each 循环是 Java …...
VUE响应式
响应式 :::tip 提示 我们了解过响应式可以同步更新数据和视图,但是其工作原理我们最好也要了解一下。这样当你使用时遇到一些常见的错误,也能够快速定位是什么问题导致的。 了解响应式原理之前,你必须要先去了解 ES5 的 Object.defineProper…...
Godot 和 VScode配置C#环境注意事项
前言 尽管有些博主会建议如果我们熟悉C#的话,最好还是使用GDscript,而且对于小白上手也相对简单,但是C#的性能终究还是比动态语言好,也相比CPP简单些,尽管现在Godot还是有些问题,比如不像unity那样适配swit…...
三、Mediasoup进程通信实现的原理
Mediasoup 创建父子进程,js与c进程交互的通道 worker.js构造函数中创建父子进程,c通过libuv的socket可以实现 JavaScript 与 C 之间的相互收发消息 一、 父子进程通信 这是一个简单的示例,演示了如何使用 libuv 在父子进程之间进行通信。以…...
【计算机网络】 TCP——四次挥手
文章目录 流程考点 流程 主动方打算关闭连接,此时会发送一个TCP首部FIN标志位被置为1的报文,也即FIN报文,之后主动方进入FIN_WAIT_1状态。被动方收到该报文后,就向主动方发送ACK应答报文,接着被动方进入CLOSE_WAIT状态…...
「Java开发指南」在MyEclipse中的Spring开发(二)
在上文中(点击这里回顾>>),我们主要介绍了一些Spring的基本概念、Spring项目配置及向导,本章节将继续介绍如何管理多个项目,Spring配置编辑器等,欢迎持续关注~ MyEclipse v2023.1.2离线版下载(Q技术…...
策略模式,一种广泛应用于各种情况的设计模式(设计模式与开发实践 P5)
文章目录 策略模式实现思想实战 - 表单 策略模式 定义:定义一系列算法,把它们一个个封装起来,并且可以互相替换 例如,我们要计算年终奖,年终奖根据绩效 A、B、C 来计算最终数值 实现 最初我们很容易想到用 分支 if…...
90. 子集 II
给你一个整数数组 nums ,其中可能包含重复元素,请你返回该数组所有可能的子集(幂集)。 解集 不能 包含重复的子集。返回的解集中,子集可以按 任意顺序 排列。 示例 1: 输入:nums [1,2,2] 输出…...
Intel汇编语言程序设计(第7版)第四章编程练习题答案
1. 大端序转成小端序 .386 .model flat, stdcall option casemap:none include windows.inc include kernel32.inc includelib kernel32.lib include user32.inc includelib user32.lib.stack 4096.data bigEndian BYTE 12h, 34h, 56h, 78h littleEndian DWORD ?Fmt BYTE &…...
EDA(Exploratory Data Analysis)探索性数据分析
EDA(Exploratory Data Analysis)中文名称为探索性数据分析,是为了在特征工程或模型开发之前对数据有个基本的了解。数据类型通常分为两类:连续类型和离散类型,特征类型不同,我们探索的内容也不同。 1. 特征类型 1.1 连续型特征 …...
Python中的多媒体处理库有哪些?
在Python中,有几个常用的多媒体处理库,包括: Pillow - 一个强大的图像处理库,可以进行图像的读取、保存、剪裁、调整大小、滤镜处理等操作。 OpenCV - 一个用于图像和视频处理的开源计算机视觉库,提供了许多图像处理和…...
LeetCode【28. 找出字符串中第一个匹配项的下标】
不要用珍宝装饰自己,而要用健康武装身体 给你两个字符串 haystack 和 needle ,请你在 haystack 字符串中找出 needle 字符串的第一个匹配项的下标(下标从 0 开始)。如果 needle 不是 haystack 的一部分,则返回 -1 。 …...
产业互联网开始从简单的概念,逐渐成为可以落地的存在
当流量不再是红利,几乎所有的消费互联网模式开始失效。这一现象,并不仅仅只是体现在流量获取成本的不断增加上,同样还体现在流量激活的难度不断增加上。事实证明,以产业链末端为主要驱动力的发展模式,正在走入到死胡同…...
element-ui tree组件实现在线增删改
这里要实现一个tree 增删改 <!--oracle巡检项--> <template><div class"oracle_instanceType"><el-row type"flex" align"middle" justify"space-between"><iclass"el-icon-s-fold iBox"click&q…...
华为开源自研AI框架昇思MindSpore应用案例:消噪的Diffusion扩散模型
目录 一、环境准备1.进入ModelArts官网2.使用CodeLab体验Notebook实例 二、案例实现构建Diffusion模型位置向量ResNet/ConvNeXT块Attention模块组归一化条件U-Net正向扩散数据准备与处理采样训练过程推理过程(从模型中采样) 本文基于Hugging Face&#x…...
华为CD32键盘使用教程
华为CD32键盘使用教程 用爱发电写的教程! 最后更新时间:2023.9.12 型号:华为有线键盘CD32 基本使用 此键盘在不安装驱动的情况下可以直接使用,但是不安装驱动指纹识别是无法使用的!并且NFC功能只支持华为的部分电脑…...
第三节:在WORD为应用主窗口下关闭EXCEL的操作(2)
【分享成果,随喜正能量】凡事好坏,多半自作自受,既不是神为我们安排,也不是天意偏私袒护。业力之前,机会均等,毫无特殊例外;好坏与否,端看自己是否能应机把握,随缘得度。…...
Layui + Flask | 弹出层(组件篇)(04)
提示:点击阅读原文体验更佳 https://layui.dev/docs/2.8/layer/ 弹出层组件 layer 是 Layui 最古老的组件,也是使用覆盖面最广泛的代表性组件。在实现网页弹出层的首选交互方案,使用的非常频繁。 打开弹层 layer.open(options); 参数 options : 基础属性配置项。打开弹层的核…...
Electron和vue3集成(推荐仅用于开发)
本篇我们仅实现Electron和vue3通过先运行起vue3项目,再将vue3的url地址交由Electron打开的方案,仅由Electron在vue3项目上套一层壳来达到脱离本机浏览器运行目的 1、参考快速上手 | Vue.js搭建起vue3初始项目 npm install -g vue npm install -g vue/c…...
php网站做多久/游戏推广合作
ANSA、META的二次开发均基于Python开发。本文基于ANSA的帮助文档《Introduction to Python》进行一定的扩展,希望能帮助大家快速掌握这门语言。首先来介绍下这门语言里的主要数据类型,包括:整型、浮点型、复数、布尔类型、字符串、列表、元祖…...
网站策划书格式/郑州客串seo
前言 cloudflare 是一家国外的 CDN 加速服务商,还是很有名气的。提供免费和付费的加速和网站保护服务。以前推荐过的百度云加速的国外节点就是和 cloudflare 合作使用的 cloudflare 的节点。 cloudflare 提供了不同类型的套餐,即使是免费用户,…...
自己可以给公司做网站吗/千锋教育的官网
2019独角兽企业重金招聘Python工程师标准>>> 场景:生产环境下,多个普通用户登录,登录后自动记录history操作到某个统一目录保存。 具体要求: 1) 每个用户登录后自动创建子目录及history记录文件ÿ…...
临清网站制作/扬州网络优化推广
上一篇文章简单的实现了ORM(对象关系模型),这一篇文章主要实现简单的MySQL数据库操作。 想要操作数据库,首先要建立一个数据库连接。下面定义一个创建数据库连接的函数,得到一个连接叫做engine。 def create_engine(us…...
网站建设方案策划书/北京推广平台
nginx证书制作以及配置https并设置访问http自动跳转https 默认情况下ssl模块并未被安装,如果要使用该模块则需要在编译时指定–with-http_ssl_module参数,安装模块依赖于OpenSSL库和一些引用文件,通常这些文件并不在同一个软件包中。通常这个…...
济南市政府采购中心南做网站/微信朋友圈广告如何投放
最近在做京东案例:当搜索框随着滚动条的滚动产生渐变效果 /*** Created by Administrator on 2019/4/11.*/ window.onload function () {//:头部搜索快js的效果//1:获取当前banner的高度var banner document.querySelector(".jd_banner");v…...