前端路径问题总结

1.相对路径
不以/开头
以当前资源的所在路径为出发点去找目标资源
语法:   
./表示当前资源的路径
../表示当前资源的上一层路径
缺点:不同位置,相对路径写法不同

2.绝对路径
以固定的路径作为出发点作为目标资源,和当前资源所在路径没关系
语法:以/开头,不同的项目中,固定的路径的出发点可能不一致,我的浏览器以http://localhost:8080为出发点
缺点:需要补充项目上下文,项目上下文会发生改变

在不同html文件中访问photo.png图片

index.html文件 img路径相对路径写法

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<img src="static/img/photo.png"/>
</body></html>

当前资源的请求路径:http://localhost:8080/demo05_path_war_exploded/index.html

当前资源是:index.html

当前资源的所在路径是:http://localhost:8080/demo05_path_war_exploded/

相对路径的规则就是当前资源的所在路径后拼接目标资源

浏览器向服务器请求http://localhost:8080/demo05_path_war_exploded/static/img/photo.png

 test.html文件

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<img src="../../../static/img/photo.png"/>
</body>
</html>

当前资源的请求路径:http://localhost:8080/demo05_path_war_exploded/a/b/c/test.html

当前资源是:test.htm

当前资源的所在路径是:http://localhost:8080/demo05_path_war_exploded/a/b/c/

相对路径的规则就是当前资源的所在路径后拼接目标资源

浏览器向服务器请求

http://localhost:8080/demo05_path_war_exploded/a/b/c/../../../static/img/photo.png

http://localhost:8080/demo05_path_war_exploded/static/img/photo.png

view.html文件无法直接访问,使用请求转发
View1Servlet

package com.yan.servlet;import jakarta.servlet.ServletException;
import jakarta.servlet.annotation.WebServlet;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;import java.io.IOException;
@WebServlet("/View1Servlet")
public class View1Servlet extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {req.getRequestDispatcher("WEB-INF/views/view.html").forward(req,resp);//请求转发}
}

view.html文件

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<img src="../../static/img/photo.png"/>
</body>
</html>

当前资源的请求路径:http://localhost:8080/demo05_path_war_exploded/View1Servlet

当前资源是:View1Servlet

当前资源的所在路径是:http://localhost:8080/demo05_path_war_exploded/

相对路径的规则就是当前资源的所在路径后拼接目标资源

浏览器向服务器请求

http://localhost:8080/demo05_path_war_exploded/../../static/img/photo.png

http://localhost:8080/static/img/photo.png 无法找到图片

正确代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<img src="static/img/photo.png"/>
</body>
</html>

当前资源的请求路径:http://localhost:8080/demo05_path_war_exploded/View1Servlet

当前资源是:View1Servlet

当前资源的所在路径是:http://localhost:8080/demo05_path_war_exploded/

相对路径的规则就是当前资源的所在路径后拼接目标资源

浏览器向服务器请求

http://localhost:8080/demo05_path_war_exploded/static/img/photo.png可以找到图片

绝对路径

绝对路径 以固定的路径作为出发点作为目标资源,和当前资源所在路径没关系 语法:以/开头,不同的项目中,固定的路径的出发点可能不一致,我的浏览器以http://localhost:8080为出发点 缺点:需要补充项目上下文,项目上下文会发生改变

index.html文件 

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<img src="/demo05_path_war_exploded/static/img/photo.png"/>
</body></html>

通过head标签中的base标签可以把所有不加修饰的相对路径加上href定义的公共前缀变为绝对路径

<head><meta charset="UTF-8"><title>Title</title><base href="/demo05_path_war_exploded/">
</head>

重定向的路径问题

例1: 

Servlet01 

@WebServlet("/Servlet01")
public class Servlet01 extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {resp.sendRedirect("Servlet02");//重定向}
}

 Servlet02

@WebServlet("/Servlet02")
public class Servlet02 extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {System.out.println("Servlet02执行了");}
}

当前资源的请求路径:http://localhost:8080/demo05_path_war_exploded/Servlet01

当前资源是:Servlet1

当前资源的所在路径是:http://localhost:8080/demo05_path_war_exploded/

重定向使用相对路径写法

  resp.sendRedirect("Servlet02");//重定向

浏览器响应:看Location

浏览器向服务器请求

ttp://localhost:8080/demo05_path_war_exploded/Servlet02

例二:

servlet01

@WebServlet("/x/y/z/Servlet01")
public class Servlet01 extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {resp.sendRedirect("../../../Servlet02");}
}

servlet02

@WebServlet("/Servlet02")
public class Servlet02 extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {System.out.println("Servlet02执行了");

当前资源的请求路径:http://localhost:8080/demo05_path_war_exploded/x/y/z/Servlet01

当前资源是:Servlet01

当前资源的所在路径是:http://localhost:8080/demo05_path_war_exploded/

重定向使用相对路径写法

  resp.sendRedirect("../../../Servlet02");//重定向

浏览器响应:看Location

 

浏览器向服务器请求

ttp://localhost:8080/demo05_path_war_exploded/x/y/z/../../../Servlet02

ttp://localhost:8080/demo05_path_war_exploded/Servlet02

总结:相对路径规则和前端相对路径一致

例三:

绝对路径重定向:

Servlet01:

@WebServlet("/x/y/z/Servlet01")
public class Servlet01 extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {resp.sendRedirect("/demo05_path_war_exploded/Servlet02");}
}

Servlet02: 

@WebServlet("/Servlet02")
public class Servlet02 extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {System.out.println("Servlet02执行了");}
}

 以下代码得到绝对路径更灵活

ServletContext servletContext = req.getServletContext();
String contextPath =servletContext.getContextPath();//返回项目的上下文路径
resp.sendRedirect(contextPath+"/servlet02");

 绝对路径以http://localhost:8080为出发点

浏览器向服务器请求

ttp://localhost:8080/demo05_path_war_exploded/Servlet02

 请求转发的路径问题

 例1:

请求转发的相对路径写法:

Servlet01:

@WebServlet("/Servlet01")
public class Servlet01 extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {req.getRequestDispatcher("Servlet02").forward(req,resp);//相对路径写法}
}

Servlet02:

@WebServlet("/Servlet02")
public class Servlet02 extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {System.out.println("Servlet02执行了");}
}

例2:

请求转发的绝对路径写法,不需要写上下文

Servlet01

@WebServlet("/Servlet01")
public class Servlet01 extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {//绝对路径写法不需要添加项目上下文//请求转发的/代表 项目上下文req.getRequestDispatcher("/Servlet02").forward(req,resp);}
}

 Servlet02

@WebServlet("/Servlet02")
public class Servlet02 extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {System.out.println("Servlet02执行了");}
}

 

 不设置项目上下文

在idea 的编辑配置-部署中将应用程序上下文 改为/

好处:原来/demo05_path_war_exploded/Servlet02的绝对路径写法,现在写为/Servlet02

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

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

【Godot4自学手册】第三十四节来回无限滚动的伤害铁刺球

【Godot4自学手册】第三十四节来回无限滚动的伤害铁刺球

本节主要学习给地宫添加来回滚动的铁刺球&#xff0c;铁刺球共有两个方向&#xff0c;一个是左右方向&#xff1b;另一个是上下方向。如果主人公不小心碰到球&#xff0c;就会收到伤害。这是地宫的第一个机关。 一、新建场景并布局节点 把我们准备好的铁球图片素材拖入到文件…
阅读更多...
基于单片机的测时仪系统设计

基于单片机的测时仪系统设计

**单片机设计介绍&#xff0c;基于单片机的测时仪系统设计 文章目录 一 概要二、功能设计设计思路 三、 软件设计原理图 五、 程序六、 文章目录 一 概要 基于单片机的测时仪系统设计是一个结合了单片机技术与测时技术的综合性项目。该设计的目标是创建一款精度高、稳定性强且…
阅读更多...
【数据结构】复杂度(长期维护)

【数据结构】复杂度(长期维护)

本篇博客主要是浅谈数据结构概念及时间复杂度&#xff0c;并做长期的维护更新&#xff0c;有需要借鉴即可。 复杂度目录 一、初识数据结构1.基础概念2.如何学好数据结构 二、复杂度1.复杂度2.时间复杂度①有限数的时间复杂度②函数的时间复杂度③二分查找时间复杂度④递归拓展练…
阅读更多...
汇编语言作业（二）

汇编语言作业（二）

目录 一、实验目的 二、实验内容 三、实验步骤以及结果 四、实验结果与分析 五、实验总结 一、实验目的 1、巩固debug命令 2、使用 debug 来进行寄存器、内存中内容的查看和修改 3、使用 debug 来进行程序的调试 二、实验内容 上图是一段指令代码 &#xff0c;机器码和汇编…
阅读更多...
ubuntu更换国内镜像源，下载增速

ubuntu更换国内镜像源，下载增速

方法一&#xff1a;通过脚本更换源 1.备份原来的源 sudo cp /etc/apt/sources.list /etc/apt/sources_init.list 将原来的源保留一下&#xff0c;以后想用还可以继续用 2.更换源 sudo gedit /etc/apt/sources.list 使用gedit打开文档&#xff0c;将下面的阿里源复制进去&am…
阅读更多...
Java零基础入门-java8新特性(完结篇)

Java零基础入门-java8新特性(完结篇)

一、概述 ​上几期&#xff0c;我们是完整的学完了java异常类的学习及实战演示、以及学习了线程进程等基础概念&#xff0c;而这一期&#xff0c;我们要来玩点好的东西&#xff0c;那就是java8&#xff0c;我们都知道java8是自2004年发布java5之后最重要且一次重大的版本更新&a…
阅读更多...
走进车厂 | 移远通信以前沿车载技术，照亮智能网联汽车产业创新发展之路

走进车厂 | 移远通信以前沿车载技术，照亮智能网联汽车产业创新发展之路

无钥匙自动解锁方便快捷、实时路况导航精准高效、语音指令轻松控制车辆、车载娱乐系统丰富多样……随着智能化、数字化浪潮的不断推进&#xff0c;现如今的汽车出行焕然一新。 正如我们所见&#xff0c;汽车产业正在经历前所未有的变革。物联网、车联网等前沿技术的发展和应用&…
阅读更多...
idea Springboot校园新闻系统VS开发mysql数据库web结构java编程计算机网页源码maven项目

idea Springboot校园新闻系统VS开发mysql数据库web结构java编程计算机网页源码maven项目

一、源码特点 springboot 校园新闻发布系统是一套完善的信息系统&#xff0c;结合springboot框架和bootstrap完成本系统&#xff0c;对理解JSP java编程开发语言有帮助系统采用springboot框架&#xff08;MVC模式开发&#xff09;&#xff0c;系统具有完整的源代码和数据库&a…
阅读更多...
ubuntu无法粘贴复制windows中的内容，分辨率无法自适应电脑自带系统

ubuntu无法粘贴复制windows中的内容，分辨率无法自适应电脑自带系统

1、直接在命令行执行以下命令 sudo apt-get autoremove open-vm-tools //卸载已有的工具 sudo apt-get install open-vm-tools //安装工具open-vm-tools sudo apt-get install open-vm-tools-desktop //安装open-vm-tools-desktop 2、重启Ubuntu系统即可 3.如果上述…
阅读更多...
mbti，ESTP型人格的心理问题分析

mbti，ESTP型人格的心理问题分析

什么是ESTP型人格 ESTP分别代表外向&#xff0c;实感&#xff0c;理智&#xff0c;依赖&#xff0c;而ESTP型人格则是一种性格上十分激进&#xff0c;喜欢冒险&#xff0c;并且总是因为情绪起伏过大&#xff0c;而一下子做出应激行为的相对冒险的人格。具有ESTP型人格的人一般…
阅读更多...
蓝桥杯 --- 日期问题模板

蓝桥杯 --- 日期问题模板

目录 1.如何判断闰年 2.如何遍历当前年份的每一天 3.如果想要输出某一年某一天到某一年某一天之间一共有多少天。 4.精确到具体周几到周几的问题分析 5.如何直接通过一层for循环枚举年月日 习题&#xff1a; 蓝桥杯竞赛特别喜欢考日期问题&#xff0c;今天给大家分享一下…
阅读更多...
EfficientVMamba实战：使用 EfficientVMamba实现图像分类任务（二）

EfficientVMamba实战：使用 EfficientVMamba实现图像分类任务（二）

文章目录 训练部分导入项目使用的库设置随机因子设置全局参数图像预处理与增强读取数据设置Loss设置模型设置优化器和学习率调整策略设置混合精度&#xff0c;DP多卡&#xff0c;EMA定义训练和验证函数训练函数验证函数调用训练和验证方法 运行以及结果查看测试完整的代码 在上…
阅读更多...
HarmonyOS（鸿蒙）——单击事件

HarmonyOS（鸿蒙）——单击事件

2.4 实现ClickedListener接口并重写onClick方法 2.5 实现onClick方法中的具体逻辑&#xff0c;以此完成点击事件的相关业务操作 三、测试 3.1 登录远程模拟器 3.2 运行项目 四、精选好文 一、简介 1.1 什么是组件 组件就是文本、按钮、图片等元素的统称 1.2 什么是事件 …
阅读更多...
grep无法使用完整的正则表达式

grep无法使用完整的正则表达式

问题描述 grep无法使用完整的正则表达式&#xff0c;比如前置断言、后置断言、\d和\t、\n等 问题原因 使用了扩展正则&#xff0c;而不是perl正则。规则和perl正则不同 从文档上讲得很清楚&#xff1a; -E PATTERN is an extended regular expression 他是扩展表达式&#…
阅读更多...
AI编程005/ 逆向生成mysql的建表语句

AI编程005/ 逆向生成mysql的建表语句

1/ 通过insert into 语句生成建表语句 有些时候我们能获取到表的insert语句&#xff0c;但是没有表结构。我们可以借助AI工具&#xff0c;让其逆向生成mysql的建表语句。 提示词如下&#xff1a; 根据下面的SQL语句&#xff0c;逆向生存mysql的建表语句&#xff0c;每个字段…
阅读更多...
一文掌握线程池实现原理

一文掌握线程池实现原理

线程池简介 Java在使用线程执行程序时&#xff0c;需要调用操作系统内核的API创建一个内核线程&#xff0c;操作系统要为线程分配一系列的资源&#xff1b;当该Java线程被终止时&#xff0c;对应的内核线程也会被回收。因此&#xff0c;频繁的创建和销毁线程需要消耗大量资源。…
阅读更多...
提高空调压缩机能效的通用方法

提高空调压缩机能效的通用方法

压缩机的能效提高主要依靠技术改进而不是大幅度增加材料的消耗&#xff0c;这也是技术经济性最好的节能手段。 1、改进电机效率&#xff0c;电机效率的提高意味着压缩机电效率的提高和压缩机总体效率的提高&#xff1b; 1.1、降低定子铜耗 降低定子绕组中电流通过所产生的铜耗…
阅读更多...
Android Studio下载及安装和Gradle的配置（非常详细）从零基础入门到精通，看完这一篇就够了

Android Studio下载及安装和Gradle的配置（非常详细）从零基础入门到精通，看完这一篇就够了

文章目录 下载安装修改Sdk的位置创建项目修改Gradle的位置查看AS版本工具栏–View项工具栏–Build下的功能说明Build Variants视图说明下载模拟器&#xff08;avd&#xff09;/安卓虚拟设备 屏幕熄灭功能关闭虚拟设备功能删除自己开发的应用软件将开发的应用运行到虚拟设备上。…
阅读更多...
GIS水文分析计算流向学习

GIS水文分析计算流向学习

1 初步操作 流向&#xff0c;即水文表面水的流向&#xff1b; 水文分析的很多功能需要基于流向栅格&#xff1b; 在 SuperMap 中&#xff0c;对中心栅格的8个邻域栅格进行编码&#xff1b; 每一个中心栅格的水流方向都由这八个值中的某一个值来确定&#xff1b; 我还没弄懂水…
阅读更多...
VUE3和SpringBoot实现ChatGPT页面打字效果SSE流式数据展示

VUE3和SpringBoot实现ChatGPT页面打字效果SSE流式数据展示

在做这个功能之前&#xff0c;本人也是走了很多弯路&#xff08;花了好几天才搞好&#xff09;&#xff0c;你能看到本篇博文&#xff0c;那你就是找对地方了。百度上很多都是使用SseEmitter这种方式&#xff0c;这种方式使用的是websocket&#xff0c;使用这种方式就搞复杂了&…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023