"__MSG _ @@ extension_id__" doesn't work and websites won't load

I am developing a Google Chrome extension that injects a stylesheet into a specific website that I have defined in manifest.json

.

The stylesheet contains the webfonts included in @font-face

and src: url("chrome-extension://__MSG_@@extension_id__/assets/fonts/[...]

but __MSG_@@extension_id__

doesn't seem to work and websites like Font Awesome just end up still showing squares.

manifest.json

"manifest_version": 2,

"content_scripts": [
        {
        "matches": [
            "http://[url].com/*"
        ],
        "css": ["assets/css/main.css"]
    }
],

"web_accessible_resources": ["assets/fonts/*", "assets/img/*"]

      

main.css

@font-face {
      font-family: 'FontAwesome';
      src: url("chrome-extension://__MSG_@@extension_id__/assets/fonts/fontawesome/fontawesome-webfont.eot?v=4.3.0");
      src: url("chrome-extension://__MSG_@@extension_id__/assets/fonts/fontawesome/fontawesome-webfont.eot?#iefix&v=4.3.0") format("embedded-opentype"), 
           url("chrome-extension://__MSG_@@extension_id__/assets/fonts/fontawesome/fontawesome-webfont.woff2?v=4.3.0") format("woff2"), 
           url("chrome-extension://__MSG_@@extension_id__/assets/fonts/fontawesome/fontawesome-webfont.woff?v=4.3.0") format("woff"), 
           url("chrome-extension://__MSG_@@extension_id__/assets/fonts/fontawesome/fontawesome-webfont.ttf?v=4.3.0") format("truetype"), 
           url("chrome-extension://__MSG_@@extension_id__/assets/fonts/fontawesome/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular") format("svg");
      font-weight: normal;
      font-style: normal; }

      

I've already tried hardcoding my extension ID in the url and it worked on my iMac and displayed Font Awesome correctly, but when I switched to my Macbook and hardcoded the new extension ID it doesn't work anymore, but I'm sure it doesn't did nothing wrong as I just needed to change the id. Now I wanted to try it __MSG_@@extension_id__

, but it doesn't work either. Another attempt to embed Base64 fonts also failed. My other websites - Roboto and Open Sans are included in the same way.

It, like a Chrome extension, cannot access fonts.

+3


source to share





All Articles