Socketio wont run, getting io.connection not a function - socket.io

Using this code on the client side:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
<script src="http://cdn.socket.io/stable/socket.io.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var socket = io.connect('http://localhost:8888');
});
</script>
Getting this error:
"io.connect is not a function"
Any suggestions?

The answer was I had to use my external ip address for the server this script is running on.

The biggest problem is that http://cdn.socket.io/stable/socket.io.js is code for Socket.IO 0.6 and you are using the Socket.IO 0.7+ API.
The CDN has been deprecated and should no longer be used. Here is a wiki about how to serve the socket.io client in your HTML pages: https://github.com/LearnBoost/Socket.IO/wiki/How-do-I-serve-the-client

Related

Call express (node.js) APIs from static HTML page on host

I have a static HTML page, hello.html. If I double click hello.html, it opens up in my default browser, and displays the HTML properly, but in the browser's search bar, instead of having a URL with a hostname, what displays is the local filepath for hello.html on my computer.
I have made a simple express web server on my computer, using express (node.js). It is set to listen on port 8080, and has a simple GET api. (The API right now does something simple like call 'ls'). I wanted to be able to call that GET API, from my static hello.html. In my static HTML page, I use jquery to make an ajax call to this api, calling it as http://127.0.0.1:8080/myapi. Once I start the express server and load the page, looking at the console logs, the requests to myapi are going through when I load the static HTML page in the browser (the ls response is getting logged on the console), however, the jquery ajax in the HTML page, always executes the error function, even when I'm setting the response as 200.
I was reading a lot about why this happens, and read it could be due to CORS issue. However, there is no hostname I can specify on the server side, to allow in this case, since there is not actually a web server running, and so there is no actual host name associated with my static HTML page.
Is this even possible to do? (To have a static HTML page on your computer with no web server running, make your own express server with APIs, and call those APIs from the static web page?)
Example:
hello.html
<html>
<head>
<title>Hello World</title>
</head>
<body>
<script src"js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
type: "GET",
url: "http://127.0.0.1:8080/myapi",
contentType: 'application/json',
success: function(response) {
alert("success!");
},
error: function(jqXHR, textStatus, errorThrown) {
alert("error");
},
});
});
</script>
<p>Hello World!</p>
</body>
</html>
myserver.js:
var express = require('express');
var shelljs = require('shelljs');
var app = express();
app.get('/myapi', function (req, res) {
shellStr = shelljs.exec('ls');
if ( shellStr ) {
console.log("successful call on server side");
res.status(200);
res.json({ ls: shellStr });
}
else {
console.log("failure status on server side");
res.status(500).json({ error: "Could not do ls"});
}
})
var server = app.listen(8080, function() {
console.log("Listening on 8080");
})
I am starting up the server by giving 'node myserver.js', and then I open the static HTML page in the browser. When it loads, the API call is being made, as I see the server side console output, and it's going as success. However, back in the static html, the ajax call's 'error' function is always executed.
I got it to work!
In case anyone else ever wonders, and is new to express and web servers like myself.
The key was to have express serve hello.html as well. It is simple to do this.
I had my express server in a directory like this:
myserver/myserver.js <-- this is my express server
I moved all of my static html files, in to a directory at the same level.
myserver/htmlfiles/ <-- this directory has 'hello.html'.
Now, in myserver.js, I added the following line near the top, just after var app = express():
app.use(express.static('myhtml'))
What this does, is it will tell express to serve any static files in the directory myhtml (will search for that directory, relative to where the myserver.js is.)
If I restart the express server (kill the current one then just run 'node myserver.js' again), and go to the browser, if I visit http://127.0.0.1:8080/hello.html - the page shows up!
Now the domain origin is the same, and when the ajax call is made to the api, it is successful in the browser, too!
(Note - I did have an issue at first after these changes, because my ajax URL in hello.html was calling http://localhost:8080/myapi, but I was displaying hello.html in the browser via http://127.0.0.1:8080/hello.html. Once I changed the ajax URL being called to http://127.0.0.1:8080/myapi - everything worked. Similarly, if I open the browser and go to http://localhost:8080/hello.html and display hello.html that way, if the ajax URL being called is http://127.0.0.1:8080/myapi - the ajax call will go in to the 'error' function. It seems that the hostname you are using in the ajax URL in the HTML page, must be the same (127.0.0.01 vs. localhost) as the hostname you are using to visit the html page in the browser when the call is made.)

Google Storage Ajax load Json File not working

I am using ajax in html to load Json files to that the data will be refreshed every 5 seconds.
When I test it on my local host, everything works great. However, when I upload to google cloud Storage, it gives me some error shown as
Failed to load resource: the server responded with a status of 404 ()
GET https://00e9e64bac97921ce699e88ff28fbd14910d2de64676b68d82-apidata.googleus…/storage/v1/b/../o/TableGenerationData.json 400 ()
I put the json file in the same folder with the html, and my code is sure working,
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script>
<script type="text/javascript">
function refreshData()
{
var tt = $.ajax({
url: "TableGenerationData.json",
dataType: "json",
async: false
});
var jsonData = tt.responseJSON;
}
</script>
I couldn't get it working in google storage, does anyone have any idea?
Thank you very much.
Finally figured it out.
To make it work, I need to open the public link of the html file, and set the json file to be 'no-cache' to make sure new uploaded data will be immediately fetched by the html.
Thank you very much, welcome to make comment and share your idea if I am wrong.

ajax request getting redirected to /system/sling/cqform/defaultlogin.html

Im making an ajax call from cq to a webservice, however the ajax call returns the below response
<html>
<head>
<script type="text/javascript">
var u="/system/sling/cqform/defaultlogin.html?resource=%2Ferror%2F500.html&$$login$$=%24%24login%24%24";
if ( window.location.hash) {u = u + window.location.hash;}
document.location = u;
</script>
</head>
<body>
<!-- QUICKSTART_HOMEPAGE - (string used for readyness detection, do not remove) -->
</body>
</html>
May I know what exactly the above response means?
Note: cookies and necessary headers are set to the ajax request for making the call to the webservice.
Also this ajax call is working fine in all the other cq environments,it is having the above issue in only one environment.
Thanks,
Balaji.
The link in script points to login form. So I think, that service can be accessed only by logged-in/some CUG users.
UPD1
To find reason, you should check permissions of your user, also Dispatcher configuration can be a problem there.

Skype Button with HTTPS website

If I display my website with HTTP everything is fine. But when I browse with HTTPS, Skype button is not rendered.
Chrome shows this error on console:
Failed to load resource: net::ERR_INSECURE_RESPONSE
https://www.skypeassets.com/i/scom/js/skype-uri.js
And my code is:
<script type="text/javascript" src="//www.skypeassets.com/i/scom/js/skype-uri.js"></script>
<div id="SkypeButton_Call_gamirasu.cave.hotel_1" style="float: right; width:85px !important; height:23px !important; margin-top:-65px;">
<script type="text/javascript">
Skype.ui({
"name": " ",
"element": "SkypeButton_Call_gamirasu.cave.hotel_1",
"participants": ["gamirasu.cave.hotel"],
"imageSize": 24
});
</script>
I couldn't find anything about using Skype with SSL on their document. Any help will be appreciated.
You need to use this specific secured (HTTPS) domain for Skype widgets:
https://secure.skypeassets.com/i/scom/js/skype-uri.js
Have you tried visiting the URL you provided ? When I try using Chrome, I get to an SSL warning, which is the explanation why you can't load this ressource.

Socket.io client served from CDN

According to the Socket.io documentation:
A standalone build of socket.io-client is exposed automatically by the socket.io server as /socket.io/socket.io.js. Alternatively you can serve the file socket.io-client.js found at the root of this repository.
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io('http://localhost');
socket.on('connect', function(){
socket.on('event', function(data){});
socket.on('disconnect', function(){});
});
</script>
However, I would like to serve the socket.io client from a separate CDN (it's cheaper, faster, and reduces load on my server).
How can I do this? Do I have to disable the socket.io default?
As long as the version of the client you are using is the same as what you use on your server, there should not be any problem serving it from a CDN.
That said, the client is tiny (24kb), and if caching is setup properly, this should have very little impact on your server.
update: as mentioned by #maxwell2022, socket.io has its own cdn starting with 1.0.0, so you can use:
<script src="https://cdn.socket.io/socket.io-1.0.0.js"></script>
You can find here CDN links to the socket.io client script files.
0.9.16
//cdnjs.cloudflare.com/ajax/libs/socket.io/0.9.16/socket.io.min.js
0.9.6
//cdnjs.cloudflare.com/ajax/libs/socket.io/0.9.6/socket.io.min.js
...and so on.
According to the wiki, if you choose to serve the client yourself, you can clone the socket.io-client repository and look at the dist/ subdirectory. There are 4 files to serve (this may change):
WebSocketMain.swf
WebSocketMainInsecure.swf
socket.io.js
socket.io.min.js
Just make sure you update these files whenever you update the server.

Resources