<div id="readability-page-1" class="page"><div>
                <div id="SE-1a59c22a-0eb2-475e-8639-5cf005981493">
                            <p id="SE-6951892c-2d2e-4a2d-b2fd-ab598149a4ca"><span id="SE-1ef99755-c7fd-4f2e-a9a7-48fad36a8574">* 본 문서는 업데이트된 XRCLOUD가이드 문서 중 하나 입니다.</span></p>
                        </div>                                <div id="SE-1dfb7007-1660-4685-89de-75ea86d5b1c2">
                                    <ul><li><p id="SE-18f7654d-d904-4b16-80b3-3533ecafc3ce"><span id="SE-92a42cb1-81c6-49ed-90db-53e720e4d766">Hubs는 링크, 이미지 컴포넌트에 링크를 걸어 외부 웹페이지로 보낼 수 있는데 플랫폼 서비스의 사용자 경험을 해칠 수 있습니다.</span></p></li><li><p id="SE-a5b49211-6bea-4a3c-9343-627e6e3176c5"><span id="SE-7496cab1-3171-434d-bd1f-572f112dd893">XRCLOUD의 Spoke는 Room을 벗어나지 않고 웹페이지를 볼 수 있는 추가 기능을 제공하는 인라인뷰 컴포넌트를 제공합니다.</span></p></li></ul>
                            </div>                <div id="SE-b6c8a7dc-daf8-4d4b-a969-60a2bef9be89">
                                <p><a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-b6c8a7dc-daf8-4d4b-a969-60a2bef9be89&quot;, &quot;src&quot; : &quot;https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd23b0b6-8195-4aeb-a462-2d299e09ea08%2F4373a420-2912-433c-b6f1-91c4d54c0e86%2Fimage_%283%29.png?table=block&amp;id=74b95963-9925-4f30-9c02-aca4612cbfc9&amp;spaceId=cd23b0b6-8195-4aeb-a462-2d299e09ea08&amp;width=2000&amp;userId=243992a1-5e9f-49bd-87cd-39dc00da1967&amp;cache=v2&quot;, &quot;originalWidth&quot; : &quot;2000&quot;, &quot;originalHeight&quot; : &quot;1280&quot;, &quot;linkUse&quot; : &quot;false&quot;, &quot;link&quot; : &quot;&quot;}">
                                        <img src="https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd23b0b6-8195-4aeb-a462-2d299e09ea08%2F4373a420-2912-433c-b6f1-91c4d54c0e86%2Fimage_%283%29.png?table=block&amp;id=74b95963-9925-4f30-9c02-aca4612cbfc9&amp;spaceId=cd23b0b6-8195-4aeb-a462-2d299e09ea08&amp;width=2000&amp;userId=243992a1-5e9f-49bd-87cd-39dc00da1967&amp;cache=v2" alt="">
                                    </a>
                                </p>
                            <p id="SE-89a9741c-4c52-4899-aab7-553d98454dc5"><span id="SE-8168bc9c-a931-4557-94b6-86e7709bd9b5">XRCLOUD에서 제공하는 InlineView 컴포넌트</span></p>
                        </div>
                <div id="SE-ab0f5eac-6a19-4010-bb0b-7a75e7915351">
                                    <ul><li><p id="SE-0bb6842f-f12a-4a5d-ac04-b9508b606d68"><span id="SE-cbbea12d-fbee-4c74-b479-1900cc748b7f">페이지를 보여주는 방식은 총 4가지를 지원합니다.</span></p></li></ul>
                            </div>                <div id="SE-e7f85b9a-00de-454c-ad8d-32d84eaabe8a">
                                <p><a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-e7f85b9a-00de-454c-ad8d-32d84eaabe8a&quot;, &quot;src&quot; : &quot;https://file.notion.so/f/f/cd23b0b6-8195-4aeb-a462-2d299e09ea08/3b9dc77e-bd59-47a1-b0f9-f11a104573a9/image_%282%29.png?table=block&amp;id=a2435aa3-a6dd-4b9b-9ee0-624032133cf1&amp;spaceId=cd23b0b6-8195-4aeb-a462-2d299e09ea08&amp;expirationTimestamp=1723996800000&amp;signature=PY9YU9pLFJS20uqztA-lMeOGNhu-dXcMSjdLbCbOv7g&amp;downloadName=image%20%282%29.png&quot;, &quot;originalWidth&quot; : &quot;1247&quot;, &quot;originalHeight&quot; : &quot;794&quot;, &quot;linkUse&quot; : &quot;false&quot;, &quot;link&quot; : &quot;&quot;}">
                                        <img src="https://file.notion.so/f/f/cd23b0b6-8195-4aeb-a462-2d299e09ea08/3b9dc77e-bd59-47a1-b0f9-f11a104573a9/image_%282%29.png?table=block&amp;id=a2435aa3-a6dd-4b9b-9ee0-624032133cf1&amp;spaceId=cd23b0b6-8195-4aeb-a462-2d299e09ea08&amp;expirationTimestamp=1723996800000&amp;signature=PY9YU9pLFJS20uqztA-lMeOGNhu-dXcMSjdLbCbOv7g&amp;downloadName=image%20%282%29.png" alt="">
                                    </a>
                                </p>
                            <p id="SE-ce38f312-9aa4-43f6-80a8-2aa16f123e79"><span id="SE-4b23a468-c1f7-4e1a-9108-105ceb1498c6">인라인뷰의 4가지 옵션</span></p>
                        </div>
                <div id="SE-3671ae84-d15b-45fe-ba2a-1a9d089bf144">
                                    <ul><li><p id="SE-895a49d7-9522-467e-ba63-28b70c4547f2"><span id="SE-39284b9b-0aa3-4c41-9fd7-0a31f03cd594">Main : 3D공간의 위치에 iframe으로 페이지를 로딩합니다.</span></p></li></ul>
                            </div>                <div id="SE-9421a73f-b568-42e3-9b6f-091e61eb7076">
                                <p><a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-9421a73f-b568-42e3-9b6f-091e61eb7076&quot;, &quot;src&quot; : &quot;https://file.notion.so/f/f/cd23b0b6-8195-4aeb-a462-2d299e09ea08/5688140a-50cf-4bed-bc5d-032585855629/image.png?table=block&amp;id=27c8137f-2665-4dc0-aa49-0a932c6e35b6&amp;spaceId=cd23b0b6-8195-4aeb-a462-2d299e09ea08&amp;expirationTimestamp=1723996800000&amp;signature=1LYkV_azsEhpX_CAywDfyaHGHouudOY7yQShuNW2E4U&amp;downloadName=image.png&quot;, &quot;originalWidth&quot; : &quot;1184&quot;, &quot;originalHeight&quot; : &quot;879&quot;, &quot;linkUse&quot; : &quot;false&quot;, &quot;link&quot; : &quot;&quot;}">
                                        <img src="https://file.notion.so/f/f/cd23b0b6-8195-4aeb-a462-2d299e09ea08/5688140a-50cf-4bed-bc5d-032585855629/image.png?table=block&amp;id=27c8137f-2665-4dc0-aa49-0a932c6e35b6&amp;spaceId=cd23b0b6-8195-4aeb-a462-2d299e09ea08&amp;expirationTimestamp=1723996800000&amp;signature=1LYkV_azsEhpX_CAywDfyaHGHouudOY7yQShuNW2E4U&amp;downloadName=image.png" alt="">
                                    </a>
                                </p>
                            <p id="SE-3b5e5d19-295d-471d-9774-c06e483d2cc6"><span id="SE-ed8ffead-373b-4242-a76c-ca5f5b691049">Unity WebGL 콘텐츠를 Room에서 보여주는 사례</span></p>
                        </div>
                <div id="SE-08324e43-cca2-41c9-98ec-a93cf85c561a">
                                    <ul><li><p id="SE-fd7b133b-ead0-4094-9bf4-82d365f3688f"><span id="SE-ae5a1372-b1ae-4d48-9e9b-f8a60cddfc6e">외부 웹페이지에서는 iframe을 허용하기 위해 XRCLOUD의 Room URL인 room.xrcloud.app을 CORS허용 해주어야 정상적으로 로딩 됩니다.</span></p></li></ul>
                            </div>                <div id="SE-bac552c2-5b1b-4ed8-a973-a314453b5c1c">
                                <p><a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-bac552c2-5b1b-4ed8-a973-a314453b5c1c&quot;, &quot;src&quot; : &quot;https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd23b0b6-8195-4aeb-a462-2d299e09ea08%2F672af3f6-7dfc-4766-b94f-7d19f98273df%2Fimage.png?table=block&amp;id=72840278-1ae0-423b-ab13-81d8abaf2ef2&amp;spaceId=cd23b0b6-8195-4aeb-a462-2d299e09ea08&amp;width=2000&amp;userId=243992a1-5e9f-49bd-87cd-39dc00da1967&amp;cache=v2&quot;, &quot;originalWidth&quot; : &quot;2000&quot;, &quot;originalHeight&quot; : &quot;1541&quot;, &quot;linkUse&quot; : &quot;false&quot;, &quot;link&quot; : &quot;&quot;}">
                                        <img src="https://www.notion.so/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2Fcd23b0b6-8195-4aeb-a462-2d299e09ea08%2F672af3f6-7dfc-4766-b94f-7d19f98273df%2Fimage.png?table=block&amp;id=72840278-1ae0-423b-ab13-81d8abaf2ef2&amp;spaceId=cd23b0b6-8195-4aeb-a462-2d299e09ea08&amp;width=2000&amp;userId=243992a1-5e9f-49bd-87cd-39dc00da1967&amp;cache=v2" alt="">
                                    </a>
                                </p>
                            <p id="SE-81633a25-9b47-410c-96eb-16aaa722643e"><span id="SE-6f4c6b03-c667-49f1-ae6d-525c8ad1fd57">CORS오류 페이지</span></p>
                        </div>
                <div id="SE-375027b3-d746-4c34-b51b-1a91c4338f7b">
                                    <ul><li><p id="SE-fc9011bc-2923-43dc-8771-69bc3c65c098"><span id="SE-6b9decfd-97eb-4d09-8532-62793ccdb1b0">Side View : 채팅 영역에 iframe으로 페이지를 로딩합니다.</span></p></li><li><p id="SE-6b72de42-609f-47a6-9ba4-91d560c32bad"><span id="SE-faaee7f9-ed04-476c-94c4-b2ce2dcdbeff"><b>세로로 긴 윈도우로 주로 모바일 페이지 형식에 유용합니다. 3D공간이 그대로 유지되는 장점이 있습니다.</b></span></p></li></ul>
                            </div>                <div id="SE-247cee2a-f5ff-4f5a-b58f-ae101df0ec41">
                                <p><a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-247cee2a-f5ff-4f5a-b58f-ae101df0ec41&quot;, &quot;src&quot; : &quot;https://file.notion.so/f/f/cd23b0b6-8195-4aeb-a462-2d299e09ea08/f903a9ee-9ed2-4a4d-9298-017844ee729e/image.png?table=block&amp;id=dd9d113d-b34d-40bd-a2b0-f1522a32f351&amp;spaceId=cd23b0b6-8195-4aeb-a462-2d299e09ea08&amp;expirationTimestamp=1723996800000&amp;signature=TqNBOaytRwqwdErSCUSrTFnD3zZYrDsCLF5tht2J1VI&amp;downloadName=image.png&quot;, &quot;originalWidth&quot; : &quot;1453&quot;, &quot;originalHeight&quot; : &quot;1040&quot;, &quot;linkUse&quot; : &quot;false&quot;, &quot;link&quot; : &quot;&quot;}">
                                        <img src="https://file.notion.so/f/f/cd23b0b6-8195-4aeb-a462-2d299e09ea08/f903a9ee-9ed2-4a4d-9298-017844ee729e/image.png?table=block&amp;id=dd9d113d-b34d-40bd-a2b0-f1522a32f351&amp;spaceId=cd23b0b6-8195-4aeb-a462-2d299e09ea08&amp;expirationTimestamp=1723996800000&amp;signature=TqNBOaytRwqwdErSCUSrTFnD3zZYrDsCLF5tht2J1VI&amp;downloadName=image.png" alt="">
                                    </a>
                                </p>
                            <p id="SE-ba3ffc5b-1caf-4de2-94b1-d3b07724b275"><span id="SE-458ca08a-3345-4db5-b825-fe8be0054331">SIdeView에 표시된 시간표 페이지</span></p>
                        </div>
                <div id="SE-98e0295f-c1d6-4551-a6e5-f464dc10580c">
                                    <ul><li><p id="SE-45a13cb4-d4de-4c6a-9097-afe1cd60b96f"><span id="SE-f530a7c0-f2d1-47f7-90ff-622835c6c291">Self Window : 페이지 전체가 리다이렉트 됩니다. Room을 벗어나게 됩니다.</span></p></li><li><p id="SE-ba244c6b-d9f0-4d12-b182-7a753a05a36b"><span id="SE-f6acbb8d-3b4e-47f6-9078-780703bf8438">New Window : Room은 유지한채로 새 탭에 열립니다. 브라우져의 팝업이 허용되어있어야 합니다.</span></p></li></ul>
                            </div>    </div></div>

숲속얘기의 조용한 카페

* 본 문서는 업데이트된 XRCLOUD가이드 문서 중 하나 입니다. Hubs는 링크, 이미지 컴포넌트에 링크를 걸어 외부 웹페이지로 보낼 수 있는데 플랫폼 서비스의 사용자 경험을 해칠 수 있습니다. XRCLOUD의 Spoke는 Room을 벗어나지 않고 웹페이지를 볼 수 있는 추가 기능을 제공하는 인라인뷰 컴포넌트를 제공합니다. 페이지를 보여주는 방식은 총 4가지를 지원합니다. Main : 3D공간의 위치에 iframe으로 페이지를 로딩합니다. 외부 웹페이지에서는 iframe을 허용하기 위해 XRCLOUD의 Room URL인 room.xrcloud.app을 CORS허용 해주어야 정상적으로 로딩 됩니다. Side View : 채팅 영역에 iframe으로 페이지를 로딩합니다. 세로로 긴 윈도우로 주.......

[XRCLOUD팁] 3D공간을 벗어나지 않고 외부 웹페이지의 정보를 제공하는 XRCLOUD의 인라인뷰 컴포넌트

댓글