Error: Unsupported OpenType signature <!DO

Error: Unsupported OpenType signature <!DO
    at parseBuffer (opentype.js?6770:204)
    at eval (opentype.js?6770:378)
    at XMLHttpRequest.request.onload (opentype.js?6770:71)

Expected Behavior

Font loaded from file.

Current Behavior

Loading a font using https://github.com/shrhdk/text-to-svg and seeing this error from OpenType.js – very unfamiliar with font formats so not able to infer much from the error message except that perhaps the font file is formatted in a non-standard way? Only relevant search result in Google was #278 but the error message is a little different.

Font fails to load.

Possible Solution

I recognize that it’s possibly the font file that’s causing this issue but wanted to request input here in case this is an issue anyone recognizes.

Steps to Reproduce (for bugs)

Not sure I can provide this, the font in question is proprietary and licensed.

Your Environment

• Version used: 0.7.3
• Font used: Avenir
• Browser Name and version: Chrome 69
• Operating System and version (desktop or mobile): OSX High Sierra
• Link to your project: not public

[peilingjiang]

The thread has been silent for a long time but I just want to drop a word here in case anyone else get this problem in the future. I worked with p5 and React and got this problem. I was able to resolve it by import the file into the code and load it from there:

import Roboto from './font/Roboto-Black.ttf'

// ...

p.setup = () => {
  p.loadFont(Roboto, font => {
    console.log('Success!')
  })
}

[Jolg42]

@CubeOfCheese What’s happening is actually the same ie:

“<!DO” is for “DOCTYPE” the first tag in an HTML file, this mean that you’re trying to open an HTML file. I guess it’s a 404 page or something like this 😉

Check the path to your .otf file and try again. I also suggest opening the Console at the Network tab to see what’s happening.