在 web 项目开发过程中,我们常常使用到 JSP,以及对静态资源,js,css 等引用,但是我们应该把这些资源文件放在哪个目录下面咧,怎么引用。

当然如果是前后端分离的项目倒不用考虑这些。

WEB-INF:出于安全性的考虑,这个目录是禁止外部直接访问的,所以 JSP 页面放在这个目录及其子目录下面是起到保护作用的。

在 jsp 页面中少不了的是对 js,css 文件的引用,那么我们引用的时候又有两种方式:

1)相对路径:就是说相对于这个 jsp 页面位置,js,css 文件所在的位置,这种引用是相对的,当某一方位置发生变化是,这个相对路径就得跟着改变。

在这种情况下我们把 jsp,js,css 文件都放到 WEB-INF 目录下是可以的,jsp 成功引用到 js,css 文件。

2)绝对路径:这是我们在开发中常用的,request.getcontextPath()
这是获取 web 项目上下文,也就是说 web 根目录
WebContent(WEB-INF 的上一级),

在使用绝对路径的时候,这样子,对于整个项目是绝对的路径。

jsp 使用绝对路径引用 js,css 文件,同时 js,css 文件又放到了 WEB-INF 目录下面,这时候的引用是失败的,当我们在浏览器访问的时候,会出现找不到引用的 js,css 文件。

分析:

这个问题的原因正是由于 WEB-INF 拒绝外部直接访问, 但是你可能会想,我的 JSP 文件也放在这个目录下面呀,为什么浏览器可以访问咧。

这时候,应该想想,你的 jsp 是直接通过 浏览器输入什么 http://..../xx.jsp 访问的?不是吧,大部分时候我们是直接访问 控制层 ,再由控制层控制返回那个 jsp 页面给浏览器的。

所以这时候,就不属于直接通过浏览器外部访问这个 JSP 页面了,而是通过了控制层访问的,属于内部访问了,这样 WEB-INF 当然不会禁止内部访问。

你可能又会想,为什么这些 js,css 文件又引用不了,因为这时候已经不属于内部访问了。

那么为什么是外部访问咧,因为当以绝对路径引用的时候,request.getcontextPath()/WEB-INF/js/xx.js,
这时候会转换为 xxx/WEB-INF/js/xx.js,很显然就变成了外部引用了,WEB-INF
拒绝了访问,所以我们一般会放到 WEB-INF 目录外面,这样:xxx/js/xx.js。

相对路径之所以能引用成功是这样的效果:WEB-INF/jsp/xx.jsp,这是 jsp 文件路径,WEB-INF/js/xx.js,这是 js 文件路径,相对这个 jsp 文件引用,以它为出发点:../js/xx.js
你看,这样完全没有经过 WEB-INF 目录,所以引用成功了。

关于WEB-INF目录不提供外部访问及JSP引用 js,css 文件路径问题的更多相关文章

  1. Web性能优化之动态合并JS/CSS文件并缓存客户端

    来源:微信公众号CodeL 在Web开发过程中,会产生很多的js/css文件,传统的引用外部文件的方式会产生多次的http请求,从而加重服务器负担且网页加载缓慢,如何在一次请求中将多个文件一次加载出来 ...

  2. 使用Maven构建Java Web项目时,关于jsp中引入js、css文件路径问题。

    今天有点闲,自己动手搭建一个Java Web项目,遇到jsp中引入js.css文件时路径不正确的问题,于是在网上查阅了很多资料,最终都无法解决问题,于是,上stackoverflow找到了解决方法,这 ...

  3. CSS-06 外部JS,CSS文件的寻址问题

    如果js.css外部文件有使用到相对路径,其相对路径的基准是不一样的 当一个index.html中引入外部的JS和CSS文件时: 在index.css文件中,相对路径的写法是以css文件相对于img图 ...

  4. Web前端学习(4):显示图片、url与文件路径

    本章主旨 介绍<img>标签及其基本属性:介绍URL和文件路径 在上一章中,我简单地介绍了HTML的一些基本标签及基本属性,例如,我们用<p>标签来标记文本段落,用<h1 ...

  5. Web网站配置Gzip,压缩js css文件

    启用apache的gzip 找到httpd.conf,打开文件找到对mod_deflate的注释 #LoadModule deflate_module modules/mod_deflate.so 去 ...

  6. springMVC下jsp引用外部js,css等静态资源的解决方法

    直入主题. 1. web.xml对springMVC配置如下: <servlet> <description>Spring MVC配置</description> ...

  7. asp.net core web项目目录解读

    Connected Services 和传统.net web项目相比,它的功能类似于添加webservice或者wcf service的引用.暂时用不到,有兴趣的小伙伴可以深入了解.右键这个目录可以看 ...

  8. web项目目录结构

    eclipse web项目目录结构 按照 Java EE 规范的规定,一个典型的 Web 应用程序有四个部分: 1.  公开目录 ; 2. WEB-INF/web.xml 文件,发布描述符(必选) ; ...

  9. Linux系统Web网站目录和文件安全权限设置

    查看Linux文件的权限:ls -l 文件名称查看linux文件夹的权限:ls -ld 文件夹名称(所在目录)例如: drwxr-xr-x 2 root root 4096 2009-01-14 17 ...

随机推荐

  1. 浅谈TSM概念、系统架构及技术发展

    NFC作为一种近距离的无线通信技术,提供了一种更直接.更安全的现场交互解决方案.它能够允许电子设备之间进行非接触式点对点数据传输,实现数据交换.访问内容与服务.有了它,手机不再只是打电话.发短信以及上 ...

  2. 【探路者】团队Alpha周贡献分数分配结果

    经本组成员商议,根据老师提供的分数,(每人携带10分进入团队,[探路者]团队7人,共计35分). 本周每位同学携带10分进入组内,7人共计70分.分数公布如下: 吴雨丹 15分 贾雅杰 12分 蔺依铭 ...

  3. 5月5号周二课堂练习:简评cnblogs.com的用户体验

    一.用户类型 在博客园上写博客,提问题,浏览感兴趣的博客帖子的活跃用户. 二.对cnblogs的期望 在博客园上写博客更流畅,制作手机版的APP可以随时随地在线浏览大牛们写的博客,提出的问题能更好的更 ...

  4. Codeforces Beta Round #6 (Div. 2 Only) 单调队列

    题目链接: http://codeforces.com/contest/6/problem/E E. Exposition time limit per test 1.5 secondsmemory ...

  5. vue知识拓展

    组件 *组件里面如果要放数据:        data必须是函数的形式,函数必须返回一个对象(json),有的时候我们自己创建的组件需要使用到自己的数据,此外组建中也可以放入自己的其他的比如事件之类的 ...

  6. (十)Jmeter中的Debug Sampler介绍

    一.Debug Sampler介绍: 使用Jmeter开发脚本时,难免需要调试,这时可以使用Jmeter的Debug Sampler,它有三个选项:JMeter properties,JMeter v ...

  7. websocket服务器+客户端

    <?php $demo = new ws('192.168.90.47',12345); $demo->run(); class ws { //当前服务端主连接 private $curr ...

  8. 太平洋网络ip地址查询接口使用,返回json格式,默认返回jsonp

    http://whois.pconline.com.cn/ipJson.jsp?json=true

  9. Mysql中关键词执行顺序

    MySQL的语句执行顺序 MySQL的语句一共分为11步,最先执行的总是FROM操作,最后执行的是LIMIT操作.其中每一个操作都会产生一张虚拟的表,这个虚拟的表作为一个处理的输入,只是这些虚拟的表对 ...

  10. 内存测试——Android Studio自带内存检测功能

    AndroidStudio 自带 CPU 和内存检测工具,绘制出变化图,可以直观明了的看出内存和cpu的变化曲线. 手机连接电脑,选择要调试的手机,选择要检测的应用进程,Memory是内存监控,CPU ...