spring boot项目资源跳转,及引入js、css和a标签,ajax等的路径问题

这篇具有很好参考价值的文章主要介绍了spring boot项目资源跳转,及引入js、css和a标签,ajax等的路径问题。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

1、请求转发的路径问题

请求转发是服务器内部资源的一种跳转方式,即当浏览器发送请求访问服务器中
的某一个资源(A)时,该资源将请求转交给另外一个资源(B)进行处理并且由资
源B做出响应的过程,就叫做请求转发。
springboot引入js,java,spring boot,javascript,css
请求转发的特点:
springboot引入js,java,spring boot,javascript,css
请求转发实现:

request.getRequestDispatcher(url地址/转发到资源的地址).forward(req, res);
//从当前Servlet转发到 index.jsp(http://localhost/day10/index.jsp) 
//request.getRequestDispatcher("/index.jsp").forward(request, response); 
request.getRequestDispatcher("index.jsp").forward(request, response);

spring mvc的转发

/* 测试请求转发(forward) */ 
@RequestMapping("testForward") 
public String testForward(){ System.out.println("测试请求转发(forward)..."); 
return "forward:hello"; 
//return "forward:/hello"; 
}

可以看出转发路径前面加不加“/”都可以,这是因为是服务器内部资源的跳转,路径是从后面拼接而来的。

2、重定向的路径问题

当浏览器向服务器发请求访问某一个资源A,资源A在响应时通知浏览器需要再
进一步请求才能获取到对应的资源,浏览器再次发请求访问服务器中的资源B,最终
由资源B响应浏览器要获取的资源,这个过程叫做重定向。
springboot引入js,java,spring boot,javascript,css
重定向的特点:
springboot引入js,java,spring boot,javascript,css

springboot引入js,java,spring boot,javascript,css
实现代码:

response.sendRedirect(所重定向到资源的URL地址);
//测试1: 从当前Servlet(day10/TestRedirect)重定向到day10/index.jsp 
// http://localhost/day10/TestRedirect
// http://localhost/day10/index.jsp 
response.sendRedirect( "http://localhost/day10/index.jsp" ); 
response.sendRedirect( "/day10/index.jsp" ); 
response.sendRedirect( "/index.jsp" ); //错误路径 localhost/index.jsp
response.sendRedirect( "index.jsp" ); //正确路径 
//测试2: 从当前Servlet重定向到day09/index.jsp 
response.sendRedirect( "http://localhost/day09/index.jsp" ); 
//测试3: 从当前Servlet重定向到百度首页 
response.sendRedirect( "http://www.baidu.com" );

springboot实现重定向

/* 测试请求重定向(redirect) */ 
@RequestMapping("testRedirect") 
public String testRedirect(){ 
System.out.println("测试请求重定向(redirect)...");
 return "redirect:hello"; 
// return "redirect:/hello"; 可能报错
 }

可以看出重定向路径前面加“/”是可能会报错的,这是因为是两次请求,可能是不同服务器之间的资源跳转,如果前面加上“/”,会从绝对目录下拼接,就会出现下面的错误
url:http://localhost:8080/DataShow/logout

@RequestMapping("/logout") 
public String testRedirect(){ 
System.out.println("测试请求重定向(redirect)...");
 return "redirect:/login"; 

springboot引入js,java,spring boot,javascript,css
springboot引入js,java,spring boot,javascript,css
redirect:/login,如果加了“/”
可以看出重定向的路径是直接从绝对路径(/localhost:8080/)后面拼接的,而不是从项目的根目录(/localhost:8080/DataShow)后面拼接的。如果springboot配置文件是这样,不会报错,或者去掉login前面”/"或者改为“./”。

server:
  port: 8080
  servlet:
    context-path: /

3、springboot的html引入js、css

先看看配置文件

# 端口配置
server:
  port: 8080
  servlet:
    context-path: /DataShow

url:http://localhost:8080/DataShow/
引入js、css路径

<link rel="stylesheet" type="text/css"
	href="/static/bootstrap-3.3.4/css/bootstrap.css">
	<script src="/static/hhassets/js/jquery.min.js"></script>

可以看出是以“/"开始的,加载后,是直接从(localhost:8080/)后面拼接的,会报错,我们需要从/**localhost:8080/DataShow/**后面拼接,给前面“/”加个点“./”或者去掉前面的“/”,就不会报错或者配置文件url改为“/”。
springboot引入js,java,spring boot,javascript,css

springboot引入js,java,spring boot,javascript,css

<link rel="stylesheet" type="text/css"
	href="./static/bootstrap-3.3.4/css/bootstrap.css">
<script src="./static/hhassets/js/jquery.min.js"></script>

4、a标签路径

先看配置文件

# 端口配置
server:
  port: 8080
  servlet:
    context-path: /DataShow

url:http://localhost:8080/DataShow/

 <a href="/index" class="a-access">
			<button class="button type1">进入后台</button>
		</a>

springboot引入js,java,spring boot,javascript,css

可以看出路径前面有“/”,点击进入后台,url变为:http://localhost:8080/index,可以看出是从localhost:8080后面拼接的,而我们需要给前面“/”加个点“./”或者去掉前面的“/”,就不会报错或者配置文件url改为“/”。
server:
port: 8080
servlet:
context-path: /

5、总结

./ 表示当前目录,可以省略
…/ 表示父级目录。
…/…/ 表示上级目录的父级目录。
/ 表示 根目录。

当我们进行重定向,引入js、css或者a标签等的路径前面加上斜杠“/”的时候,是表示从根目录(ip:端口)后面进行拼接的,所以我们需要将项目访问路径配置为/localhost:8080这种类型。或者我们修改目录路径(./ …/ …/…/)来达到访问路径:redirect:hello,(/localhost:8080/DataShow/static/hhassets/js/jquery.min.js)

如果controllerurl是:/localhost:8080/DataShow/index/
那么引入的js、css 就是前面两个点:…/static/…

url组成:请求协议://ip(域名):端口/项目名(web应用)/…
所以说,我们如果端口后面跟了项目名,那些从根目录(也就是“/”开头)下访问的url就是会报错的,因为以“/”开头拼接在端口后面。文章来源地址https://www.toymoban.com/news/detail-616345.html

到了这里,关于spring boot项目资源跳转,及引入js、css和a标签,ajax等的路径问题的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 解决引入spire.doc.free-3.9.0.jar导致spring boot项目无法使用maven的install问题

    问题背景: 在一个项目中需求中需要导出一个word模板,那之前有做过一个这个类似需求,这次使用的是freemarker模版。在引入spire.doc.free-3.9.0.jar依赖的时候发现maven依赖报红色,悬浮提示aliyun找不到改包,没有太在意这个部分,本地能够正常使用。本地仓库存在这个jar包,并

    2024年02月15日
    浏览(52)
  • 引入Bootstrap的CSS样式后,<h>标签、<p>标签等HTML自带的标签被覆写没有?答:覆写了。

    引入Bootstrap的CSS样式后,标签、 标签等HTML自带的标签被覆写没有?答:覆写了。 为什么这么说?证据呢? 写一个实例,然后调试模式看一下不就得了。 先看没有引入引入Bootstrap的CSS样式情况。 代码如下: 我们用浏览器打开上面的代码,然后F12进入调试模式,发现h1的样式如

    2024年02月09日
    浏览(40)
  • spring boot 引入hive

    在Spring Boot中使用Hive,需要引入以下依赖: 然后,在 application.properties 中配置Hive相关信息: 其中, fs.defaultFS 指定HDFS的地址, hive.metastore.uri 指定Hive的元数据服务地址。 使用Hive可以通过以下方式: 其中, HiveConf 可以从Spring容器中自动注入。在这个例子中,使用Hive的 Dri

    2024年02月15日
    浏览(35)
  • jquery动态引入js和css

    直接上代码吧,但是有时候这个方法会失败,js文件里面的方法不生效,原因还在找

    2024年01月21日
    浏览(70)
  • spring boot 引入redis报错

    bug描述 : org.springframework.beans.factory.UnsatisfiedDependencyException: Error creating bean with name ‘assetChangeOrderController’: Unsatisfied dependency expressed through field ‘redisTemplate’; nested exception is org.springframework.beans.factory.UnsatisfiedDependencyException: Error creating bean with name ‘redisTemplate’ defined in c

    2024年01月20日
    浏览(51)
  • 15. unity官网资源商店的免费资源引入自己项目中

    1. 说明 在unity开发中可以在官网引入一些免费的资源,免得自己找不到合适的素材 第一步: 首先进入Unity资源商店官网,https://assetstore.unity.com/,计入并登录自己的unity账号,如果没账号,可以注册一个。 然后选择 免费热门资源 ,在资源列表中选择适合自己的资源,在其右

    2024年02月04日
    浏览(59)
  • 如何在Qt项目中引入图片资源

    首先,在Qt项目里创建一个目录 icon ,然后将图片资源放 icon 目录中 在Qt creator中创建resource file 右键项目 myqtdesign Add New... Qt Qt Resource File 输入文件名 myimage ,并在 CMakeLists.txt 加入 myimage.qrc 并保存(control + s) 3. 添加前缀 /images 右键 myimage.qrc 文件 Add Prefix... ,结果如下图: 添

    2024年02月13日
    浏览(52)
  • vue3引入JS-SDK实现h5分享小卡片、跳转微信小程序功能

    微信js-sdk官方文档: https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html 想要实现的效果: 1.登录微信公众平台,进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。 2.通过npm引入js-sdk 安装成功后,可以在package.json中找到\\\"weixin-js-sdk\\\" 3.在main.js中,将js-sdk挂载

    2024年02月11日
    浏览(68)
  • flutter项目引入本地静态图片资源并展示

    想要在flutter中引入静态资源,需要配置pubspec.yaml,将本地的静态资源添加到assets下面: 然后在flutter引入这些静态资源:  就可以在app中看到这个图片了:  也可以使用网络图片:

    2024年02月05日
    浏览(61)
  • 用纯HTML,JS,CSS实现横向滚动标签页

    前不久,在我的一个项目中,需要展示一个横向滚动的标签页,它支持鼠标横向拖动和点击切换。在实现的过程中,我发现这个小功能需要同时用到前端的三辆马车,但是实现难度不高,而且最终效果还不错,是个难得的初学者项目,于是萌生了写这篇文章的想法,希望对初

    2024年02月08日
    浏览(49)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包