Problems embedding Unity 4 Web Player

Unity Engine
1

I just finished up a quick web game in Unity 4 and had problems embedding the player on my web-site. The HTML page generated by Unity worked fine when I ran the game off of my hard drive, but when I pasted the generated code, slightly modified, into my template and uploaded to my site I received the following error from IE 8 running on Win7 32:

“UnityObject2 is undefined.” in reference to the following line:

var u = new UnityObject2(config);

The game would not display. I was able to fix the issue by inserting the following:

<script type="text/javascript" src="http://webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject2.js"></script>

I’m not sure if that’s the appropriate manner in which to solve this issue, my header code now looks as follows, originally line 2 was missing:

<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<script type="text/javascript" src="http://webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject2.js"></script>
<script type="text/javascript">
<!--
var unityObjectUrl = "http://webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject2.js";
if (document.location.protocol == 'https:')
	unityObjectUrl = unityObjectUrl.replace("http://", "https://ssl-");
document.write('<script type="text\/javascript" src="' + unityObjectUrl + '"><\/script>');
-->
</script>
<script type="text/javascript">
<!--
var config = {
	width: 640, 
	height: 360,
	params: {
		enableDebugging:"0",
		disableContextMenu: true,
		disableFullscreen: true
	}
				
};
var u = new UnityObject2(config);
			
jQuery(function() {

	var $missingScreen = jQuery("#unityPlayer").find(".missing");
	var $brokenScreen = jQuery("#unityPlayer").find(".broken");
	$missingScreen.hide();
	$brokenScreen.hide();

	u.observeProgress(function (progress) {
	switch(progress.pluginStatus) {
		case "broken":
			$brokenScreen.find("a").click(function (e) {
				e.stopPropagation();
				e.preventDefault();
				u.installPlugin();
				return false;
			});
			$brokenScreen.show();
		break;
			case "missing":
				$missingScreen.find("a").click(function (e) {
					e.stopPropagation();
					e.preventDefault();
					u.installPlugin();
					return false;
				});
				$missingScreen.show();
			break;
			case "installed":
				$missingScreen.remove();
			break;
			case "first":
			break;
		}
	});
	u.initPlugin(jQuery("#unityPlayer")[0], "/files/theme/Balls.unity3d");
});
-->
</script>

Any ideas why the original generated code wasn’t working? Will my solution cause problems on certain systems?

2

Replace your javascript with this

var unityObjectUrl = "http://webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject2.js";
if (document.location.protocol == 'https:')
    unityObjectUrl = unityObjectUrl.replace("http://", "https://ssl-");
document.write('<script type="text\/javascript" src="' + unityObjectUrl + '"><\/script>');


jQuery(function() {

    $(document).ready(function() {

        var config = {
            width: 960,
            height: 600,
            params: {enableDebugging: "0"}

        };
        var u = new UnityObject2(config);

        var $missingScreen = jQuery("#unityPlayer").find(".missing");
        var $brokenScreen = jQuery("#unityPlayer").find(".broken");
        $missingScreen.hide();
        $brokenScreen.hide();

        u.observeProgress(function(progress) {
            switch (progress.pluginStatus) {
                case "broken":
                    $brokenScreen.find("a").click(function(e) {
                        e.stopPropagation();
                        e.preventDefault();
                        u.installPlugin();
                        return false;
                    });
                    $brokenScreen.show();
                    break;
                case "missing":
                    $missingScreen.find("a").click(function(e) {
                        e.stopPropagation();
                        e.preventDefault();
                        u.installPlugin();
                        return false;
                    });
                    $missingScreen.show();
                    break;
                case "installed":
                    $missingScreen.remove();
                    break;
                case "first":
                    break;
            }
        });
        u.initPlugin(jQuery("#unityPlayer")[0], "gSphere.unity3d");

    });
});

This is because of the order of events in jQuery

For details - Google document.ready