canvas font introduced external solution is not valid

1.css file import external fonts

@font-face {
    font-family: 'hwhp';
    src: url('../font/hwhp.ttf') format('truetype'),
        url('../font/hwhp.eot'),
        url('../font/hwhp.woff') format('woff'),
        url('../font/hwhp.svg') format('svg');
}

Set the font style canvas

var wm = document.createElement('canvas');
        wm.setAttribute('width', 600);
        wm.setAttribute('height', 500);
        var ctx = _wm.getContext('2d');
        ctx.font = "130px 'hwhp'";
        ctx.translate(50, 380);
        ctx.rotate(-0.5);
        ctx.fillStyle="#F8F8FF";
        ctx.fillText(text, 0, 0);

The most important step, html files need to advance the use of font styles, try to put the first element body the following elements must be visible.

<div style="font-family: hwhp;">.</div>