后端请求转发与请求重定对于向前端静态资源的加载影响

这篇具有很好参考价值的文章主要介绍了后端请求转发与请求重定对于向前端静态资源的加载影响。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

虽然在实际开发过程中用的很少,这里记录一下遇到的问题。因为有一次导致前端CSS样式文件无法加载,最后找出BUG的步骤

准备工作

后端代码

@Controller
@RequestMapping("/test")
public class ForwardAndRedirect {
    @GetMapping("/hello")
    public Object hello() {
        return "forward:/hello.html";
    }

    @GetMapping("/hello2")
    public Object hello2(){
        return "redirect:/hello.html";
    }
}

前端代码

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>请求转发与重定向</title>
    <link rel="stylesheet" href="./hello.css">
</head>
<body>
<h1 class="h1-font-color">请求转发与重定向</h1>
<img src="./img/Cyberpunk2077.jpg" alt="图片加载失败">
</body>
<script src="./js/jquery-3.7.1.min.js"></script>
</html>

前端文件路径
后端请求转发与请求重定对于向前端静态资源的加载影响,SpringBoot,前端

请求转发

URL变化:127.0.0.1:8080/test/hello 不改变
后端请求转发与请求重定对于向前端静态资源的加载影响,SpringBoot,前端

发现前端样式已经丢失,html加载的css,js和图片资源出现了404:因为转发依靠的是127.0.0.1:8080/test路径,在该路径下在加载资源路径加载错误,就出现了404导致前端页面样式丢失的问题。
如果请求转发非要访问这些资源的话需要注意层级关系,解决掉层级关系即可
因为后端接口在访问之前多了个 test 层级,那么相对应的前端页面访问的时候如果多一层路径层级即可访问成功,对应的把 .html 文件移动到 html 目录下。此时即使有层级的js、图片资源和无层级的css资源都会成功访问【注意修改后端代码/html
后端请求转发与请求重定对于向前端静态资源的加载影响,SpringBoot,前端
后端请求转发与请求重定对于向前端静态资源的加载影响,SpringBoot,前端

请求重定向

URL变化:127.0.0.1:8080/test/hello2 -> 127.0.0.1:8080/hello.html
前端页面完整,各种相对路径下的资源都访问成功
后端请求转发与请求重定对于向前端静态资源的加载影响,SpringBoot,前端
重定向前加一层层级也可以正常访问
后端请求转发与请求重定对于向前端静态资源的加载影响,SpringBoot,前端

总结

请求转发

  1. 服务器内部进行转发,用户只感受到向URL发送了一个请求并收到了响应,并不知道中间是否经过了请求转发
  2. 请求的URL前后不会改变,因此特殊情况下会导致前端资源访问404
  3. 服务器收到请求后,会将该请求交付给另外一个请求去处理并将响应结果返回给用户

请求重定向文章来源地址https://www.toymoban.com/news/detail-832813.html

  1. 服务器收到请求后会响应客户端访问另外一个URL,客户端收到响应后会重新发起请求访问重定向的URL
  2. 请求的URL前后发生改变【前端资源不会加载失效】
  3. 重定向可以是服务器重定向【HTTP状态码301或302】也可以是客户端【JavaScript代码:window.location.href=“xxx.html”

到了这里,关于后端请求转发与请求重定对于向前端静态资源的加载影响的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

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

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

相关文章

  • Nginx将请求转发至后端应该怎么做?

    在nginx的配置文件中新建一个server监听前端部署的端口 然后在server中添加一个location,就是把访问路径指向前端项目打包后的地址 在部署前后端分离项目时,通常都要使用nginx把前端的请求转发到后端的接口上去,这就要配置nginx的proxy_pass功能。 代理转发需要注意的事儿 在

    2024年02月04日
    浏览(46)
  • Tomcat加载静态资源--防止SpringMVC拦截

    最简洁方式:使用API 在配置文件下写配置类SpringMvcSupport,并且让SpringMVC扫描到此文件夹@ComponentScan({\\\"com.itheima.controller\\\",\\\"com.itheima.config\\\"}) SpringMvcSupport配置类如下 步骤: 1、在config文件下写SpringMvcConfig配置类 2、在SpringMvcConfig也就是SpringMVC核心配置类中扫描到此文件夹,那么此

    2024年02月10日
    浏览(37)
  • vue3:加载本地图片等静态资源

    在我们用 vue2 + webpack 的时候,加载图片资源是这样用的: 这样打包后就会触发 file-loader 打包图片资源,在 dist 文件夹中就可以看到这个图片(如果图片较小会打包进代码中变为 base64 引入)。 但是在 vue3 + vite 中,使用这种方式是不行的,vite 中没有 require 会报错。 解决方案

    2024年01月18日
    浏览(45)
  • vue项目打包,解决静态资源无法加载和路由加载无效(404)问题

    打包后的项目静态资源无法使用,导致页面空白 静态资源无法使用,那就说明项目打包后,图片和其他静态资源文件相对路径不对,此时找到config里面的index.js,在build模块下加入 assetsPublicPath: \\\'./\\\',  如下图所示,或者是在打包完的dist文件夹中找里面的.js文件,将其中的\\\'/\\\'替

    2024年02月08日
    浏览(53)
  • UE5 C++ 静态加载资源和类

    一.上篇文章创建组件并绑定之后 在Actor中加载初始化了组件,现在在组件中赋值。使用static ConstructorHelpers::FObjectFinderTTempName(TEXT(\\\"Copy Reference\\\"));再用TempName.Object 里面的资源都来自StarterContent   效果如下: 二.静态加载类 1.在Actor中再声明一个AActor类  2.在静态加载类时使用

    2024年02月21日
    浏览(51)
  • vue中图片不显示问题 - vue中静态资源加载

    在 JavaScript 被导入或在 template/CSS 中通过 相对路径 被引用。这类引用会被 webpack 处理后再输出到打包后的文件。 放置在 public(static)目录下或通过绝对路径被引用。这类资源将会直接被拷贝到打包后的文件 ,而不会经过 webpack 的处理。 在 config.js 的 build.assetsPublicPath 和 build

    2024年01月25日
    浏览(45)
  • Django 加载静态资源及<!DOCTYPE html>标红解决办法

    1.文件夹位置: 用于开发者存放HTML页面。 本文件夹位置建立在app01文件夹目录下 -- 新建templates文件夹 -- 并在文件夹下创建html文件。 该文件的文件名与上述链接指向的html文件名称相同。 2.要点: 优先去项目的根目录的templates中寻找(这个需要提前配置),不配置则无效。

    2023年04月08日
    浏览(57)
  • SpringBoot访问静态资源和jar外部静态资源,部署前端打包后的vue项目放入静态资源里

    记录一下使用SpringBoot访问静态资源和SpringBoot打包之后的jar外部静态资源,在开发的时候,一般选择前后端分离的方式,前端使用vue 后端使用SpringBoot,通常情况下,部署都是前端通过http去请求后端资源,涉及到http请求,那么肯定需要资源的目标地址IP,一般云端部署给到I

    2024年02月09日
    浏览(71)
  • SpringBoot项目修改中静态资源,只需刷新页面无需重启项目(附赠—热加载)

    💢初衷💢       因为一遍遍修改并重启项目觉得很麻烦,所以刚开始就自己给项目配置了热加载,但奈何代码更新还是慢,还不如我重启一遍项目的速度,所以放弃了自己上网找到的热加载配置。直到我debugger前端代码时,问题出现了,因为我项目的前后端没有分离,所以

    2024年02月14日
    浏览(50)
  • uniapp:二级目录部署H5静态图片资源请求路径不对

    引入方式 由于url使用的是二级目录, http://www.demo.com/mini/ 开发环境中没有问题,资源可以正常请求到 上线后,发现静态资源请求的路径是 请求不到资源,返回了404 网上给出了很多方式 都不能获取 其实最后解决的方式也很简单,使用相对当前目录的方式 也就是把最前面的路

    2024年02月13日
    浏览(48)

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

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

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

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

二维码1

领取红包

二维码2

领红包