lrc-file-parser
Version:
Javascript-based lrc file parser
97 lines (92 loc) • 12.3 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>lrc-file-parser</title>
<style>
body {
min-height: 100vh;
margin: 0;
}
body> main {
width: 1200px;
max-width: 100%;
margin: 0 auto;
text-align: center;
}
#audio {
padding: 15px 0;
}
#lyric {
padding: 10% 0;
color: white;
}
#bg {
background: url('https://toside01-1251838060.cos.ap-guangzhou.myqcloud.com/lrc-file-parser%2Fbg.jpg') center no-repeat;
background-size: 150% 150%;
position: fixed;
width: 200%;
height: 200%;
left: -50%;
top: -50%;
z-index: -1;
filter: blur(65px);
}
#bg:after{
position: fixed;
width: 100%;
height: 100%;
left: 0;
top: 0;
content: '';
background-color: rgba(0,0,0,.7);
}
</style>
</head>
<body>
<main>
<audio id="audio" autoplay controls></audio>
<div id="lyric"></div>
<div id="bg"></div>
</main>
</body>
<script src="./lrc-file-parser.min.js"></script>
<script>
// var encodeLrc = 'W3RpOuacieS9leS4jeWPr10KW2FyOuiuuOW1qV0KW2FsOuiHquWumuS5iV0KW2J5Ol0KW29mZnNldDowXQpbMDA6MDAuMTBd5pyJ5L2V5LiN5Y+vIC0g6K645bWpIChWYWUgWHUpClswMDowMC4yMF3or43vvJrorrjltakKWzAwOjAwLjMwXeabsu+8muiuuOW1qQpbMDA6MDAuNDBd57yW5puy77ya6K645bWpClswMDowMC41MF0KWzAwOjIzLjA3XeWkqeepuuWlveaDs+S4i+mbqApbMDA6MjUuMTNd5oiR5aW95oOz5L2P5L2g6ZqU5aOBClswMDoyNy40MV3lgrvnq5nlnKjkvaDlrrbmpbzkuIsKWzAwOjI5LjQyXeaKrOi1t+WktCDmlbDkuYzkupEKWzAwOjMxLjg2XeWmguaenOWcuuaZr+mHjOWHuueOsOS4gOaetumSoueQtApbMDA6MzQuMTld5oiR5Lya5ZSx5q2M57uZ5L2g5ZCsClswMDozNi41OV3lk6rmgJXlpb3lpJrnm4bmsLTlvoDkuIvmt4sKWzAwOjM5LjY5XQpbMDA6NDEuOTVd5aSP5aSp5b+r6KaB6L+H5Y67ClswMDo0NC4wMF3or7fkvaDlsJHkubDlhrDmt4fmt4sKWzAwOjQ2LjQyXeWkqeWHieWwseWIq+epv+efreijmQpbMDA6NDguNjNd5Yir5YaN6YKj5LmI5reY5rCUClswMDo1MS4wNF3lpoLmnpzmnInml7bkuI3pgqPkuYjlvIDlv4MKWzAwOjUzLjM3XeaIkeaEv+aEj+WwhuagvOa0m+exs+WAn+e7meS9oApbMDA6NTUuNjVd5L2g5YW25a6e5piO55m95oiR5b+D5oSPClswMDo1OS4wMV3kuLrkvaDllLHov5npppbmrYwKWzAxOjAxLjI0XeayoeacieS7gOS5iOmjjuagvApbMDE6MDMuNTVd5a6D5LuF5LuF5Luj6KGo552AClswMTowNS4zNF0KWzAxOjA1Ljk3XeaIkeaDs+e7meS9oOW/q+S5kApbMDE6MDguMzJd5Li65L2g6Kej5Ya75Yaw5rKzClswMToxMC43MV3kuLrkvaDlgZrkuIDlj6rmiZHngavnmoTpo57om74KWzAxOjE0LjIzXeayoeacieS7gOS5iOS6i+aDheaYr+S4jeWAvOW+lwpbMDE6MTcuOTFd5Li65L2g5ZSx6L+Z6aaW5q2MClswMToyMC4yNl3msqHmnInku4DkuYjpo47moLwKWzAxOjIyLjU1XeWug+S7heS7heS7o+ihqOedgApbMDE6MjQuMzRdClswMToyNC45NF3miJHluIzmnJvkvaDlv6vkuZAKWzAxOjI3LjM4XeS4uuS9oOi+l+i9rOWPjeS+pwpbMDE6MjkuNzdd5Li65L2g5pS+5byD5LiW55WM5pyJ5L2V5LiN5Y+vClswMTozMy4xMF3lpI/mnKvnp4vlh4nph4zluKbkuIDngrnmuKnng60KWzAxOjM2Ljg2XeacieaNouWto+eahOminOiJsgpbMDE6MzkuNTNdClswMTo1OC4xMF3lpKnnqbrlpb3mg7PkuIvpm6gKWzAyOjAwLjA1XeaIkeWlveaDs+S9j+S9oOmalOWjgQpbMDI6MDIuMzdd5YK756uZ5Zyo5L2g5a625qW85LiLClswMjowNC41M13miqzotbflpLQg5pWw5LmM5LqRClswMjowNi44N13lpoLmnpzlnLrmma/ph4zlh7rnjrDkuIDmnrbpkqLnkLQKWzAyOjA5LjQzXeaIkeS8muWUseatjOe7meS9oOWQrApbMDI6MTEuNjdd5ZOq5oCV5aW95aSa55uG5rC05b6A5LiL5reLClswMjoxMy45N10KWzAyOjE0LjYzXeW+gOS4i+a3i+W+gOS4i+a3iwpbMDI6MTYuNzhd5aSP5aSp5b+r6KaB6L+H5Y67ClswMjoxOS4wM13or7fkvaDlsJHkubDlhrDmt4fmt4sKWzAyOjIxLjQxXeWkqeWHieWwseWIq+epv+efreijmQpbMDI6MjMuNDVd5Yir5YaN6YKj5LmI5reY5rCUClswMjoyNi4wM13lpoLmnpzmnInml7bkuI3pgqPkuYjlvIDlv4MKWzAyOjI4LjM0XeaIkeaEv+aEj+WwhuagvOa0m+exs+WAn+e7meS9oApbMDI6MzAuNjJd5L2g5YW25a6e5piO55m95oiR5b+D5oSPClswMjozNC4wM13kuLrkvaDllLHov5npppbmrYwKWzAyOjM2LjI4XeayoeacieS7gOS5iOmjjuagvApbMDI6MzguNTZd5a6D5LuF5LuF5Luj6KGo552AClswMjo0MS4wM13miJHmg7Pnu5nkvaDlv6vkuZAKWzAyOjQzLjM1XeS4uuS9oOino+WGu+WGsOayswpbMDI6NDUuNzRd5Li65L2g5YGa5LiA5Y+q5omR54Gr55qE6aOe6Ju+ClswMjo0OS4yNF3msqHmnInku4DkuYjkuovmg4XmmK/kuI3lgLzlvpcKWzAyOjUyLjkyXeS4uuS9oOWUsei/memmluatjApbMDI6NTUuMzBd5rKh5pyJ5LuA5LmI6aOO5qC8ClswMjo1Ny42M13lroPku4Xku4Xku6PooajnnYAKWzAyOjU5Ljk5XeaIkeW4jOacm+S9oOW/q+S5kApbMDM6MDIuMzdd5Li65L2g6L6X6L2s5Y+N5L6nClswMzowNC43MV3kuLrkvaDmlL7lvIPkuJbnlYzmnInkvZXkuI3lj68KWzAzOjA4LjA1XeWkj+acq+eni+WHiemHjOW4puS4gOeCuea4qeeDrQpbMDM6MTEuMzFdClswMzoyMS42N13kuLrkvaDop6PlhrvlhrDmsrMKWzAzOjIzLjkwXeS4uuS9oOWBmuS4gOWPquaJkeeBq+eahOmjnuibvgpbMDM6MjcuMTFd5rKh5pyJ5LuA5LmI5LqL5oOF5piv5LiN5YC85b6XClswMzozMC4zN10KWzAzOjMxLjE0XeS4uuS9oOWUsei/memmluatjApbMDM6MzMuMjVd5rKh5pyJ5LuA5LmI6aOO5qC8ClswMzozNS41OV3lroPku4Xku4Xku6PooajnnYAKWzAzOjM4LjAzXeaIkeW4jOacm+S9oOW/q+S5kApbMDM6NDAuNDRd5Li65L2g6L6X6L2s5Y+N5L6nClswMzo0Mi43N13kuLrkvaDmlL7lvIPkuJbnlYzmnInkvZXkuI3lj68KWzAzOjQ2LjEzXeWkj+acq+eni+WHiemHjOW4puS4gOeCuea4qeeDrQpbMDM6NDkuNzRd5pyJ5o2i5a2j55qE6aKc6Imy'
var encodeLrc = 'W2FyOlJpY2sgQXN0bGV5XQpbdGk6TmV2ZXIgR29ubmEgR2l2ZSBZb3UgVXBdCltieTpdCltoYXNoOjgzMjU0MzY5ZjIwMzU4OTE1NGFlYzAzZmU0MzZjYmEyXQpbYWw6XQpbc2lnbjpdCltxcTpdClt0b3RhbDoyMTI5NzZdCltvZmZzZXQ6MF0KWzAwOjAwLjQ4NV1SaWNrIEFzdGxleSAtIE5ldmVyIEdvbm5hIEdpdmUgWW91IFVwClswMDoxOS4zMTFdV2UncmUgbm8gc3RyYW5nZXJzIHRvIGxvdmUKWzAwOjIzLjIwNl1Zb3Uga25vdyB0aGUgcnVsZXMgYW5kIHNvIGRvIEkKWzAwOjI3LjQ5NV1BIGZ1bGwgY29tbWl0bWVudCdzIHdoYXQgSSdtIHRoaW5raW5nIG9mClswMDozMS43NDNdWW91IHdvdWxkbid0IGdldCB0aGlzIGZyb20gYW55IG90aGVyIGd1eQpbMDA6MzUuNzA5XUkganVzdCB3YW5uYSB0ZWxsIHlvdSBob3cgSSdtIGZlZWxpbmcKWzAwOjQwLjk4Ml1Hb3R0YSBtYWtlIHlvdSB1bmRlcnN0YW5kClswMDo0My4zOTNdTmV2ZXIgZ29ubmEgZ2l2ZSB5b3UgdXAgIG5ldmVyIGdvbm5hIGxldCB5b3UgZG93bgpbMDA6NDguMTA0XU5ldmVyIGdvbm5hIHJ1biBhcm91bmQgYW5kIGRlc2VydCB5b3UKWzAwOjUyLjg1XU5ldmVyIGdvbm5hIG1ha2UgeW91IGNyeSAgbmV2ZXIgZ29ubmEgc2F5IGdvb2RieWUKWzAwOjU2LjM2Ml1OZXZlciBnb25uYSB0ZWxsIGEgbGllIGFuZCBodXJ0IHlvdQpbMDE6MDEuNTM4XVdlJ3ZlIGtub3duIGVhY2ggb3RoZXIgZm9yIHNvIGxvbmcKWzAxOjA1LjQ1MV1Zb3VyIGhlYXJ0J3MgYmVlbiBhY2hpbmcgYnV0IHlvdSdyZSB0b28gc2h5IHRvIHNheSBpdApbMDE6MDkuNzIxXUluc2lkZSB3ZSBib3RoIGtub3cgd2hhdCdzIGJlZW4gZ29pbmcgb24KWzAxOjEzLjc0OV1XZSBrbm93IHRoZSBnYW1lIGFuZCB3ZSdyZSBnb25uYSBwbGF5IGl0ClswMToxOC40MDNdQW5kIGlmIHlvdSBhc2sgbWUgaG93IEknbSBmZWVsaW5nClswMToyMy4xODBdRG9uJ3QgdGVsbCBtZSB5b3UncmUgdG9vIGJsaW5kIHRvIHNlZQpbMDE6MjUuNjg1XU5ldmVyIGdvbm5hIGdpdmUgeW91IHVwICBuZXZlciBnb25uYSBsZXQgeW91IGRvd24KWzAxOjI5Ljk3MV1OZXZlciBnb25uYSBydW4gYXJvdW5kIGFuZCBkZXNlcnQgeW91ClswMTozNC4xOTJdTmV2ZXIgZ29ubmEgbWFrZSB5b3UgY3J5ICBuZXZlciBnb25uYSBzYXkgZ29vZGJ5ZQpbMDE6MzguNzI4XU5ldmVyIGdvbm5hIHRlbGwgYSBsaWUgYW5kIGh1cnQgeW91ClswMTo0Mi42NzZdTmV2ZXIgZ29ubmEgZ2l2ZSB5b3UgdXAgIG5ldmVyIGdvbm5hIGxldCB5b3UgZG93bgpbMDE6NDcuMTgxXU5ldmVyIGdvbm5hIHJ1biBhcm91bmQgYW5kIGRlc2VydCB5b3UKWzAxOjUxLjcxXU5ldmVyIGdvbm5hIG1ha2UgeW91IGNyeSAgbmV2ZXIgZ29ubmEgc2F5IGdvb2RieWUKWzAxOjU1LjU5NF1OZXZlciBnb25uYSB0ZWxsIGEgbGllIGFuZCBodXJ0IHlvdQpbMDI6MDAuOTE5XU9vaCBnaXZlIHlvdSB1cApbMDI6MDQuMzQ4XU9vaCBnaXZlIHlvdSB1cApbMDI6MDguNDY0XU9vaCBuZXZlciBnb25uYSBnaXZlICBuZXZlciBnb25uYSBnaXZlIGdpdmUgeW91IHVwClswMjoxMi41NTddT29oIG5ldmVyIGdvbm5hIGdpdmUgIG5ldmVyIGdvbm5hIGdpdmUgZ2l2ZSB5b3UgdXAKWzAyOjE3LjQ4OF1XZSd2ZSBrbm93biBlYWNoIG90aGVyIGZvciBzbyBsb25nClswMjoyMS43NzhdWW91ciBoZWFydCdzIGJlZW4gYWNoaW5nIGJ1dCB5b3UncmUgdG9vIHNoeSB0byBzYXkgaXQKWzAyOjI1Ljg2M11JbnNpZGUgd2UgYm90aCBrbm93IHdoYXQncyBiZWVuIGdvaW5nIG9uClswMjoyOS45ODVdV2Uga25vdyB0aGUgZ2FtZSBhbmQgd2UncmUgZ29ubmEgcGxheSBpdApbMDI6MzQuMjY5XUkganVzdCB3YW5uYSB0ZWxsIHlvdSBob3cgSSdtIGZlZWxpbmcKWzAyOjM5LjE5MV1Hb3R0YSBtYWtlIHlvdSB1bmRlcnN0YW5kClswMjo0MS45MTddTmV2ZXIgZ29ubmEgZ2l2ZSB5b3UgdXAgIG5ldmVyIGdvbm5hIGxldCB5b3UgZG93bgpbMDI6NDYuMTg3XU5ldmVyIGdvbm5hIHJ1biBhcm91bmQgYW5kIGRlc2VydCB5b3UKWzAyOjUwLjQyM11OZXZlciBnb25uYSBtYWtlIHlvdSBjcnkgIG5ldmVyIGdvbm5hIHNheSBnb29kYnllClswMjo1NC43MTRdTmV2ZXIgZ29ubmEgdGVsbCBhIGxpZSBhbmQgaHVydCB5b3UKWzAyOjU4Ljg2OV1OZXZlciBnb25uYSBnaXZlIHlvdSB1cCAgbmV2ZXIgZ29ubmEgbGV0IHlvdSBkb3duClswMzowMy4xOF1OZXZlciBnb25uYSBydW4gYXJvdW5kIGFuZCBkZXNlcnQgeW91ClswMzowNy4yOTRdTmV2ZXIgZ29ubmEgbWFrZSB5b3UgY3J5ICBuZXZlciBnb25uYSBzYXkgZ29vZGJ5ZQpbMDM6MTEuNTQwXU5ldmVyIGdvbm5hIHRlbGwgYSBsaWUgYW5kIGh1cnQgeW91ClswMzoxNS44MTNdTmV2ZXIgZ29ubmEgZ2l2ZSB5b3UgdXAgIG5ldmVyIGdvbm5hIGxldCB5b3UgZG93bgpbMDM6MTkuOTkyXU5ldmVyIGdvbm5hIHJ1biBhcm91bmQgYW5kIGRlc2VydCB5b3UKWzAzOjI0LjI1OF1OZXZlciBnb25uYSBtYWtlIHlvdSBjcnkgIG5ldmVyIGdvbm5hIHNheSBnb29kYnllClswMzoyOC40NjVdTmV2ZXIgZ29ubmEgdGVsbCBhIGxpZSBhbmQgaHVydCB5b3U='
var encodeTLrcText = 'WzAwOjAwLjQ4NV0KWzAwOjE5LjMxMV3miJHku6zpg73kuI3mmK/mgYvniLHnmoTmlrDmiYsKWzAwOjIzLjIwNl3kvaDmiJHpg73mh4LlvpfpgqPkupvop4TliJkKWzAwOjI3LjQ5NV3miJHlj6rluIzmnJvlj6/ku6Xlhajlipvku6XotbQKWzAwOjMxLjc0M13kvaDkuI3kvJrku47lhbbku5bnlLfkurrpgqPph4zlvpfliLDov5nmoLfnmoTniLHmg4UKWzAwOjM1LjcwOV3miJHlj6rmg7PlkYror4nkvaDmiJHnmoTmhJ/lj5cKWzAwOjQwLjk4Ml3orqnkvaDmmI7nmb0KWzAwOjQzLjM5M13msLjov5zkuI3kvJrmlL7lvIPkvaAg5rC46L+c5LiN5Lya6K6p5L2g5aSx5pybClswMDo0OC4xMDRd5rC46L+c5LiN5Lya6YCD56a7IOaIluiAheaKm+W8g+S9oApbMDA6NTIuODVd5rC46L+c5LiN5Lya6K6p5L2g5rWB5rOqIOawuOi/nOS4jeS8muivtOWGjeingQpbMDA6NTYuMzYyXeawuOi/nOS4jeS8muivtOiwjiDkuI3kvJrkvKTlrrPkvaAKWzAxOjAxLjUzOF3miJHku6znm7jor4bkuobov5nkuYjkuYUKWzAxOjA1LjQ1MV3kvaDnmoTlv4Plvojnl5vkvYbljbTkuI3lpb3mhI/mgJ3lvIDlj6MKWzAxOjA5LjcyMV3lnKjmiJHku6znmoTlhoXlv4Pmt7HlpIQg5oiR5Lus6YO955+l6YGT5Y+R55Sf5LqG5LuA5LmIClswMToxMy43NDld5oiR5Lus6YO955+l6YGT54ix5oOF6KeE5YiZIOW5tuWHhuWkh+W8gOWniwpbMDE6MTguNDAzXeWmguaenOS9oOmXruaIkeeahOaEn+WPlwpbMDE6MjMuMTgwXeS4jeimgeWRiuivieaIkeS9oOeci+S4jeingQpbMDE6MjUuNjg1XeawuOi/nOS4jeS8muaUvuW8g+S9oCDmsLjov5zkuI3kvJrorqnkvaDlpLHmnJsKWzAxOjI5Ljk3MV3msLjov5zkuI3kvJrpgIPnprsg5oiW6ICF5oqb5byD5L2gClswMTozNC4xOTJd5rC46L+c5LiN5Lya6K6p5L2g5rWB5rOqIOawuOi/nOS4jeS8muivtOWGjeingQpbMDE6MzguNzI4XeawuOi/nOS4jeS8muivtOiwjiDkuI3kvJrkvKTlrrPkvaAKWzAxOjQyLjY3Nl3msLjov5zkuI3kvJrmlL7lvIPkvaAg5rC46L+c5LiN5Lya6K6p5L2g5aSx5pybClswMTo0Ny4xODFd5rC46L+c5LiN5Lya6YCD56a7IOaIluiAheaKm+W8g+S9oApbMDE6NTEuNzFd5rC46L+c5LiN5Lya6K6p5L2g5rWB5rOqIOawuOi/nOS4jeS8muivtOWGjeingQpbMDE6NTUuNTk0XeawuOi/nOS4jeS8muivtOiwjiDkuI3kvJrkvKTlrrPkvaAKWzAyOjAwLjkxOV3mlL7lvIPkvaAKWzAyOjA0LjM0OF3mlL7lvIPkvaAKWzAyOjA4LjQ2NF3nu53kuI3kvJog57ud5LiN5LyaIOe7neS4jeS8muaUvuW8g+S9oApbMDI6MTIuNTU3Xee7neS4jeS8miDnu53kuI3kvJog57ud5LiN5Lya5pS+5byD5L2gClswMjoxNy40ODhd5oiR5Lus55u46K+G5LqG6L+Z5LmI5LmFClswMjoyMS43Nzhd5L2g55qE5b+D5b6I55eb5L2G5Y205LiN5aW95oSP5oCd5byA5Y+jClswMjoyNS44NjNd5Zyo5oiR5Lus55qE5YaF5b+D5rex5aSEIOaIkeS7rOmDveefpemBk+WPkeeUn+S6huS7gOS5iApbMDI6MjkuOTg1XeaIkeS7rOmDveefpemBk+eIseaDheinhOWImSDlubblh4blpIflvIDlp4sKWzAyOjM0LjI2OV3miJHlj6rmg7PlkYror4nkvaDmiJHnmoTmhJ/lj5cKWzAyOjM5LjE5MV3orqnkvaDog73lpJ/kuobop6PmiJHnmoTlv4PmhI8KWzAyOjQxLjkxN13msLjov5zkuI3kvJrmlL7lvIPkvaAg5rC46L+c5LiN5Lya6K6p5L2g5aSx5pybClswMjo0Ni4xODdd5rC46L+c5LiN5Lya6YCD56a7IOaIluiAheaKm+W8g+S9oApbMDI6NTAuNDIzXeawuOi/nOS4jeS8muiuqeS9oOa1geazqiDmsLjov5zkuI3kvJror7Tlho3op4EKWzAyOjU0LjcxNF3msLjov5zkuI3kvJror7TosI4g5LiN5Lya5Lyk5a6z5L2gClswMjo1OC44Njld5rC46L+c5LiN5Lya5pS+5byD5L2gIOawuOi/nOS4jeS8muiuqeS9oOWkseacmwpbMDM6MDMuMThd5rC46L+c5LiN5Lya6YCD56a7IOaIluiAheaKm+W8g+S9oApbMDM6MDcuMjk0XeawuOi/nOS4jeS8muiuqeS9oOa1geazqiDmsLjov5zkuI3kvJror7Tlho3op4EKWzAzOjExLjU0MF3msLjov5zkuI3kvJror7TosI4g5LiN5Lya5Lyk5a6z5L2gClswMzoxNS44MTNd5rC46L+c5LiN5Lya5pS+5byD5L2gIOawuOi/nOS4jeS8muiuqeS9oOWkseacmwpbMDM6MTkuOTkyXeawuOi/nOS4jeS8mumAg+emuyDmiJbogIXmipvlvIPkvaAKWzAzOjI0LjI1OF3msLjov5zkuI3kvJrorqnkvaDmtYHms6og5rC46L+c5LiN5Lya6K+05YaN6KeBClswMzoyOC40NjVd5rC46L+c5LiN5Lya6K+06LCOIOS4jeS8muS8pOWus+S9oA=='
var b64DecodeUnicode = function (str) {
return decodeURIComponent(atob(str).split('').map(function (c) {
return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)
}).join(''))
}
var dom_audio = document.getElementById('audio'),
dom_lyric = document.getElementById('lyric')
var lrcLines = []
var lrc = new Lyric({
onPlay: function (line, text) {
console.log(lrcLines[line].text + '\n' + lrcLines[line].extendedLyrics.join('\n'))
// console.log(lrc.lines[lrc.curLineNum].time - lrc.offset - dom_audio.currentTime * 1000)
dom_lyric.innerHTML = text + '<br>' + lrcLines[line].extendedLyrics.join('<br>')
},
onSetLyric: function (lines) {
lrcLines = lines
console.log(lines)
}
})
// lrc.setLyric(b64DecodeUnicode(encodeLrc), b64DecodeUnicode(encodeLrc))
lrc.setLyric(b64DecodeUnicode(encodeLrc), [b64DecodeUnicode(encodeTLrcText)])
dom_audio.onplay = function () {
lrc.play(dom_audio.currentTime * 1000)
}
dom_audio.onpause = function () {
lrc.pause()
}
dom_audio.src = 'https://toside01-1251838060.cos.ap-guangzhou.myqcloud.com/lrc-file-parser%2Ftest2.mp3'
// dom_audio.ontimeupdate = function () {
// console.log(dom_audio.currentTime * 1000)
// }
</script>
</html>