背景說明

前端靜態(tài)資源文件放在后端SpringBoot項(xiàng)目resources文件夾下，多環(huán)境打包后前端頁面出現(xiàn)了圖標(biāo)及文字未按預(yù)期樣式顯示的情況，查看瀏覽器控制臺(tái)發(fā)現(xiàn)出現(xiàn)如下錯(cuò)誤。

OTS parsing error: incorrect file size in WOFF header

原因定位

先來看看配置的Maven pom內(nèi)容。

<build><finalName>project-name</finalName><plugins><plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-resources-plugin</artifactId><!-- 配置 @ 占位符 --><configuration><encoding>utf-8</encoding><delimiters><delimiter>@</delimiter></delimiters><useDefaultDelimiters>false</useDefaultDelimiters></configuration></plugin><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId></plugin></plugins><resources><resource><directory>src/main/resources</directory><!-- 開啟過濾，用指定的參數(shù)替換directory下的文件中的參數(shù) --><filtering>true</filtering></resource></resources> </build>

可以看到 filtering標(biāo)簽為true，這代表啟用了filtering模式。 那么filtering為true作用是什么？

• filtering：開啟過濾，用指定的參數(shù)替換directory下的文件中的參數(shù)(eg. ${name})
• directory：指定資源文件的位置。

但是要注意，因?yàn)轫?xiàng)目需要配置多環(huán)境需要使用 @profile.active@ ，因此配置了@ 方式進(jìn)行替換，而非使用默認(rèn)的 $ 符號(hào)。

# application.yml文件中 spring:# 配置采用那套環(huán)境，dev開發(fā)、beta測試、prod線上，主要是數(shù)據(jù)源不同。profiles:# 獲取maven指定的環(huán)境active: @profile.active@

因此上面這段pom中內(nèi)容主要含義：將src/main/resources下的所有@xxx@進(jìn)行替換,具體替換原理請(qǐng)看Maven Profile相關(guān)內(nèi)容，這里不做介紹。

問題解決

由于WOFF文件中存在較多@符號(hào)，因此上述配置導(dǎo)致WOFF文件原本內(nèi)容被替換了，這導(dǎo)致瀏覽器解析時(shí)出錯(cuò)。
因此解決的核心在于避免WOFF文件在filtering下不被掃到。

• 方案一：filtering模式啟動(dòng)時(shí)不對(duì)static目錄下的內(nèi)容進(jìn)行替換。

<build><!--設(shè)定打包后包名，如果未指定則使用artifactId與version拼接--><finalName>package-name</finalName><plugins><plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-resources-plugin</artifactId><!-- 配置 @ 占位符 --><configuration><encoding>utf-8</encoding><delimiters><delimiter>@</delimiter></delimiters><useDefaultDelimiters>false</useDefaultDelimiters></configuration></plugin><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId></plugin></plugins><resources><resource><directory>src/main/resources</directory><!-- 開啟過濾，用指定的參數(shù)替換directory下的文件中的參數(shù) --><filtering>true</filtering><!-- 使用filter先排除fonts/下文件,否則頁面圖標(biāo)加載不出來 --><excludes><exclude>static/fonts/**</exclude></excludes></resource><resource><directory>src/main/resources</directory><!-- 不使用filter再將被排除的fonts/下文件，重新拷貝 --><filtering>false</filtering><includes><include>static/fonts/**</include></includes></resource></resources></build>

• 方案二：nonFilteredFileExtensions標(biāo)簽 指定哪些后綴的文件不進(jìn)行統(tǒng)一編碼。

<build><!--設(shè)定打包后包名，如果未指定則使用artifactId與version拼接--><finalName>package-name</finalName><plugins><plugin><groupId>org.apache.maven.plugins</groupId><artifactId>maven-resources-plugin</artifactId><!-- 配置 @ 占位符 --><configuration><encoding>utf-8</encoding><delimiters><delimiter>@</delimiter></delimiters><useDefaultDelimiters>false</useDefaultDelimiters><!-- 過濾后綴為.woff或者.woff2或.tff的所有文件，不對(duì)其進(jìn)行統(tǒng)一編碼 --><nonFilteredFileExtensions>woff</nonFilteredFileExtensions><nonFilteredFileExtensions>woff2</nonFilteredFileExtensions><nonFilteredFileExtensions>tff</nonFilteredFileExtensions></configuration></plugin><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId></plugin></plugins><resources><resource><directory>src/main/resources</directory><!-- 開啟過濾，用指定的參數(shù)替換directory下的文件中的參數(shù) --><filtering>true</filtering></resource></resources></build>

如果有幫到你的話，給個(gè)免費(fèi)的贊吧^ _ ^

總結(jié)

以上是生活随笔為你收集整理的Maven — maven filtering OTS parsing error incorrect file size in WOFF head 产生原因及两种解决方案的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。