{"id":851,"date":"2017-02-01T19:29:45","date_gmt":"2017-02-01T10:29:45","guid":{"rendered":"http:\/\/wizard87.com\/wordpress\/?p=851"},"modified":"2026-05-11T01:36:38","modified_gmt":"2026-05-10T16:36:38","slug":"%ec%9a%b0%ed%83%80%ec%9d%b4%ed%85%8c-%ec%95%84%eb%a7%88%ec%b8%a0%ed%82%a4-%ec%a0%84%ec%a0%84%ec%a0%84%ec%84%b8-%ec%8a%a4%ed%8c%8c%ed%81%b4-%eb%ae%a4%ec%a7%81-video","status":"publish","type":"post","link":"https:\/\/blog.wizard87.com\/?p=851","title":{"rendered":"\uc6b0\ud0c0\uc774\ud14c, \uc544\ub9c8\uce20\ud0a4 (\uc804\uc804\uc804\uc138, \uc2a4\ud30c\ud074) \ubba4\uc9c1 Video"},"content":{"rendered":"\n<p class=\"has-text-align-center\">\uc6b0\ud0c0\uc774\ud14c, \uc544\ub9c8\uce20\ud0a4 (\uc804\uc804\uc804\uc138, \uc2a4\ud30c\ud074) \ubba4\uc9c1 Video<\/p>\n\n\n\n<div class=\"demo-wrap\">\n    <div id=\"player-mount\"><\/div>\n<\/div>\n\n  <script src=\"https:\/\/wizard87.com\/aruku-player.min.js\"><\/script>\n  <script>    \n     \/**\n     * ArukuMediaPlayer \uc0dd\uc131\uc790 \uc635\uc158 \uc804\uccb4 \ubaa9\ub85d\n     * \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n     * | \uc635\uc158                      | \ud0c0\uc785               | \uae30\ubcf8\uac12                  | \uc124\uba85                                                 |\n     * |---------------------------|--------------------|-------------------------|------------------------------------------------------|\n     * | videoUrl                  | string             | \"\"                      | HLS\/DASH\/MP4 \ube44\ub514\uc624 URL. \ube44\uc5b4 \uc788\uc73c\uba74 \uc790\ub3d9 \ub85c\ub4dc \uc548 \ud568 |\n     * | srtUrl                    | string             | \"\"                      | SRT \uc790\ub9c9 URL. \ube44\uc5b4 \uc788\uc73c\uba74 \uc790\ub9c9 \ub85c\ub4dc \uc548 \ud568            |\n     * | width                     | string|number|null | null                    | \ucee8\ud14c\uc774\ub108 width (\uc608: \"100%\", 1080, \"1080px\")          |\n     * | height                    | string|number|null | null                    | \ucee8\ud14c\uc774\ub108 height. \uc9c0\uc815 \uc2dc aspectRatio \ubb34\uc2dc            |\n     * | aspectRatio               | string|null        | null (orientation \uc790\ub3d9) | CSS aspect-ratio (\uc608: \"16\/9\", \"9\/16\")                |\n     * | autoplay                  | boolean            | true                    | \ub85c\ub4dc \uc9c1\ud6c4 \uc7ac\uc0dd \uc2dc\ub3c4 (\ube0c\ub77c\uc6b0\uc800 \uc815\ucc45\uc5d0 \ub530\ub77c \ucc28\ub2e8 \uac00\ub2a5) |\n     * | subtitleSize              | number             | 32                      | \ucd08\uae30 \uc790\ub9c9 \uae00\uc790 \ud06c\uae30(px). 16~72 \uc0ac\uc774                  |\n     * | subtitleColor             | string             | \"white\"                 | \ucd08\uae30 \uc790\ub9c9 \uc0c9\uc0c1 (\uc774\ub984 \/ #hex \/ rgb())                 |\n     * | defaultSubtitleYPercent   | number             | 85                      | \ucd08\uae30 \uc790\ub9c9 \uc138\ub85c \uc704\uce58 (5~95%)                          |\n     * | storageKey                | string             | \"shakaSrtPlayer.v1\"     | localStorage \uc800\uc7a5 \ud0a4 (\ub2e4\uc911 \uc778\uc2a4\ud134\uc2a4 \uc2dc \ubd84\ub9ac \uad8c\uc7a5)    |\n     * | shakaUrl                  | string             | shaka 4.15.10 CDN       | Shaka Player \uc2a4\ud06c\ub9bd\ud2b8 URL \uc624\ubc84\ub77c\uc774\ub4dc                 |\n     * \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n     *\n     * \ucc38\uace0: \uc0ac\uc6a9\uc790\uac00 \uc790\ub9c9 \uc704\uce58\/\ud06c\uae30\/\ubcfc\ub968 \ub4f1\uc744 \ubcc0\uacbd\ud558\uba74 storageKey\uc5d0 \uc800\uc7a5\ub418\uc5b4\n     *       \ub2e4\uc74c \ub85c\ub4dc \uc2dc \uc790\ub3d9 \ubcf5\uc6d0\ub429\ub2c8\ub2e4 (subtitleSize, defaultSubtitleYPercent,\n     *       subtitlesEnabled \ub4f1 \ucd08\uae30 \uc635\uc158\ubcf4\ub2e4 localStorage \uac12\uc774 \uc6b0\uc120).\n     *\/\n    const player = new ArukuMediaPlayer(\n    \tdocument.getElementById(\"player-mount\"), {\n      \/\/ \u2500\u2500 \uc18c\uc2a4 \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      videoUrl: \"https:\/\/blog.wizard87.com\/wp-content\/uploads\/2017\/02\/\uc544\ub9c8\uce20\ud0a4-\uc804\uc804\uc804\uc0dd-\ub108\uc758-\uc774\ub984\uc740ost-\uc790\ub9c9-HD-\uc6b0\ud0c0\uc774\ud14c.mp4\",      \n\n      \/\/ \u2500\u2500 \uc0ac\uc774\uc988 \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      width: null,                  \/\/ \uc608: \"100%\", 1080, \"1080px\"\n      height: null,                 \/\/ \uc608: 480, \"60vh\"\n      aspectRatio: null,            \/\/ \uc608: \"16\/9\", \"9\/16\", \"21\/9\"\n\n      \/\/ \u2500\u2500 \uc7ac\uc0dd \ub3d9\uc791 \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      autoplay: true,\n\n      \/\/ \u2500\u2500 \uc790\ub9c9 \ucd08\uae30\uac12 \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      subtitleSize: 25,             \/\/ 16 ~ 72\n      subtitleColor: \"white\",       \/\/ \"white\" | \"yellow\" | \"#ffcc00\" | \"rgb(255,200,0)\" \ub4f1\n      defaultSubtitleYPercent: 88,  \/\/ 5 ~ 95\n    });\n\n    \/\/ \uc778\uc2a4\ud134\uc2a4 \uba54\uc11c\ub4dc \uc608\uc2dc (\ud544\uc694 \uc2dc \uc0ac\uc6a9):\n    \/\/ player.ready.then(() => console.log(\"player ready\"));\n    \/\/ player.load(videoUrl, srtUrl);\n    \/\/ player.play(); player.pause(); player.togglePlay();\n    \/\/ player.seekRelative(10);\n    \/\/ player.setVolume(0.5); player.toggleMute();\n    \/\/ player.setSubtitleSize(40); player.setSubtitleColor(\"yellow\");\n    \/\/ player.toggleSubtitles(); player.toggleFullscreen();\n    \/\/ player.destroy();\n  <\/script>\n\n\n\n<p class=\"has-text-align-center\">\uc791\uc0b4\ub09c\ub2e4 \u314b\u314b<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\uc6b0\ud0c0\uc774\ud14c, \uc544\ub9c8\uce20\ud0a4 (\uc804\uc804\uc804\uc138, \uc2a4\ud30c\ud074) \ubba4\uc9c1 Video \uc791\uc0b4\ub09c\ub2e4 \u314b\u314b<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[56,50],"tags":[],"_links":{"self":[{"href":"https:\/\/blog.wizard87.com\/index.php?rest_route=\/wp\/v2\/posts\/851"}],"collection":[{"href":"https:\/\/blog.wizard87.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.wizard87.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.wizard87.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.wizard87.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=851"}],"version-history":[{"count":7,"href":"https:\/\/blog.wizard87.com\/index.php?rest_route=\/wp\/v2\/posts\/851\/revisions"}],"predecessor-version":[{"id":1752,"href":"https:\/\/blog.wizard87.com\/index.php?rest_route=\/wp\/v2\/posts\/851\/revisions\/1752"}],"wp:attachment":[{"href":"https:\/\/blog.wizard87.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=851"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.wizard87.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=851"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.wizard87.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=851"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}