WebGL application preview not loading


#1

I have been working on a WebGL project that utilizes three.js. On my local machine everything is fine, however when I attempt to preview the application within my cloud 9 account, the preview is blank and no error messages are shown (on screen or in the appache logs). Has anyone else ran across this issue or know how I might be able to troubleshoot it? Is there a cloud9 specific log file somewhere that I don’t know about? Below is the index.html page I am attempting to load if it helps to see what I’m doing:

<!DOCTYPE html>

<html>

<head>
    <title></title>
    <script type="text/javascript" src="/three.js"></script>
    <script type="text/javascript" src="/MTLLoader.js"></script>
    <script type="text/javascript" src="/OBJLoader.js"></script>
    <script type="text/javascript" src="/OrbitControls.js"></script>
    <script type="text/javascript" src="/stats.js"></script>
    
    
    <style>
        body {
            margin: 0;
            overflow: hidden;
        }
    </style>
</head>
<body>


<script type="text/javascript" src="/World.js"></script>
<script type="text/javascript" src="/Client.js"></script>

<script type="text/javascript">
    
    // Initialize our new world object which will setup our scene, camera, lights, and renderer.
    var world = new World(true);
    var client = new Client();
    
    // Load the map for this given level. A reference to every model loaded is saved in world.model[*name_of_file*]
    world.modelLoader('meter_grid');
    world.modelLoader('skybox1');
    world.modelLoader('test_character');
    
    
    // Render loop. Important stuff happens in here.
    (function render() {
        
        if(world.stats){
            world.stats.update();
        }
        console.log(JSON.stringify(world.camera.position));
        world.updateRotation(client.key_left, client.key_right);
        
        requestAnimationFrame(render);
        
        world.renderer.render(world.scene, world.camera);
        
    }());
    
</script>

<script src="/controls.js"></script>

</body>
</html>

#2

Do any errors appear in the browser console? Can see by going to developer tools in chrome. It may be something to do with the assets not loading correctly. Can you also try setting your application to public and see if that fixes it.


#3

Looks like whenever I reference / in my links, the preview is looking at
https://preview.c9users.io/
instead of the document root of my application. For example in my code I have:
<script type="text/javascript" src="/Client.js"></script>
which on my local environment points to my app root. On cloud9 whenever I attempt to preview, the preview browser is trying to load:
https://preview.c9users.io/Client.js.
On my local environment I have the application running through nginx server with the root directory pointing to, on cloud9 what is my workspace.

Is there a way to resolve this issue without using relative paths? I’m anti relative path :frowning: