jeromeetienne / tquery

extension system for three.js
http://jeromeetienne.github.io/tquery/
MIT License
651 stars 120 forks source link

deploy static cors on nodejitsu #206

Closed jeromeetienne closed 12 years ago

jeromeetienne commented 12 years ago
jeromeetienne commented 12 years ago

examples of use

<!doctype html><title>tQuery minimal page</title>
<script src="http://localhost:3000/build/tquery-bundle-require.js"></script>
<body><script>
    requirejs.config({ baseUrl: 'http://localhost:3000/' });
    require(['tquery.createplanet'], function(){
        var world = tQuery.createWorld().boilerplate().start();
        tQuery.createPlanet().addTo(world)
    });
</script></body>

it was showing planet image even if the image is from :3000 and the playground from :8000

so seems to work

links about node.js / express cors

server.js

var express = require('express');
var app     = express();

app.get('/', function(req, res){
    res.send('Hello World');
});

//CORS middleware
var allowCrossDomain    = function(req, res, next){
    res.header('Access-Control-Allow-Origin', '*' );
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.header('Access-Control-Allow-Headers', 'Content-Type');
    if( 'OPTIONS' == req.method ){
        res.send(200);
    }else{
        next();
    }
}

//...
app.configure(function(){
    app.use(express.bodyParser());
    app.use(express.cookieParser());
    app.use(express.session({ secret: 'cool beans' }));
    app.use(express.methodOverride());
    app.use(allowCrossDomain);
    app.use(app.router);
    app.use(express.static(__dirname + '/public'));
});

app.listen(3000);
console.log('Listening on port 3000');
jeromeetienne commented 12 years ago

http://jsbin.com/egemib/8/edit

http://jsfiddle.net/BtUZg/10/

seems to work

jeromeetienne commented 12 years ago

But nodejitsu transfert the whole data everytime. So it is super long to deploy.

alterntives

jeromeetienne commented 12 years ago

alternative hosts

jeromeetienne commented 12 years ago

todo dropbox cors

jeromeetienne commented 12 years ago

timb: jetienne: made a quick thing to add CORS headers to resources http://corsify.appspot.com

super proxy

christianatkin commented 12 years ago

Im quite new to this but i've been battling with this cors problem for a while, and attempted something with app engine not long ago, with no success, corsify seems to work excellently but i don't want to keep hammering corsify with requests, are you able to publish how you did it?

jeromeetienne commented 12 years ago

@christianatkin Corsify isnt from me :) But from timb on #Webgl freenode

christianatkin commented 12 years ago

ahh thankyou!

jeromeetienne commented 12 years ago

corsify seems cool but issue when i use require.js

some issue. i dunno from where. corsify seems to cache github content more than my browser

but it seems to work :)

jeromeetienne commented 12 years ago
jeromeetienne commented 12 years ago

http://mrdoob.com/projects/code-editor/#B/hZGxbsIwEIbn8BQmC0aCWAxd2pChQ7dKVKKq1KqD4xzB1LGNfS5EqO9eJwQk1KGb73z3/f/d5ePKCGwtkC02qshRooLiWWrZcEXwJYBryYrXkLPz1yj3wkmLxDuxTLeI9p6xHTjTAKAErSGrJW5DmQnTMNx3AFYGqaohmJdBVwrmDvZBOsh2Pi1ydoZGemmqtsgvYcIYORj3JXVNuDOxkwjj/CgZunc+yuiNrOmJlNzDq1PknlxsHQ6HrCu3zhzb3s9/Rq0KtdSeXfEMjryxCjxLyc/0oTekJMZNEHTt1Qf9mJwJmVVcA/rJjFwyCEecfM7IJmiB0mg6PY2S5Ju7bjJVkeWw5kw44AhvXZJOs01QysbFx6dH7pB26slN6arXigW8qtaG9ri/VeuoT9PhlNKTp6DHaYQKruCxpQt2dwvI0HHtVex8p4sO1819vVDO+gv9Ag==

jeromeetienne commented 12 years ago

Solution found with http://corsproxy.com

<!doctype html><script src="http://jeromeetienne.github.com/tquery/build/tquery-bundle-require.js"></script>
<script>
// trick to get CORS on github content
requirejs.config({ baseUrl : "http://www.corsproxy.com/jeromeetienne.github.com/tquery/plugins/requirejs/examples/" });
</script>
<body><div id='info'>
    "Spy vs Spy"
    -
    <a href='http://mrdoob.github.com/three.js/'>three.js</a> thru
    <a href='http://jeromeetienne.github.com/tquery/'>tQuery API</a>
    <br/>
    <i>Running after each other, making the world go round and round</i>
</div></body>​
require(['tquery.planets', 'tquery.minecraft', 'tquery.pproc'], function(){
    var world    = tQuery.createWorld().boilerplate().pageTitle('#info').start();
    // add some post processing
    tQuery.createEffectComposer().renderPass()
        .bleachbypass()
        .motionBlur(0.9)
        .film(0.25, 0.25, 648, false)
        .vignette()
        .finish()

    // add the earth
    var planet    = tQuery.createPlanet({
        type    : 'earth'
    }).addTo(world)
    world.loop().hook(function(delta, now){
        var angle    = -0.1 * now * Math.PI * 2;
        planet.rotation(angle, 0, 0)
    })

    // add a minecraft character on top
    var minecraft    = tQuery.createMinecraftChar({
        skinUrl : tQuery.MinecraftChar.baseUrl+'/examples/images/agentsmith.png' 
    }).addTo(world); 
    minecraft.object3D('root')
        .translateY(0.5)
        .scaleBy(1/4)
    // init bodyAnims
    new tQuery.MinecraftCharAnimations(minecraft).start('walk');

    // add a minecraft character on bottom
    var minecraft    = tQuery.createMinecraftChar({
        skinUrl : tQuery.MinecraftChar.baseUrl+'/examples/images/agentsmith.png' 
    }).addTo(world);
    minecraft.object3D('root')
        .translateY(-0.5)
        .rotateZ(Math.PI).rotateY(Math.PI)
        .scaleBy(1/4)
    // init bodyAnims
    new tQuery.MinecraftCharAnimations(minecraft).start('walk');
});
​require(['tquery.planets', 'tquery.minecraft', 'tquery.pproc'], function(){
    var world    = tQuery.createWorld().boilerplate().pageTitle('#info').start();
    // add some post processing
    tQuery.createEffectComposer().renderPass()
        .bleachbypass()
        .motionBlur(0.9)
        .film(0.25, 0.25, 648, false)
        .vignette()
        .finish()

    // add the earth
    var planet    = tQuery.createPlanet({
        type    : 'earth'
    }).addTo(world)
    world.loop().hook(function(delta, now){
        var angle    = -0.1 * now * Math.PI * 2;
        planet.rotation(angle, 0, 0)
    })

    // add a minecraft character on top
    var minecraft    = tQuery.createMinecraftChar({
        skinUrl : tQuery.MinecraftChar.baseUrl+'/examples/images/agentsmith.png' 
    }).addTo(world); 
    minecraft.object3D('root')
        .translateY(0.5)
        .scaleBy(1/4)
    // init bodyAnims
    new tQuery.MinecraftCharAnimations(minecraft).start('walk');

    // add a minecraft character on bottom
    var minecraft    = tQuery.createMinecraftChar({
        skinUrl : tQuery.MinecraftChar.baseUrl+'/examples/images/agentsmith.png' 
    }).addTo(world);
    minecraft.object3D('root')
        .translateY(-0.5)
        .rotateZ(Math.PI).rotateY(Math.PI)
        .scaleBy(1/4)
    // init bodyAnims
    new tQuery.MinecraftCharAnimations(minecraft).start('walk');
});
​```
jeromeetienne commented 12 years ago

closing