首页 \ 问答 \ JSF无法解析@ font-face的字体资源(JSF cannot resolve font resources for @font-face)

JSF无法解析@ font-face的字体资源(JSF cannot resolve font resources for @font-face)

 我目前正在尝试a）将一些非标准字体和b）font-awsome图标库添加到我的项目中。 我已经在他们的网站上下载了最新版本的FA 4.7.0。 
 

 我的项目结构如下所示： 
 

web
   ----resources
         ---- css
                ---- default.css
         ---- fonts

                ---- Raleway-Regular.ttf
                ---- Roboto-Regular.ttf
                ---- Questrial-Regular.ttf
                ---- Poppins-Regular.ttf

         ---- font-awesome-4.7.0
                ---- css

                       ---- font-awesome.css
                       ---- font-awesome.min.css     

                ---- fonts

                       ---- fontawesome-webfont.eot
                       ---- fontawesome-webfont.woff
                       ---- fontawesome-webfont.woff2
                       ---- fontawesome-webfont.svg
                       ---- fontawesome-webfont.ttf
         ---- js

                ---- default.js

 

 fontawesome.css和我的default.css文件都通过@ font-face定义字体。 知道JSF无法将字体作为资源处理而不使用EL，我更改了样式表的代码： 
 

 字体awesome.css 
 

@font-face {
 font-family: 'FontAwesome';
 src: url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.eot']}&v=4.7.0");
 src: url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.eot']}&#iefix&v=4.7.0") format('embedded-opentype'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.woff2']}&v=4.7.0") format('woff2'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.woff']}&v=4.7.0") format('woff'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.ttf']}&v=4.7.0") format('truetype'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.svg']}&v=4.7.0#fontawesomeregular") format('svg');
 font-weight: normal;
 font-style: normal;

 

 } 
 

 我的CSS文件引用的字体如下： 
 

@font-face {
font-family: Railway;
src: url("#{resource['fonts:Raleway-Regular.ttf']}") format("truetype");
}

@font-face {
font-family: Questrial;
src: url("#{resource['fonts/Questrial-Regular.ttf']}") format("truetype");
}

@font-face {
font-family: Poppins;
src: url("#{resource['fonts/Poppins-Regular.ttf']}") format("truetype");
}

@font-face {
font-family: "Roboto";
src: url("#{resource['fonts:Roboto-Regular.ttf']}") format("truetype");
}

 

 我使用“：”和“/”分隔符的事实是测试哪个人工作......显然没有:) 
 

 我还在web.xml中添加了所有必需的MIME类型映射 。 
 

 在home.xhtml文件中，我使用这些资源： 
 

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://xmlns.jcp.org/jsf/html"
  xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
  xmlns:f="http://xmlns.jcp.org/jsf/core">

  <h:head>
  <h:outputStylesheet library="font-awesome-4.7.0" name="css/font-awesome.css" />
  <h:outputStylesheet name="css/default.css" />
  <h:outputScript name="js/default.js" />
  </h:head>

 

 在所有这些配置之后，似乎资源处理程序似乎无法加载字体（我的costum和FA）以及JavaScript文件。 有趣的是，正确导入了所有其他样式的css文件。 另外奇怪的是，当我今天第一次启动服务器时，它的工作方式完全相同 - 在为页面添加一个favicon后，它不再工作。 
 

 我在浏览器中收到以下错误通知： 
 

 
 
 Uncaught TypeError：无法读取null（...）的属性'children'http ：// localhost：8080 / $ root / javax.faces.resource / css / resources / fonts / Questrial-Regular.ttf 
 无法加载资源：服务器响应状态为404（未找到） 
 http：// localhost：8080 / $ root / javax.faces.resource / css / resources / fonts / Raleway-Regular.ttf 
 无法加载资源：服务器响应状态为404（未找到） 
 http：// localhost：8080 / $ root / javax.faces.resource / fonts / fontawesome-webfont.woff2？v = 4.7.0 
 无法加载资源：服务器响应状态为404（未找到） 
 http：// localhost：8080 / $ root / javax.faces.resource / css / resources / fonts / Poppins-Regular.ttf 
 无法加载资源：服务器响应状态为404（未找到） 
 http：// localhost：8080 / $ root / javax.faces.resource / css / resources / fonts / Roboto-Regular.ttf 
 无法加载资源：服务器响应状态为404（未找到） 
 http：// localhost：8080 / $ root / javax.faces.resource / fonts / fontawesome-webfont.woff？v = 4.7.0 
 无法加载资源：服务器响应状态为404（未找到） 
 http：// localhost：8080 / $ root / javax.faces.resource / fonts / fontawesome-webfont.ttf？v = 4.7.0 
 无法加载资源：服务器响应状态为404（未找到） 
 

 

 我会很感激任何帮助 
 

 服务器：Glassfish 4.1.1 

I'm currently trying to a) add some non-standard fonts and b) the font-awsome icon library to my project. I've donwloaded the the newest version of FA 4.7.0 on their website. 
 

My project structure is like this:
 

web
   ----resources
         ---- css
                ---- default.css
         ---- fonts

                ---- Raleway-Regular.ttf
                ---- Roboto-Regular.ttf
                ---- Questrial-Regular.ttf
                ---- Poppins-Regular.ttf

         ---- font-awesome-4.7.0
                ---- css

                       ---- font-awesome.css
                       ---- font-awesome.min.css     

                ---- fonts

                       ---- fontawesome-webfont.eot
                       ---- fontawesome-webfont.woff
                       ---- fontawesome-webfont.woff2
                       ---- fontawesome-webfont.svg
                       ---- fontawesome-webfont.ttf
         ---- js

                ---- default.js

 

Both fontawesome.css and my default.css file define fonts via @font-face. Knowing that JSF cannot handle the fonts as a resource without the use of EL, I changed the code of the stylesheet: 
 

font-awesome.css
 

@font-face {
 font-family: 'FontAwesome';
 src: url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.eot']}&v=4.7.0");
 src: url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.eot']}&#iefix&v=4.7.0") format('embedded-opentype'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.woff2']}&v=4.7.0") format('woff2'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.woff']}&v=4.7.0") format('woff'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.ttf']}&v=4.7.0") format('truetype'), url("#{resource['font-awesome-4.7.0:fonts/fontawesome-webfont.svg']}&v=4.7.0#fontawesomeregular") format('svg');
 font-weight: normal;
 font-style: normal;

 

}
 

My css file is referencing the fonts as below:
 

@font-face {
font-family: Railway;
src: url("#{resource['fonts:Raleway-Regular.ttf']}") format("truetype");
}

@font-face {
font-family: Questrial;
src: url("#{resource['fonts/Questrial-Regular.ttf']}") format("truetype");
}

@font-face {
font-family: Poppins;
src: url("#{resource['fonts/Poppins-Regular.ttf']}") format("truetype");
}

@font-face {
font-family: "Roboto";
src: url("#{resource['fonts:Roboto-Regular.ttf']}") format("truetype");
}

 

The fact that I'm using both the ":" and "/" seperator is to test which one's working... apparently none :) 
 

I also added all necessarry MIME type mappings in my web.xml.
 

In the home.xhtml file, I use these resources like that:
 

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://xmlns.jcp.org/jsf/html"
  xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
  xmlns:f="http://xmlns.jcp.org/jsf/core">

  <h:head>
  <h:outputStylesheet library="font-awesome-4.7.0" name="css/font-awesome.css" />
  <h:outputStylesheet name="css/default.css" />
  <h:outputScript name="js/default.js" />
  </h:head>

 

Now after all these configurations, it seems as if the resource handler is not able to load the fonts (my costum and the FA ones) as well as the JavaScript file. The interesting part is that all other styles of the css file are imported correctly. Also it's strange that it worked the exact same way when I booted the server for the first time today - after adding a favicon to the page, it didn't work anymore.
 

I'm getting notified of the following errors in my browser:
 

 
 
Uncaught TypeError: Cannot read property 'children' of null(…) http://localhost:8080/$root/javax.faces.resource/css/resources/fonts/Questrial-Regular.ttf 
Failed to load resource: the server responded with a status of 404 (Not Found)
 http://localhost:8080/$root/javax.faces.resource/css/resources/fonts/Raleway-Regular.ttf 
Failed to load resource: the server responded with a status of 404 (Not Found)
 http://localhost:8080/$root/javax.faces.resource/fonts/fontawesome-webfont.woff2?v=4.7.0 
Failed to load resource: the server responded with a status of 404 (Not Found)
 http://localhost:8080/$root/javax.faces.resource/css/resources/fonts/Poppins-Regular.ttf 
Failed to load resource: the server responded with a status of 404 (Not Found)
 http://localhost:8080/$root/javax.faces.resource/css/resources/fonts/Roboto-Regular.ttf 
Failed to load resource: the server responded with a status of 404 (Not Found)
 http://localhost:8080/$root/javax.faces.resource/fonts/fontawesome-webfont.woff?v=4.7.0 
Failed to load resource: the server responded with a status of 404 (Not Found)
 http://localhost:8080/$root/javax.faces.resource/fonts/fontawesome-webfont.ttf?v=4.7.0 
Failed to load resource: the server responded with a status of 404 (Not Found)
 

 

I'd be grateful for any help
 

Server: Glassfish 4.1.1

原文：https://stackoverflow.com/questions/40685787
更新时间：2022-08-16 19:08

最满意答案

 事实证明，当VoiceChat模式设置为确定增益，回声消除等的最佳设置时，将使用/ current / audio路由。这意味着如果要设置特定路由，则需要执行此操作在设置模式之前 - 不是在之后。 
 

 按照此顺序进行修复，为我解决了数量问题： 
 

     
 
  •  设置PlayAndRecord 
    •  
 
  •  设置路由到扬声器 
    •  
 
  •  设置模式 
    •  
 
  •  在我的音频设备中使用VoiceProcessingIO 
    •  
 
  •  保持硬件采样率低（8k），以保持3GS等旧设备的良好性能 
    •  


It turns out that the /current/ audio route is used when the VoiceChat mode is set to determine the best settings for gain, echo cancellation, etc. Which means that if you're going to set a particular route, you need to do it before you set the mode -- not after.
 

Doing it in this order fixed the volume problem for me:
 

     
 
  • set PlayAndRecord
    •  
 
  • set route to speaker
    •  
 
  • set the mode
    •  
 
  • use VoiceProcessingIO in my audio units
    •  
 
  • keep the hardware sample rate low (8k) to maintain good performance on older devices like the 3GS
    •

相关问答

更多

  • 音频和振幅(Audio frequency and amplitude)[2022-07-26]

    Apple的aurioTouch示例应用程序似乎是使用某些C ++编写的，绝对没有理由。 将代码转换为plain C，也许你会更好地理解它。 近乎实时的DSP音频分析并没有那么容易，所以请阅读该主题。 Apple's aurioTouch sample app appears to be written using some C++ for absolutely no reason. Convert the code to plain C, and maybe you'll understand it be ...

  • 在RemoteIO和VPIO之间录制音量降落切换(Recording volume drop switching between RemoteIO and VPIO)[2023-08-02]

    我用这个苹果开发者支持。 以下是支持的内容： Voice I / O的存在将导致输入/输出的处理方式非常不同。 我们不希望这些单位的收益水平完全相同，但是这些水平不应该像你指出的那样急剧下降。 也就是说，Core Audio工程表明，您的结果可能与创建语音块时的结果有关，它也影响RIO实例。 经过进一步的讨论，Core Audio工程师认为，由于您认为级别差异非常激烈，因此如果您可以通过录制某个错误来突出显示您在语音I / O和远程I / O以及您的测试代码，因此我们可以尝试在内部进行复制并查看这是否确实是 ...

  • 多行注释解决方法？(Multiline Comment Workarounds?)[2021-11-20]

    这确实在邮件列表中定期出现， 例如，这个最近的线程在r-help上 。 共识答案通常是上面显示的：由于语言没有直接的支持，你必须要么 使用编辑器，具有区域到评论的命令，以及最先进的R编辑器 使用前面提到的if (FALSE)结构，但请注意，它仍然需要完整的解析，因此必须在语法上正确 This does come up on the mailing list fairly regularly, see for example this recent thread on r-help. The consensu ...

  • 在Apple的SpeakHere示例中设置kAudioSessionMode会导致音量大幅下降。(Setting kAudioSessionMode in Apple's SpeakHere example causes big drop in volume. Any workarounds?)[2023-07-23]

    事实证明，当VoiceChat模式设置为确定增益，回声消除等的最佳设置时，将使用/ current / audio路由。这意味着如果要设置特定路由，则需要执行此操作在设置模式之前 - 不是在之后。 按照此顺序进行修复，为我解决了数量问题： 设置PlayAndRecord 设置路由到扬声器 设置模式 在我的音频设备中使用VoiceProcessingIO 保持硬件采样率低（8k），以保持3GS等旧设备的良好性能 It turns out that the /current/ audio route is us ...

  • 基维音量。(Kivy sound volume. python)[2022-05-31]

    def openmore1(self, *args): self.more11slider = Slider(orientation='horizontal',step=0.1, min=0, max=1, value= self.volumemore11) self.add_widget(self.more11slider) def playmore11(self, *args): if self.soundmore11 is None: self.soundmo ...

  • 当重新定义回调函数的时间间隔时，speakhere sample无法正常工作(speakhere sample can not work correctly when I redefine the time interval of callback function)[2021-08-22]

    在iOS中，音频会话setPreferredIOBufferDuration API（你甚至使用OS缓冲持续时间调用吗？）只是关于应用程序首选项的请求。 操作系统可以自由选择不同的缓冲时长，但与iOS认为最佳兼容（电池续航时间，与其他应用程序的兼容性等） 音频队列运行在音频单元之上。 如果RemoteIO音频单元使用500 mS缓冲区，它会将它们切换为4个较小的音频队列缓冲区，并将这些较小的缓冲区快速传输到音频队列API。 如果您使用音频单元API而不是音频队列API，以及用于setPreferredIOB ...

  • 如果网页大小，JSOUP不下载完整的HTML。(JSOUP not downloading complete html if the webpage is big in size. Any alternatives to this or any workarounds?)[2021-10-05]

    使用方法maxBodySize ： String article = Jsoup.connect(urlStr).maxBodySize(Integer.MAX_VALUE).get().text(); Use method maxBodySize: String article = Jsoup.connect(urlStr).maxBodySize(Integer.MAX_VALUE).get().text();

  • MySQL的解决方法，它们不能一起工作 - ROWNUM(MySQL workarounds, which aren't working together - ROWNUM)[2023-09-06]

    抛开关于表设计的讨论，以及为什么一组行的summary_cost存储在每个单独的行上... 处理RBAR（通过痛苦行排）是一种SQL反模式。 对于数据的“集合”，我们通常在SQL思考方面要好得多。 我们考虑处理一组行而不是处理单个行。 程序的整个过程看起来根本就是错误的。 除了重复使用SELECT ... LIMIT n,1没有ORDER BY子句之类的问题之外，每次运行时依赖MySQL以相同的顺序返回行，并且在程序运行时依赖于没有插入或删除行。 很难弄清楚该程序究竟应该做什么。 这很难破译，我很遗憾不得不 ...

  • 来自SpeakHere的iPhone应用程序中的C ++(C++ from SpeakHere in iPhone app)[2024-01-04]

    您间接地将C ++标头包含在普通的Objective-C代码（ .m ）中 - 这是行不通的，您必须一直使用Objective-C ++ （。 .mm ）或使用opaque将C ++类封装在Objective-C类中指针 。 一个有问题的链： Classes/MainViewController.m ，plain Objective-C，包括 RecorderLink.h ，包括 AQRecorder.h ，它是C ++ You are indirectly including the C++ header ...

  • SpeakHere样本无法播放从互联网加载的声音(SpeakHere sample can't play sound which loads from internet)[2022-12-01]

    是的，您需要使用音频文件流服务直接从互联网上播放。 我发现“AudioFileStreamExample”示例很有用，应该将其安装在中 /Developer/Examples/CoreAudio/Services/AudioFileStreamExample/ 此外，Matt Gallagher还有一篇名为“ 流媒体和播放MP3流 ”的文章，其中包括iPhone示例代码。 我没有仔细看过它，但似乎它可能对您有所帮助。 Yes, you need to use Audio File Stream Servi ...

相关文章

更多
  • 【第十章】集成其它Web框架 之 10.4 集成JSF ——跟我学spring3
  • HTML 字体标记
  • jsf +seam
  • seam+jsf问题
  • JSF的功能特性
  • JSF生命周期
  • Python解析XML文档
  • JSF快速入门示例
  • Hadoop 源码解析之-TextOutputFormat
  • JSF托管Bean

    • 最新问答

    更多
  • 您如何使用git diff文件，并将其应用于同一存储库的副本的本地分支？(How do you take a git diff file, and apply it to a local branch that is a copy of the same repository?)
  • 将长浮点值剪切为2个小数点并复制到字符数组(Cut Long Float Value to 2 decimal points and copy to Character Array)
  • OctoberCMS侧边栏不呈现(OctoberCMS Sidebar not rendering)
  • 页面加载后对象是否有资格进行垃圾回收？(Are objects eligible for garbage collection after the page loads?)
  • codeigniter中的语言不能按预期工作(language in codeigniter doesn' t work as expected)
  • 在计算机拍照在哪里进入
  • 使用cin.get（）从c ++中的输入流中丢弃不需要的字符(Using cin.get() to discard unwanted characters from the input stream in c++)
  • No for循环将在for循环中运行。(No for loop will run inside for loop. Testing for primes)
  • 单页应用程序：页面重新加载(Single Page Application: page reload)
  • 在循环中选择具有相似模式的列名称(Selecting Column Name With Similar Pattern in a Loop)
  • System.StackOverflow错误(System.StackOverflow error)
  • KnockoutJS未在嵌套模板上应用beforeRemove和afterAdd(KnockoutJS not applying beforeRemove and afterAdd on nested templates)
  • 散列包括方法和/或嵌套属性(Hash include methods and/or nested attributes)
  • android - 如何避免使用Samsung RFS文件系统延迟/冻结？(android - how to avoid lag/freezes with Samsung RFS filesystem?)
  • TensorFlow：基于索引列表创建新张量(TensorFlow: Create a new tensor based on list of indices)
  • 企业安全培训的各项内容
  • 错误：RPC失败;(error: RPC failed; curl transfer closed with outstanding read data remaining)
  • C＃类名中允许哪些字符？(What characters are allowed in C# class name?)
  • NumPy：将int64值存储在np.array中并使用dtype float64并将其转换回整数是否安全？(NumPy: Is it safe to store an int64 value in an np.array with dtype float64 and later convert it back to integer?)
  • 注销后如何隐藏导航portlet？(How to hide navigation portlet after logout?)
  • 将多个行和可变行移动到列(moving multiple and variable rows to columns)
  • 提交表单时忽略基础href，而不使用Javascript(ignore base href when submitting form, without using Javascript)
  • 对setOnInfoWindowClickListener的意图(Intent on setOnInfoWindowClickListener)
  • Angular $资源不会改变方法(Angular $resource doesn't change method)
  • 在Angular 5中不是一个函数(is not a function in Angular 5)
  • 如何配置Composite C1以将.m和桌面作为同一站点提供服务(How to configure Composite C1 to serve .m and desktop as the same site)
  • 不适用：悬停在悬停时：在元素之前[复制](Don't apply :hover when hovering on :before element [duplicate])
  • 常见的python rpc和cli接口(Common python rpc and cli interface)
  • Mysql DB单个字段匹配多个其他字段(Mysql DB single field matching to multiple other fields)
  • 产品页面上的Magento Up出售对齐问题(Magento Up sell alignment issue on the products page)

    • Copyright ©2023 peixunduo.com All Rights Reserved.粤ICP备14003112号

    本站部分内容来源于互联网，仅供学习和参考使用，请莫用于商业用途。如有侵犯你的版权，请联系我们(neng862121861#163.com)，本站将尽快处理。谢谢合作！