CODEWITHSUNDEEP
springangulartypescriptfont-awesome
ak.leimrey
ak.leimrey

Reputation: 1263

Failed to decode downloaded font in Angular 5

EDIT: I can say with relative clarity, that it is an issue with my Spring application. Uploading it in my test-firebase, such a warning isn't being triggered.

Dear fellow coders...

Trust me when I say, I really tried going through the numerous other explanations posted in other people's questions. It's just an awfully curious case.

I wanted to try out to deploy my Angular 5 application in a Spring backend. It's really a barebone setup that looks like this...

 @SpringBootApplication
public class AngularApplication extends SpringBootServletInitializer {

    @Configuration
    @EnableConfigurationProperties({ ResourceProperties.class })
    public class WebMvcConfig implements WebMvcConfigurer {

        @Autowired
        private ResourceProperties resourceProperties = new ResourceProperties();

        @Override
        public void addResourceHandlers(ResourceHandlerRegistry registry) {

            long cachePeriod = resourceProperties.getCache().getPeriod().getSeconds();

            final String[] staticLocations = resourceProperties.getStaticLocations();                   
            final String[] indexLocations = new String[staticLocations.length];

            registry.addResourceHandler(
                    "/**/*.css", 
                    "/**/*.js")
                    .addResourceLocations(staticLocations)
                    .setCacheControl(CacheControl.maxAge(cachePeriod, TimeUnit.SECONDS));

            registry.addResourceHandler(
                    "/**/*.html", 
                    "/**/*.json", 
                    "/**/*.bmp", 
                    "/**/*.jpeg", 
                    "/**/*.jpg", 
                    "/**/*.png",
                    "/**/*.ttf", 
                    "/**/*.svg",
                    "/**/*.eot",
                    "/**/*.woff",
                    "/**/*.woff2"
                    )
                    .addResourceLocations(staticLocations)
                    .setCacheControl(CacheControl.maxAge(60, TimeUnit.SECONDS));

            registry.addResourceHandler("/**").addResourceLocations(indexLocations).resourceChain(true)
                    .addResolver(new PathResourceResolver() {
                        @Override
                        protected Resource getResource(String resourcePath, Resource location) {
                            return location.exists() && location.isReadable() ? location : null;
                        }
                    });
        }
    }
    public static void main(String[] args) {
        SpringApplication.run(AngularApplication.class, args);
    }

    protected SpringApplicationBuilder configure(SpringApplicationBuilder application) {
        return application.sources(BizviewAngularApplication.class);
    }

}

I do a productive build of my application, put it in the static folder of my Spring application and run it. Looks and feels great, all in all. No errors, I can see my pages just fine with literally every browser. Edge, Opera, Firefox, but ONLY in the Chrome browser, I have one warning popping up which multiplies when the window is redrawn...

enter image description here

Failed to decode downloaded font and OTS parsing error: invalid version tag. I deleted font-awesome and re-installed 4.7, but this didn't help. The weird part is, the font-awesome icons are all perfectly fine. I can see them and none are missing from the project. I mean, it's my first application that I roll out, so I might be missing something, but it appears like an oddly specific issue

Upvotes: 1

Views: 1788

Answers (1)

Cobus Kruger
Cobus Kruger

Reputation: 8605

I had this when hosting on IIS 8.5 with rewrite rules. The problem as I understand it, is that the file extension is actually interpreted as .woff?v=4.7.0.

So I wound up adding that to my list of font extensions. I know nothing about Spring, but from your listing, I reckon you should add it to registry.addResourceHandler:

registry.addResourceHandler(
    "/**/*.html", 
    "/**/*.json", 
    "/**/*.bmp", 
    "/**/*.jpeg", 
    "/**/*.jpg", 
    "/**/*.png",
    "/**/*.ttf", 
    "/**/*.svg",
    "/**/*.eot",
    "/**/*.woff",
    "/**/*.woff?v=4.7.0",
    "/**/*.woff2"
)

Upvotes: 1

Related Questions