spring boot 对多模块多网站项目利用webjars共用网站js/css等静态资源文件

news/2024/5/16 0:56:45/文章来源:https://blog.csdn.net/cdnight/article/details/88388847

前言

对于开发多个网站而言,每次都要手动将js/css/images复制过去是很烦的事情,尤其是js等修改以后要人工逐个更新那就更麻烦了。
下面就是解决这个问题的方案,请先参考:
打包WebJar实现对静态资源文件的统一依赖管理

下面是摘抄:

96  年少懵懂丶流年梦 0.1 2018.08.15 09:29 字数 499 阅读 466评论 0喜欢 1
WebJars的发布以及使用
http://www.webjars.org/ 查看详细的使用说明WebJars是打包到JAR(Java Archive)文件中的客户端Web库(例如jQuery和Bootstrap)。在基于JVM的Web应用程序中显式轻松地管理客户端依赖项
使用基于JVM的构建工具(例如Maven,Gradle,sbt,...)来下载客户端依赖项
传递依赖关系会自动解析,并可选择通过RequireJS加载
Web前端使用了越来越多的JS或CSS,如jQuery,Backbone.js和Bootstrap。一般情况下,我们是将这些Web资源拷贝到Java Web项目的webapp相应目录下进行管理。这种通过人工方式管理可能会产生版本误差,拷贝版本错误,漏拷等现象,导致前端页面无法正确展示,版本不一致,文件混乱等,导致出现一些莫名其妙的错误等。WebJars是将web前端资源(js,css等)打成jar包文件,然后借助Maven工具,以jar包形式对web前端资源进行统一依赖管理,保证这些Web资源版本唯一性。WebJars的jar包部署在Maven中央仓库上。webjar的使用
类似的使用方式:<dependencies><dependency><groupId>org.webjars</groupId><artifactId>jquery</artifactId><version>2.2.4</version></dependency><dependency><groupId>org.webjars</groupId><artifactId>bootstrap</artifactId><version>3.3.6</version></dependency>
</dependencies>
SpringMVC配置引用
<mvc:resources mapping="/webjars/**" location="classpath:/META-INF/resources/webjars/"/>
在Servlet3中可简化为:<mvc:resources mapping="/webjars/**" location="/webjars/"/>
Java配置@Configuration
@EnableWebMvc
public class WebConfig extends WebMvcConfigurerAdapter {@Overridepublic void addResourceHandlers(ResourceHandlerRegistry registry) {registry.addResourceHandler("/webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");}}
在Servlet 3容器中,registry.addResourceHandler行可以简化为:registry.addResourceHandler("/webjars/**").addResourceLocations("/webjars/");
使依赖版本不可知
使用Spring Framework 4.2或更高版本时,它将自动检测webjars-locator类路径上的库,并使用它自动为您解析任何WebJar资产的版本。要启用此功能,您需要将webjars-locator库添加为应用程序在pom.xml文件中的依赖项,如:<dependencies><dependency><groupId>org.webjars</groupId><artifactId>webjars-locator</artifactId><version>0.30</version></dependency>
</dependencies>
<link rel='stylesheet' href='/webjars/bootstrap/css/bootstrap.min.css'>
打包webjar
新建maven项目,在pom.xml中<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"><modelVersion>4.0.0</modelVersion><parent><groupId>org.sonatype.oss</groupId><artifactId>oss-parent</artifactId><version>7</version></parent><packaging>jar</packaging><groupId>org.webjars</groupId><artifactId>test</artifactId><version>1.0.0-SNAPSHOT</version><name>Test</name><description>WebJar for Test</description><url>http://webjars.org</url><developers><developer><id>jamesward</id><name>James Ward</name><email>james@jamesward.com</email></developer></developers><licenses><license><name>Apache 2.0</name><url>https://github.com/facebook/react/blob/master/LICENSE</url><distribution>repo</distribution></license></licenses><scm><url>http://github.com/webjars/react</url><connection>scm:git:https://github.com/webjars/react.git</connection><developerConnection>scm:git:https://github.com/webjars/react.git</developerConnection><tag>HEAD</tag></scm><properties><project.build.sourceEncoding>UTF-8</project.build.sourceEncoding><!--输出路径--><destinationDir>${project.build.outputDirectory}/META-INF/resources/webjars/${project.artifactId}/${project.version}</destinationDir><requirejs>{"paths": {"test": "test"}}</requirejs></properties><build><plugins><plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-release-plugin</artifactId><version>2.5.3</version></plugin><plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-deploy-plugin</artifactId><executions><execution><phase>deploy</phase><goals><goal>deploy-file</goal></goals><configuration><packaging>jar</packaging><generatePom>true</generatePom><url>${project.distributionManagement.repository.url}</url><artifactId>${project.artifactId}</artifactId><groupId>${project.groupId}</groupId><version>${project.version}</version><file>${project.build.directory}/${project.artifactId}-${project.version}.jar</file></configuration></execution></executions></plugin></plugins><!-- 定义打包的资源 src/main/resources 目录下的所有 --><resources><resource><directory>${project.basedir}/src/main/resources</directory><targetPath>${destinationDir}</targetPath><filtering>true</filtering></resource></resources></build><!-- 本地的maven私服 --><distributionManagement><repository><id>release</id><url>http://192.168.0.215:8081/repository/maven-releases/</url></repository><snapshotRepository><id>snapshot</id><url>http://192.168.0.215:8081/repository/maven-snapshots/</url></snapshotRepository></distributionManagement></project>
在maven的settings.xml中<servers><server><id>release</id><username>admin</username><password>admin123</password></server> <server><id>snapshot</id><username>admin</username><password>admin123</password></server></servers>
注意 <id/> 值对应运行命令:mvn clean package 打包jar;mvn deploy发布webjar到仓库。<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><script type="text/javascript" src="webjars/test/1.0.0-SNAPSHOT/copy.js"></script>
</head>
<body><h1>欢迎</h1><img src="webjars/test/1.0.0-SNAPSHOT/web-bg.jpg" height="400px" width="100%">
</body>
</html>

可惜了,用这个打包的最大问题在于,打包的是在resource下面的,要额外处理,估计不行

观察

咱们实地观察一个实际项目的spring boot项目的打包情况:
在这里插入图片描述

在这里插入图片描述

里面是很典型的web包,然后看看目录:
在这里插入图片描述

好了,可以看到这里面是真的将静态资源打包过来了。

尤其可以得知,只要在build之前,将某个共用目录下面的静态资源都放到需要build的目录的构建目录下面,然后让他们打包,这样就可行了。

Gradle: How to add output jar file into an existing war file

将答案抄录–因为有墙:

0I did this like the following:def originalWar = file("../release/${sesame_version}/war/openrdf-sesame.war")
def outputDir = "./build/war"
def outputDirSesame = "$outputDir/sesame"task extractWar(type: Copy) {from zipTree(originalWar)into "$outputDirSesame"outputs.upToDateWhen { false }
}task copyJar(type: Copy, dependsOn: extractWar) {  from "./build/libs"into "$outputDirSesame/WEB-INF/lib"outputs.upToDateWhen { false }
}task buildWar(type: Zip, dependsOn: copyJar) {archiveName "openrdf-sesame.war"destinationDir file("$outputDir")from "$outputDirSesame"outputs.upToDateWhen { false }
}build.dependsOn buildWar

Add generated files with gradle before WAR creation

7It is harder than I thought:war {it.dependsOn minifyJavaScriptexclude "js"from( "${buildDir}/js", {into 'js'})
}
I've to exclude the not minified JS files and than include the minified ones. The original files have to be excluded, otherwise the files in the js directory are duplicated (in the created WAR file).

配置以及操作

想来想去。。。嗯,还是不靠谱,不如就直接在root project写个任务,定义更新静态资源,然后每次打包可以手动执行任务更新资源,这样还好点。

    /***静态资源文件更新 begin**/task updateStatic{}updateStatic << {println "正在尝试更新静态资源文件,请稍后......."println "该任务目的为:将公用静态资源文件目录:res-static下面的webapp目录下所有文件目录都复制到spring boot的webapp下(除了WEB-INF)"println "根项目目录为:$rootProject.rootDir"println "当前模块目录为:$project.projectDir"println "当前模块的构建目录为:$project.buildDir"copy {from "${rootProject.rootDir}/res-static/src/main/webapp/"
//            include '**/*.html'
//            include '**/*.jsp'
//            include "*.properties"
//            include "**/.properties"exclude '/WEB-INF'into "${project.projectDir}/src/main/webapp/"//filter(org.apache.tools.ant.filters.ReplaceTokens, tokens: globalConfObj)}println "===========静态资源成功更新"}/***静态资源文件更新 end**/
执行:
gradle updateStatic

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

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

相关文章

如何将网站升级为HTTPS协议(整理)

如何将网站升级为HTTPS协议&#xff08;整理&#xff09; 一、总结 一句话总结&#xff1a; 获取证书&#xff08;有免费有付费&#xff09;&#xff1a;证书是一个二进制文件&#xff0c;里面包含经过认证的网站公钥和一些元数据&#xff0c;要从经销商购买。 安装证书&#x…

大型网站系统架构分析

大型网站系统架构分析 千万级的注册用户&#xff0c;千万级的帖子&#xff0c;nTB级的附件&#xff0c;还有巨大的日访问量&#xff0c;大型网站采用什么系统架构保证性能和稳定性&#xff1f; 首先讨论一下大型网站需要注意和考虑的问题。 数据库海量数据处理&#xff1a;负载…

【网站开发】搭建一个属入自己的网站

概述 搭建一个属入自己的网站 1.购买域名 主机屋http://www.zhujiwu.com/ 购买的域名&#xff1a;TechShare.xyz 2.购买虚拟主机&#xff08;空间&#xff09; http://www.zhujiwu.com/vhost/ 4.控制面板&#xff0c;配置虚拟主机 设置FTP密码 5.文件管理 管理方法&#xff1a;…

说说大型高并发高负载网站的系统架构(转)

转载请保留出处&#xff1a;俊麟 Michael’s blog (http://www.toplee.com/blog/?p71) Trackback Url : http://www.toplee.com/blog/wp-trackback.php?p71 鄙人先后在CERNET做过拨号接入&#xff0c;在Yahoo&3721搞过搜索前端&#xff0c;在猫扑处理过mop.com的架构升级…

网站上线之前,基于SEO,该做哪些测试?

对于任何一个网站而言&#xff0c;在新站上线之初&#xff0c;每个SEO人员&#xff0c;都需要进行缜密的测试&#xff0c;用于辅助网站正式上线后&#xff0c;可以在搜索引擎中&#xff0c;有一个不错的排名。那么&#xff0c;新网站测试&#xff0c;都需要注意什么&#xff1f…

Java爬虫实战(一):抓取一个网站上的全部链接

Java爬虫实战&#xff08;一&#xff09;&#xff1a;抓取一个网站上的全部链接前言&#xff1a;写这篇文章之前&#xff0c;主要是我看了几篇类似的爬虫写法&#xff0c;有的是用的队列来写&#xff0c;感觉不是很直观&#xff0c;还有的只有一个请求然后进行页面解析&#xf…

为网站加入Drupal星球制作RSS订阅源

目前中文 Drupal 星球的版块还未成立&#xff0c;但大家的积极性挺高&#xff0c;不少站长都已经调整好自己的网站&#xff0c;生成了可供Drupal Planet 使用的RSS订阅源。如果你也想让网站做好准备&#xff0c;可以不必再花上不少的时间去了解要求和流程&#xff0c;只需要跟着…

网站地图

ASP.NET提供了网站地图提供器XmlSiteMapProvider&#xff0c;使用XmlSiteMapProvider可以从XML文件中获取网站地图信息。 XmlSiteMapProvider会从根目录中寻找名为Web.sitemap的文件来读取信息&#xff0c;在解析Web.sitemap文件中的网站地图数据后创建一个网站地图对象&#x…

简单建立个人WEB网站

文介绍一些简单的方法是普通用户可以建设一个自己的个人WEB小网站。建站条件嘛只要有一台可以连接网络的电脑就足够了。由于我是用的是WIN7系统&#xff0c;以下操作均指是在WIN7环境下的&#xff0c;其他WIN操作系统大概都是类似的。开讲&#xff1a;第一步&#xff1a;首先我…

数十万网站被利用发起CC攻击

近日&#xff0c;阿里云云盾安全团队协助处理了多例金融证券直播行业的客户的网站攻击事件。有专业的攻击团伙&#xff0c;针对网上的金融证券直播类网站业务发起集中的网络攻击、意在破坏网站的正常运营&#xff0c;进而勒索钱财。云盾安全专家经过分析攻击、采用对应安全策略…

手机网站Mobile Web

原文链接地址有一个词"手机网站"&#xff08;mobile web&#xff09;&#xff0c;指供手机浏览的网站&#xff0c;但它是不存在的。人们提到"移动互联网"的时候&#xff0c;其实专指另外一样东西&#xff1a;手机App。一、Web App VS Native App比起手机Ap…

怎样将优酷网站下载的视频KUX转MP4格式

在休息之余&#xff0c;相信大多数人都会拿手机看电视剧听音乐之类的&#xff0c;最近拍了很多的新片子&#xff1a;《毒液&#xff1a;致命守护者》、《无名之辈》、《亡命救赎》《影》等等优质电影&#xff0c;但是很多的电影都只能在电影院观看的&#xff0c;如果不去电影院…

解析各大电子商务网站订单号的生成方式

2019独角兽企业重金招聘Python工程师标准>>> 订单是整个电子商务的核心。整个电子商务的流程也是围绕订单的状态执行的。这篇博客主要向大家介绍订单号的生成方式。 现在大型电商网站大多都有好几种下单途径。 比如&#xff1a;通过Web网站下单&#xff0c;通过打电…

window.open原页面跳转_百度转码后的手机网站页面是否有利于SEO优化

随着移动互联网的飞速增长&#xff0c;越来越多的移动端网站正在迅速掘起&#xff0c;据百度搜索统计表示&#xff1a;2013年移动端搜索发展迅猛&#xff0c;整体占比高达40%&#xff0c;预期在2014年内可能会出现超过PC端的搜索增长&#xff0c;从当前移动互联网的发展方向看来…

react登录页面_用 React 做一个人脸识别网站 - 前端篇

引言React 可以说是近些年最热门的前端框架啦&#xff0c; 并且非常非常的好用 ~很多的国外公司比如 Netflix、Feedly、Airbnb 都是用它来实现的网站主页。那么 React 到底是个什么呢&#xff1f;它其实是一个为数据提供渲染为HTML视图的开源JavaScript 库。传说最早起源于Face…

网站用户头像剪裁上传完整案例

做为网站前段开发人员来说&#xff0c;用户头像剪裁和上传是一个很常用的功能&#xff0c;一般这个功能涉及到图片的放大&#xff0c;缩小&#xff0c;移动&#xff0c;旋转&#xff0c;和剪裁。下面我们来做一个完整的demo&#xff0c;剪裁后的图片以base64的形式返回&#xf…

js记录用户在网站的浏览记录和停留时间(2)

问题&#xff1a;上次的代码确实解决了一部分用户访问记录的收集&#xff0c;但是还是存在一个问题就是 我们网站的注册 都是新页面打开的&#xff0c;如果用户刚进入网站就点击注册&#xff08;打开了新的页面&#xff09; &#xff0c;我代码里用到的 onbeforeunload 就无法将…

burpsuite只拦截特定网站数据包教程

一、背景说明 在配置burpsuite代理截包时经常会遇到这样的情况&#xff1a; 浏览器经常自己发一些包&#xff08;收集用户信息&#xff09;&#xff0c;干挠渗透测试人员对目标网站的检测&#xff1b; 如果是代理手机&#xff0c;那就是很多APP都时不时发一些包&#xff0c;干挠…

【转载】大型网站性能

参考这篇文章&#xff1a;http://www.csdn.net/article/2014-09-30/2821940 把整个过程&#xff0c;分为三段路径&#xff1a; 第一段在用户和浏览器端&#xff0c;主要负责发出用户请求&#xff0c;以及接受响应数据进行计算渲染显示给用户&#xff1b;第二段在网络上&#xf…

用户域名注册后 需要在租服务器吗,搭建论坛需要租用什么样的网站服务器

搭建论坛可能对于普通的站长还是比较遥远的事情&#xff0c;但是对IT行业有比较深刻了解的站长&#xff0c;他们往往喜欢选择搭建一个论坛&#xff0c;聚集一些属于自己的人气。那么搭建论坛需要租用什么样的网站服务器呢&#xff1f;我们知道&#xff0c;论坛它比普通网站需要…