추적: • publishingactivecontent
,

액티브 콘텐트의 발행(Publishing active content)

Unity의 Web Player 콘텐트와 같은 액티브 콘텐트를 발행 할 경우, 개발자는 해당 콘텐트가 다양한 브라우저에서 어떻게 처리될 것인가에 대한 고려를 하여야 합니다. 특히, Microsoft's Internet Explorer에서 해당 콘텐트가 어떻게 처리되는 가를 고려해야 하는데 이는 이 특정 브라우저는 오늘날의 다른 지원되는 브라우저야 약간 다르게 동작하기 때문입니다. 사용자의 웹 페이지에 사용자 콘텐트가 어떻게 내장 되어 있는가에 따라, 그것이 마우스나 키보드 입력에 반응하려면 최종사용자가 해당 콘텐트를 구동 하여야 할 수 있습니다. 그 콘텐트를 구동하려면, 최종 사용자는 그 콘텐트 자체를 한번 클릭하거나, 혹은 ActiveX Control을 로딩하기 위하여 대화 창에서 OK을 클릭해야 할 수도 있습니다. 이것이 웹 플레이어 콘텐트가 Internet Explorer에서 사용되는 것을 방지하지는 않지만, 이는 최종 사용자로써는 혼란스러울 가능성이 있고 최상의 경험은 아닐 수 있습니다. 다행히도, Microsoft는 최종 사용자가 웹 플레이어 콘텐트를 구동하는데 클릭을 하지 않아도 될 수 있는 방법으로 개발자가 웹 페이지를 생성하거나 업데이트 할 수 있는 페이지 디자인 솔루션을 제공하였습니다. 다음에는 이 솔루션 중 하나를 구현하는 방법을 상세하게 보여주고 있습니다.

Internet Explorer 에서 ActiveX Controls을 구동하는 데 대한 상세한 정보를 보려면, Activating ActiveX Controls을 참조하십시오.

최종 사용자가 Unity Web Player을 사용하기 전에 구동해야 하는 번거로움을 방지하기 위하여, 런타임 중 웹 페이지에 필요한 오브젝트 태그를 동적으로 작성하기 위하여 외부 JavaScript 파일을 사용하여야 합니다. 설명의 단순화를 위하여, 여기에 설명한 솔루션은 모든 브라우저에서 페이지를 똑 같이 로딩하고 재생하게 하려고, 외부 JavaScript 파일을 사용하여 오브젝트와 내장 태그 모두를 작성할 것 입니다. 가장 간단한 케이스로, 외부 JavaScript 파일을 함수와 함께 사용하는 데, 이 함수를 호출하면 document.write()을 사용하여 필요한 오브젝트와 내장 태그를 작성할 것 입니다.

다음은 필요한 오브젝트와 내장 태그를 동적으로 생성하는 document.write() 호출을 사용하는 JavaScript 함수의 예제입니다: 

<script type="text/javascript" language="javascript">
function writeUnityTags (aSrc, aWidth, aHeight) {
    // write the content object and embed tags
    document.write("<object ");
    document.write("    classid='clsid:444785F1-DE89-4295-863A-D46C3A781394' n");
    document.write("    codebase='http://webplayer.unity3d.com/download_webplayer/UnityWebPlayer.cab#version=2,0,0,0' n");
    document.write("    id='UnityObject' width='" + aWidth + "' height='" + aHeight + "'  > n");
    document.write("    <param name='src' value='" + aSrc + "' /> n");
    document.write("    <embed type='application/vnd.unity' pluginspage='http://www.unity3d.com/unity-web-player-2.x' n");
    document.write("        id='UnityEmbed' width='" + aWidth + "' height='" + aHeight + "' src='" + aSrc + "' n");
    document.write("    /> n");
    document.write("</object>");
}
</script>

위에서 함수 호출 시 3개의 매개변수를 전달하는 것을 주시합니다. 이 매개변수는 웹 플레이어 데이터 파일의 경로와 표시되는 콘텐트의 넓이와 높이를 전달 합니다. 이 매개변수를 사용하여 해당 함수가 호출하는 오브젝트와 내장 태그를 직접 해당 웹 페이지에 작성합니다.

다음은 웹 페이지에 writeUnityTags() JavaScript을 사용하는 예제입니다. 이 함수는 unityweb.js라는 이름은 외부 JavaScript 파일에서 정의하고 있습니다: 

<script type="text/javascript" language="javascript" src="unityweb.js"></script>
<script type="text/javascript" language="javascript">
 
    // call the writeUnityTags function
    writeUnityTags("MyFile.unity3d", 640, 480);
 
</script>

오브젝트와 내장 태그를 작성하는 것이 오로지 그 목적인 함수를 포함하는 이 외부 JavaScript을 사용하여, 최종 사용자가 콘텐트를 사용하고 그것과 상호작용을 하기 전에 구동해야 하는 것을 피하게 할 수 있습니다. 추가적으로, 위 솔루션은 모든 브라우저에서 올바르게 동작하므로, 이것을 구현하게 되면 최종 사용자가 어떤 브라우저와 플랫폼의 조합을 사용하여도 일관적인 체험을 하게 할 수 있을 것 입니다.

여기에 설명한 기술과 함께 Detecting the Unity Web Player using browser scripting에서 논한 웹 플레이어 감지 루틴(detection routine)을 합하면 예측할 수 있고 최적화 된 최종 사용자 체험을 제공하게 됩니다. 다음은 detectUnityWebPlayer() 와 writeUnityTags() 함수를 모두 사용하는 예로써, 두 함수 모두 unityweb.js라는 이름의 외부 JavaScript 파일에서 정의됩니다: 

<script type="text/javascript" language="javascript" src="unityweb.js"></script>
<script type="text/javascript" language="javascript">
 
    // check for the Unity Web Player and respond appropriately
    var tIsInstalled = detectUnityWebPlayer();
    if (tIsInstalled) {
 
        // call the writeUnityTags function
        writeUnityTags("MyFile.unity3d", 640, 480);
 
    } else {
 
        // write out a simple message prompting the user to install the Unity Web Player
        document.write("<div align='center'> n");
        document.write("  This content requires the Unity Web Player,");
        document.write("  please use the link below to install the player today:<br /><br /> n");
        document.write("  <a href='http://www.unity3d.com/unity-web-player-2.x'> n");
        document.write("    Install the Unity Web Player n");
        document.write("  </a> n");
        document.write("</div> n");
 
    }
</script>