How to start?

Everything else that doesn't fall into one of the other categories.
rkonopin
Posts: 1
Joined: Thu Jun 30, 2016 12:38 pm

How to start?

Post by rkonopin »

Sorry for such a basic question and the quality of my English, but I have been searching this forum for a few hours and not found an answer. I suggest the authors to add a paragraph to the manual...At the very beginning of it...

And the question is:

How to place a working example on my web server, like the first "2D"? Running the examples from inside my PC is maybe good for testing, but I need to make it working from my server. I tried many combinations, nothing worked so far. Please, just one working way. I know about the need to copy libraries, but maybe I need something else?

On my web server I have the directory called "public_html" working just like "root" for my web pages. What do I need to place there?
Comtois
Posts: 40
Joined: Mon Feb 24, 2014 11:07 pm

Re: How to start?

Post by Comtois »

use export with 'Copy SpiderBasic libraries' enabled, and transfer all on your server

http://www.spiderbasic.com/documentatio ... piler.html
User avatar
Kurzer
Posts: 90
Joined: Mon May 26, 2014 9:33 am

Re: How to start?

Post by Kurzer »

Hello,

I have also some trouble to get the examples working.

Today I installed the free version of SpiderBasic 1.30 on my PC and ran it with the /PORTABLE command switch.
I loaded some of the delivered examples and ran them (via F5) and also exported the compilation into a directory on my D:\ harddrive (including all the sb-libraries).

Ever try to start the compiled HTML file results in opening my browser and show the colorful background, which seems to be the default background of each compiled SpiderBasic programms. But nothing more happened. No windows no gadgets, nothing.

My computer runs with Windows XP SP3, 32 bits. The browser is Iron portable, a Chrome clone. The examples in SpiderBasics Showcase on the SpiderBasic website are running like a charm - but not my own compiled local html and js. files.

Does anybody have a hint what is missing here?

Kind regards,
Kurzer

Edit: I did further research.
The debug console of the chrome (Iron) browser says the following:

Code: Select all

xhr.js:206 XMLHttpRequest cannot load file:///D:/test/spiderbasic/cbtree/errors/CBTErrors.json. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.xhr @ xhr.js:206
createError.js:282 ErrorCtor
xhr.js:206 XMLHttpRequest cannot load file:///D:/test/spiderbasic/dijit/form/templates/Button.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.xhr @ xhr.js:206
xhr.js:206 XMLHttpRequest cannot load file:///D:/test/spiderbasic/dijit/form/templates/Select.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
... and much more like this error messages.

I'm not a web development / html skilled user, but it looks like the problem is the "file://" protocol description, isnt it?
SB 2.32 x86, Browser: Iron Portable V. 88.0.4500.0 (Chromium based), User age in 2023: 55y
"Happiness is a pet." | "Never run a changing system!"
Leonhardt
Posts: 20
Joined: Wed Feb 26, 2014 9:41 am

Re: How to start?

Post by Leonhardt »

I have the same problem, any one can tell us?
Bradan
Posts: 18
Joined: Fri Nov 04, 2016 2:07 pm

Re: How to start?

Post by Bradan »

Hmm it should start a local webserver, but it seems in your situation it is just opening the file. This cannot work. You could use a minimal webserver (like python3 -m http.server or such) and open it there. Then it should work.
Leonhardt
Posts: 20
Joined: Wed Feb 26, 2014 9:41 am

Re: How to start?

Post by Leonhardt »

Bradan wrote:Hmm it should start a local webserver, but it seems in your situation it is just opening the file. This cannot work. You could use a minimal webserver (like python3 -m http.server or such) and open it there. Then it should work.
but when I run it in SB editor,it runs,so what did SB compiler do ?run a web server?How should I do or config something without SB running? I am web app newbie,sorry about this basic question.
BTW,there is a demo in PB examples called Atomic Web Server, how should I play with it?
Bradan
Posts: 18
Joined: Fri Nov 04, 2016 2:07 pm

Re: How to start?

Post by Bradan »

Leonhardt wrote:
Bradan wrote:Hmm it should start a local webserver, but it seems in your situation it is just opening the file. This cannot work. You could use a minimal webserver (like python3 -m http.server or such) and open it there. Then it should work.
but when I run it in SB editor,it runs,so what did SB compiler do ?run a web server?How should I do or config something without SB running? I am web app newbie,sorry about this basic question.
BTW,there is a demo in PB examples called Atomic Web Server, how should I play with it?
It should work with the atomic web server I think, but I have no time to explain it in detail. If I remember correctly the atomic web server hosts all files in a specific directory. Put your files there and start the server. Then go into your webbrowser and open the address "http://127.0.0.1/yourfile.html" where yourfile.html is the filename of your html file you'd like to open.
the.weavster
Posts: 220
Joined: Sat Mar 01, 2014 3:02 pm

Re: How to start?

Post by the.weavster »

Leonhardt wrote:but when I run it in SB editor,it runs,so what did SB compiler do ?run a web server?
Yes, the IDE runs a little server.

SpiderBasic's install now includes nodejs (SpiderBasic\Android\nodejs\node.exe) which is a runtime that makes creating servers very simple. To run a simple http server use node.exe to run the script below, just edit the root_dir variable to point to the folder containing your project.

Code: Select all

// simple_server.js

// edit these to suit
var root_dir = "C:\\www";
var port = 9000;

// server requires
var fs = require("fs");
var http = require("http");
var path = require("path");
var querystring = require("querystring");
var url = require("url");

// mime types for web server - add as necessary
var mimeTypes = {};
mimeTypes[".pdf"]      = "application/pdf";
mimeTypes[".sig"]      = "application/pgp-signature";
mimeTypes[".spl"]      = "application/futuresplash";
mimeTypes[".ps"]       = "application/postscript";
mimeTypes[".torrent"]  = "application/x-bittorrent";
mimeTypes[".dvi"]      = "application/x-dvi";
mimeTypes[".gz"]       = "application/x-gzip";
mimeTypes[".pac"]      = "application/x-ns-proxy-autoconfig";
mimeTypes[".swf"]      = "application/x-shockwave-flash";
mimeTypes[".gz"]       = "application/x-tgz";
mimeTypes[".tgz"]      = "application/x-tgz";
mimeTypes[".tar"]      = "application/x-tar";
mimeTypes[".zip"]      = "application/zip";
mimeTypes[".mp3"]      = "audio/mpeg";
mimeTypes[".m3u"]      = "audio/x-mpegurl";
mimeTypes[".wma"]      = "audio/x-ms-wma";
mimeTypes[".wax"]      = "audio/x-ms-wax";
mimeTypes[".ogg"]      = "application/ogg";
mimeTypes[".wav"]      = "audio/x-wav";
mimeTypes[".gif"]      = "image/gif";
mimeTypes[".jpg"]      = "image/jpeg";
mimeTypes[".jpeg"]     = "image/jpeg";
mimeTypes[".png"]      = "image/png";
mimeTypes[".xbm"]      = "image/x-xbitmap";
mimeTypes[".xpm"]      = "image/x-xpixmap";
mimeTypes[".xwd"]      = "image/x-xwindowdump";
mimeTypes[".css"]      = "text/css";
mimeTypes[".html"]     = "text/html";
mimeTypes[".htm"]      = "text/html";
mimeTypes[".js"]       = "text/javascript";
mimeTypes[".asc"]      = "text/plain";
mimeTypes[".c"]        = "text/plain";
mimeTypes[".cpp"]      = "text/plain";
mimeTypes[".log"]      = "text/plain";
mimeTypes[".conf"]     = "text/plain";
mimeTypes[".text"]     = "text/plain";
mimeTypes[".txt"]      = "text/plain";
mimeTypes[".dtd"]      = "text/xml";
mimeTypes[".xml"]      = "text/xml";
mimeTypes[".mpeg"]     = "video/mpeg";
mimeTypes[".mpg"]      = "video/mpeg";
mimeTypes[".mov"]      = "video/quicktime";
mimeTypes[".qt"]       = "video/quicktime";
mimeTypes[".avi"]      = "video/x-msvideo";
mimeTypes[".asf"]      = "video/x-ms-asf";
mimeTypes[".asx"]      = "video/x-ms-asf";
mimeTypes[".wmv"]      = "video/x-ms-wmv";
mimeTypes[".bz2"]      = "application/x-bzip";
mimeTypes[".tbz"]      = "application/x-bzip-compressed-tar";

function start() {  
    function onRequest(request, response){
        var pathname = url.parse(request.url).pathname;
        var postData = "";
        request.setEncoding('utf8');
        
        // this is how to get the data for a POST request - we don't handle them here though :-)
        function onReceivedData(postDataChunk) {
            postData += postDataChunk;
        }
        request.addListener('data',onReceivedData);
        
        function onEndData() {
            if(request.method.toLowerCase() == 'get') { // it's a GET request
                streamFile(response, pathname);
            } else { // this simple server only does get
                response.writeHead(500, {"Content-Type": "text/plain"});
                response.write("Error - we only do GET requests");
                response.end();
            }
        }
        request.addListener('end',onEndData);
    }

    http.createServer(onRequest).listen(port,'localhost');
    console.log('server listening on port ' + port);
}

function streamFile(response, pathname) {
    var filename = path.join(root_dir,pathname);
    var fxt = path.extname(pathname);
    var fType = mimeTypes[fxt];
    
    var fileOK = true;
    try {
        fs.access(filename,fs.R_OK,function(err) {
            if(err) { fileOK = false; }
        });
    } catch(e) {
        console.log(e);
        fileOK = false;
    }
    if(!fileOK) {
        response.writeHead(404, {"Content-Type": "text/plain"});
        response.write("404 Not Found\n");
        response.end();
        return;
    }
    
    var firstChunk = true;
    var s = fs.createReadStream(filename, {'bufferSize': 256 * 1024});
    
    s.on('error', function(error) {
        response.writeHead(500, {"Content-Type": "text/plain"});
        response.write(error + "\n");
        response.end();
    });
    
    s.on('data', function(data) {
        if (firstChunk) {
            if(fType === "" || fType === null) {
                response.writeHead(200);
            } else {
                response.writeHead(200, {"Content-Type": fType});
            } 
            firstChunk=false;
        }
        response.write(data);
    });
    
    s.on('end', function() {
        response.end();
    });
}

start();
n.b. This is a splice I've just lifted out of a more complex app, I've just posted it without testing (on the wrong pute atm) but reading it it looks like it should work :mrgreen:
If I've messed up I'll fix it tomorrow. Ahh, life on the edge... :)
Leonhardt
Posts: 20
Joined: Wed Feb 26, 2014 9:41 am

Re: How to start?

Post by Leonhardt »

the.weavster wrote:
Leonhardt wrote:but when I run it in SB editor,it runs,so what did SB compiler do ?run a web server?
Yes, the IDE runs a little server.

SpiderBasic's install now includes nodejs (SpiderBasic\Android\nodejs\node.exe) which is a runtime that makes creating servers very simple. To run a simple http server use node.exe to run the script below, just edit the root_dir variable to point to the folder containing your project.

Code: Select all

// simple_server.js

// edit these to suit
var root_dir = "C:\\www";
var port = 9000;

// server requires
var fs = require("fs");
var http = require("http");
var path = require("path");
var querystring = require("querystring");
var url = require("url");

// mime types for web server - add as necessary
var mimeTypes = {};
mimeTypes[".pdf"]      = "application/pdf";
mimeTypes[".sig"]      = "application/pgp-signature";
mimeTypes[".spl"]      = "application/futuresplash";
mimeTypes[".ps"]       = "application/postscript";
mimeTypes[".torrent"]  = "application/x-bittorrent";
mimeTypes[".dvi"]      = "application/x-dvi";
mimeTypes[".gz"]       = "application/x-gzip";
mimeTypes[".pac"]      = "application/x-ns-proxy-autoconfig";
mimeTypes[".swf"]      = "application/x-shockwave-flash";
mimeTypes[".gz"]       = "application/x-tgz";
mimeTypes[".tgz"]      = "application/x-tgz";
mimeTypes[".tar"]      = "application/x-tar";
mimeTypes[".zip"]      = "application/zip";
mimeTypes[".mp3"]      = "audio/mpeg";
mimeTypes[".m3u"]      = "audio/x-mpegurl";
mimeTypes[".wma"]      = "audio/x-ms-wma";
mimeTypes[".wax"]      = "audio/x-ms-wax";
mimeTypes[".ogg"]      = "application/ogg";
mimeTypes[".wav"]      = "audio/x-wav";
mimeTypes[".gif"]      = "image/gif";
mimeTypes[".jpg"]      = "image/jpeg";
mimeTypes[".jpeg"]     = "image/jpeg";
mimeTypes[".png"]      = "image/png";
mimeTypes[".xbm"]      = "image/x-xbitmap";
mimeTypes[".xpm"]      = "image/x-xpixmap";
mimeTypes[".xwd"]      = "image/x-xwindowdump";
mimeTypes[".css"]      = "text/css";
mimeTypes[".html"]     = "text/html";
mimeTypes[".htm"]      = "text/html";
mimeTypes[".js"]       = "text/javascript";
mimeTypes[".asc"]      = "text/plain";
mimeTypes[".c"]        = "text/plain";
mimeTypes[".cpp"]      = "text/plain";
mimeTypes[".log"]      = "text/plain";
mimeTypes[".conf"]     = "text/plain";
mimeTypes[".text"]     = "text/plain";
mimeTypes[".txt"]      = "text/plain";
mimeTypes[".dtd"]      = "text/xml";
mimeTypes[".xml"]      = "text/xml";
mimeTypes[".mpeg"]     = "video/mpeg";
mimeTypes[".mpg"]      = "video/mpeg";
mimeTypes[".mov"]      = "video/quicktime";
mimeTypes[".qt"]       = "video/quicktime";
mimeTypes[".avi"]      = "video/x-msvideo";
mimeTypes[".asf"]      = "video/x-ms-asf";
mimeTypes[".asx"]      = "video/x-ms-asf";
mimeTypes[".wmv"]      = "video/x-ms-wmv";
mimeTypes[".bz2"]      = "application/x-bzip";
mimeTypes[".tbz"]      = "application/x-bzip-compressed-tar";

function start() {  
    function onRequest(request, response){
        var pathname = url.parse(request.url).pathname;
        var postData = "";
        request.setEncoding('utf8');
        
        // this is how to get the data for a POST request - we don't handle them here though :-)
        function onReceivedData(postDataChunk) {
            postData += postDataChunk;
        }
        request.addListener('data',onReceivedData);
        
        function onEndData() {
            if(request.method.toLowerCase() == 'get') { // it's a GET request
                streamFile(response, pathname);
            } else { // this simple server only does get
                response.writeHead(500, {"Content-Type": "text/plain"});
                response.write("Error - we only do GET requests");
                response.end();
            }
        }
        request.addListener('end',onEndData);
    }

    http.createServer(onRequest).listen(port,'localhost');
    console.log('server listening on port ' + port);
}

function streamFile(response, pathname) {
    var filename = path.join(root_dir,pathname);
    var fxt = path.extname(pathname);
    var fType = mimeTypes[fxt];
    
    var fileOK = true;
    try {
        fs.access(filename,fs.R_OK,function(err) {
            if(err) { fileOK = false; }
        });
    } catch(e) {
        console.log(e);
        fileOK = false;
    }
    if(!fileOK) {
        response.writeHead(404, {"Content-Type": "text/plain"});
        response.write("404 Not Found\n");
        response.end();
        return;
    }
    
    var firstChunk = true;
    var s = fs.createReadStream(filename, {'bufferSize': 256 * 1024});
    
    s.on('error', function(error) {
        response.writeHead(500, {"Content-Type": "text/plain"});
        response.write(error + "\n");
        response.end();
    });
    
    s.on('data', function(data) {
        if (firstChunk) {
            if(fType === "" || fType === null) {
                response.writeHead(200);
            } else {
                response.writeHead(200, {"Content-Type": fType});
            } 
            firstChunk=false;
        }
        response.write(data);
    });
    
    s.on('end', function() {
        response.end();
    });
}

start();
n.b. This is a splice I've just lifted out of a more complex app, I've just posted it without testing (on the wrong pute atm) but reading it it looks like it should work :mrgreen:
If I've messed up I'll fix it tomorrow. Ahh, life on the edge... :)
thanks very much :D
Leonhardt
Posts: 20
Joined: Wed Feb 26, 2014 9:41 am

Re: How to start?

Post by Leonhardt »

Bradan wrote:
Leonhardt wrote:
Bradan wrote:Hmm it should start a local webserver, but it seems in your situation it is just opening the file. This cannot work. You could use a minimal webserver (like python3 -m http.server or such) and open it there. Then it should work.
but when I run it in SB editor,it runs,so what did SB compiler do ?run a web server?How should I do or config something without SB running? I am web app newbie,sorry about this basic question.
BTW,there is a demo in PB examples called Atomic Web Server, how should I play with it?
It should work with the atomic web server I think, but I have no time to explain it in detail. If I remember correctly the atomic web server hosts all files in a specific directory. Put your files there and start the server. Then go into your webbrowser and open the address "http://127.0.0.1/yourfile.html" where yourfile.html is the filename of your html file you'd like to open.
yes ,the project runs well while the atomic web server is running。I am now searching and learning some basis of web app deployment,thank you :P
Post Reply