{"id":660,"date":"2025-10-14T16:08:22","date_gmt":"2025-10-14T07:08:22","guid":{"rendered":"https:\/\/aquaguide.cdnetworks.com\/?page_id=660"},"modified":"2026-01-21T11:38:12","modified_gmt":"2026-01-21T02:38:12","slug":"pc-%ec%bb%a4%ec%8a%a4%ed%85%80-%ed%99%94%eb%a9%b4-%ec%84%a4%ec%a0%95%eb%b0%a9%eb%b2%95","status":"publish","type":"page","link":"https:\/\/aquaguide.cdnetworks.com\/?page_id=660","title":{"rendered":"PC \ucee4\uc2a4\ud140 \ud654\uba74 \uc124\uc815\ubc29\ubc95"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

<\/p>\n

PC \ucee4\uc2a4\ud140 \ud654\uba74\uc744 \uc124\uc815\ud558\uae30 \uc704\ud574\uc11c\ub294 \ud654\uba74\uc744 \uad6c\uc131\ud560 \ud50c\ub808\uc774\uc5b4 \uc18c\uc2a4\ub97c \uc900\ube44\ud574\uc57c \ud569\ub2c8\ub2e4.<\/p>\n

<\/p>\n

<\/p>\n

OpeningPage \ud0c0\uc785\uc73c\ub85c \ud50c\ub808\uc774\uc5b4 \uc18c\uc2a4\ub97c PlaynPlay\ub85c \uc0ac\uc6a9\ud558\uc2e4 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/p>\n

<\/p>\n

<\/p>\n

\ubcf4\uc548 \uc0c1\uc758 \ubb38\uc81c\ub85c \ubd88\ub7ec\uc62c \uc6f9\ubdf0 URL\uc740 \ubc18\ub4dc\uc2dc HTTPS \uc778\uc99d\uc11c\uac00 \uc801\uc6a9\ub418\uc5b4 \uc788\uc5b4\uc57c \ud569\ub2c8\ub2e4.<\/strong><\/p>\n

<\/p>\n

<\/p>\n

\uc6f9 \uc11c\ubc84 \uc18c\uc2a4<\/h2>\n

<\/p>\n

<\/p>\n

<!-- \uc6f9 \uc11c\ubc84 \uc18c\uc2a4 -->\n<!DOCTYPE html>\n<html>\n<head>\n    <meta charset=\"UTF-8\">\n    <title>Web View Launcher<\/title>\n    <script src=\"https:\/\/pnp-appdn.cdnetworks.com\/modules\/agent.js\"><\/script>\n    <script type=\"text\/javascript\">\n        const url = \"https:\/\/sample.com\/custom.html\";\n        function webview() {\n            playnplay.launch(LaunchType.OpeningPage, url, options);\n            \/\/ playnplay.launch(LaunchType.OpeningPage, url, { width: 1600, height: 900 });  \/\/ \ud654\uba74 \ud06c\uae30 \uc870\uc815 \uac00\ub2a5\n        }\n    <\/script>\n<\/head>\n<body>\n    <button onclick=\"webview()\">Play<\/button>\n<\/body>\n<\/html><\/code><\/pre>\n
<\/p>\n
<\/p>\n
\ud50c\ub808\uc774\uc5b4 \uc18c\uc2a4<\/h2>\n
<\/p>\n
<\/p>\n
\ud50c\ub808\uc774\uc5b4\ub294 \uc544\ub798 \uc18c\uc2a4\ub97c \uac00\uc838\uc640 \ud654\uba74\uc744 \uad6c\uc131\ud569\ub2c8\ub2e4.<\/p>\n
<\/p>\n
<\/p>\n
\ud654\uba74 \uad6c\uc131\uc744 \uc218\uc815\ud558\uace0 \uc2f6\uc73c\uc2e0 \uacbd\uc6b0 css\ud30c\uc77c\uc744 \ubcc4\ub3c4 \uad6c\uc131\ud574 \uc8fc\uc154\uc57c \ud569\ub2c8\ub2e4.<\/strong><\/p>\n
<\/p>\n
<\/p>\n
\ud50c\ub808\uc774\uc5b4 \uae30\ubcf8 \ud654\uba74\uc744 \uadf8\ub300\ub85c \uc0ac\uc6a9\ud558\uba74\uc11c \uc678\uc801\uc778 \ubd80\ubd84\uc744 \ucd94\uac00\ud558\uace0 \uc2f6\uc73c\uc2e0 \uacbd\uc6b0 \uc544\ub798 \uc18c\uc2a4\ub97c \ub2e4\uc6b4\ub85c\ub4dc \ubc1b\uc544 \ubcc4\ub3c4 \uc2a4\ud0c0\uc77c \uad6c\uc131\uc744 \ucd94\uac00\ud574 \uc8fc\uc138\uc694.nplayer.css<\/a>nplayer.png<\/a><\/p>\n
<\/p>\n
<\/p>\n
<!-- \ud50c\ub808\uc774\uc5b4 \uc18c\uc2a4 (https:\/\/sample.com\/custom.html\uc5d0 \ud574\ub2f9) -->\n<!DOCTYPE html>\n<html>\n<head>\n    <meta charset=\"utf-8\">\n    <title>Media Player<\/title>\n    <link type=\"text\/css\" href=\"https:\/\/pnp-appdn.cdnetworks.com\/modules\/nplayer\/nplayer.css\" rel=\"stylesheet\" \/>\n    <!-- \ub610\ub294 <link type=\"text\/css\" href=\".\/nplayer.css\" rel=\"stylesheet\" \/> -->\n    <style>\n        body {\n            background-color: #000;\n        }\n        #player-container {\n            position: fixed;\n            top: 0;\n            left: 0;\n            right: 0;\n            bottom: 0;\n            background: #000000;\n            width: 100vw;\n            height: 100vh;\n        }\n    <\/style>\n    <script type=\"text\/javascript\" src=\"https:\/\/pnp-appdn.cdnetworks.com\/modules\/nplayer\/nplayer.js\"><\/script>\n    <script type=\"text\/javascript\">\n        document.addEventListener('DOMContentLoaded', () => {\n            document.title = \"nPlayer Sample\";\n            document.oncontextmenu = () => false;\n\n            const mediaItem = {\n                url: \"https:\/\/sample.com\/video\/test.mp4\",\n                drm: {\n                    appId: \"app id\",\n                    userId: \"test\"\n                }\n            };\n\n            const video = document.querySelector('#player-container video');\n            video.open(mediaItem);\n        });\n    <\/script>\n<\/head>\n<body>\n    <div id=\"player-container\">\n        <video controls playsinline autoplay preload=\"auto\" crossorigin=\"anonymous\"><\/video>\n    <\/div>\n    <script>\n        const player = new NPlayer('#player-container video');\n    <\/script>\n<\/body>\n<\/html><\/code><\/pre>\n
<\/p>\n
<\/p>\n
\uac1c\ubc1c\uc790\ub3c4\uad6c \ud65c\uc131\ud654<\/h2>\n
<\/p>\n
<\/p>\n
\uac1c\ubc1c\uc790\ub3c4\uad6c\ub97c \ud65c\uc131\ud654\ud558\uace0 \uc2f6\uc73c\uc2e0 \uacbd\uc6b0 \uc544\ub798 \ucf54\ub4dc\ub97c \ucc38\uace0\ud558\uc5ec \uc801\uc6a9 \uac00\ub2a5\ud569\ub2c8\ub2e4.<\/p>\n
<\/p>\n
<\/p>\n
\uac1c\ubc1c\uc790\ub3c4\uad6c \ud65c\uc131\ud654 \ubc29\ubc95 \uba85\uc138\ub294 \uc544\ub798 \ub9c1\ud06c\ub97c \ud655\uc778 \ubd80\ud0c1\ub4dc\ub9ac\uba70, \uc774 \uae30\ub2a5\uc740 \ubc18\ub4dc\uc2dc \uac1c\ubc1c\ud658\uacbd\uc5d0\uc11c\ub9cc \uc0ac\uc6a9 \ubd80\ud0c1\ub4dc\ub9bd\ub2c8\ub2e4.<\/p>\n
<\/p>\n
<\/p>\n
\ucee4\uc2a4\ud140 \ud398\uc774\uc9c0 \uac1c\ubc1c\uc790\ub3c4\uad6c \ud65c\uc131\ud654<\/a><\/p>\n
<\/p>\n
<\/p>\n
\ub3d9\uc77c\uacbd\ub85c\uc5d0 \uc544\ub798 \ucf54\ub4dc\ub97c “playnplay-service.js” \ud30c\uc77c\ub85c \uc800\uc7a5\ud574 \uc8fc\uc138\uc694.<\/p>\n
<\/p>\n
<\/p>\n
self.importScripts('https:\/\/pnp-appdn.cdnetworks.com\/modules\/playnplay-service.js');<\/code><\/pre>\n
<\/p>\n
<\/p>\n
Webview \ud398\uc774\uc9c0 \ucf54\ub4dc<\/p>\n
<\/p>\n
<\/p>\n
<!-- \ud50c\ub808\uc774\uc5b4 \uc18c\uc2a4 (https:\/\/sample.com\/custom.html\uc5d0 \ud574\ub2f9) -->\n<!DOCTYPE html>\n<html>\n<head>\n    <meta charset=\"utf-8\">\n    <title>Media Player<\/title>\n    <link type=\"text\/css\" href=\"https:\/\/pnp-appdn.cdnetworks.com\/modules\/nplayer\/nplayer.css\" rel=\"stylesheet\" \/>\n    <!-- \ub610\ub294 <link type=\"text\/css\" href=\".\/nplayer.css\" rel=\"stylesheet\" \/> -->\n    <style>\n        body {\n            background-color: #000;\n        }\n        #player-container {\n            position: fixed;\n            top: 0;\n            left: 0;\n            right: 0;\n            bottom: 0;\n            background: #000000;\n            width: 100vw;\n            height: 100vh;\n        }\n    <\/style>\n    <script type=\"text\/javascript\" src=\"https:\/\/pnp-appdn.cdnetworks.com\/modules\/nplayer\/nplayer.js\"><\/script>\n    <script type=\"text\/javascript\">\n        const appId = 'app id';\n        playnplay.startService(appId, '.\/playnplay-service.js');\n        window.addEventListener('keydown', (event) => {\n            if (event.key === 'F10' && event.ctrlKey) {\n                window.openDevTools();\n            }\n        });\n        document.addEventListener('DOMContentLoaded', () => {\n            document.title = \"nPlayer Sample\";\n            document.oncontextmenu = () => false;\n\n            const mediaItem = {\n                url: \"https:\/\/sample.com\/video\/test.mp4\",\n                drm: {\n                    appId: appId,\n                    userId: \"test\"\n                }\n            };\n\n            const video = document.querySelector('#player-container video');\n            video.open(mediaItem);\n        });\n    <\/script>\n<\/head>\n<body>\n    <div id=\"player-container\">\n        <video controls playsinline autoplay preload=\"auto\" crossorigin=\"anonymous\"><\/video>\n    <\/div>\n    <script>\n        const player = new NPlayer('#player-container video');\n    <\/script>\n<\/body>\n<\/html><\/code><\/pre>\n
<\/p>\n
<\/p>\n
\ucee4\uc2a4\ud140 \ud50c\ub808\uc774\ub9ac\uc2a4\ud2b8 & \ubd81\ub9c8\ud06c \uad6c\ud604<\/h2>\n
<\/p>\n
<\/p>\n
nPlayer Skin\uc744 \ubca0\uc774\uc2a4\ub85c \ucee4\uc2a4\ud140\ud55c \ud50c\ub808\uc774\ub9ac\uc2a4\ud2b8\uc640 \ubd81\ub9c8\ud06c\ub97c \ucd94\uac00\ud560 \uc218 \uc788\ub294 \uc0d8\ud50c \ucf54\ub4dc\uc785\ub2c8\ub2e4.<\/p>\n
<\/p>\n
<\/p>\n
nPlayer Style Sheet\uac00 \uc544\ub2cc, \uc9c1\uc811 \ud50c\ub808\uc774\uc5b4 \ucee4\uc2a4\ud140 UI\ub97c \uac1c\ubc1c\ud558\uace0 \uc2f6\uc73c\uc2e0 \uacbd\uc6b0 \uc544\ub798 \uc0d8\ud50c\uc744 \ucc38\uc870\ud558\uc5ec \uac1c\ubc1c \ubd80\ud0c1\ub4dc\ub9bd\ub2c8\ub2e4.<\/p>\n
<\/p>\n
<\/p>\n
\ucf54\ub4dc\ub85c \uad6c\ud604\ub41c \ud654\uba74:<\/p>\n
<\/p>\n
<\/p>\n
\"customview-sample\"<\/figure>\n
<\/p>\n
<\/p>\n
Sample Code Download<\/a><\/p>\n
<\/p>\n
<\/p>\n
<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\ub4a4\ub85c \uac00\uae30<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"
PC \ucee4\uc2a4\ud140 \ud654\uba74\uc744 \uc124\uc815\ud558\uae30 \uc704\ud574\uc11c\ub294 \ud654\uba74\uc744 \uad6c\uc131\ud560 \ud50c\ub808\uc774\uc5b4 \uc18c\uc2a4\ub97c \uc900\ube44\ud574\uc57c \ud569\ub2c8\ub2e4. OpeningPage \ud0c0\uc785\uc73c\ub85c \ud50c\ub808\uc774\uc5b4 \uc18c\uc2a4\ub97c PlaynPlay\ub85c \uc0ac\uc6a9\ud558\uc2e4 \uc218 \uc788\uc2b5\ub2c8\ub2e4. \ubcf4\uc548 […]<\/p>\n","protected":false},"author":5,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-660","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/aquaguide.cdnetworks.com\/index.php?rest_route=\/wp\/v2\/pages\/660","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aquaguide.cdnetworks.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/aquaguide.cdnetworks.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/aquaguide.cdnetworks.com\/index.php?rest_route=\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/aquaguide.cdnetworks.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=660"}],"version-history":[{"count":7,"href":"https:\/\/aquaguide.cdnetworks.com\/index.php?rest_route=\/wp\/v2\/pages\/660\/revisions"}],"predecessor-version":[{"id":816,"href":"https:\/\/aquaguide.cdnetworks.com\/index.php?rest_route=\/wp\/v2\/pages\/660\/revisions\/816"}],"wp:attachment":[{"href":"https:\/\/aquaguide.cdnetworks.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=660"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}