I had basic SignalR functionality implemented and working in my MVC5/AngularJS application recently, but after shelfing and unshelfing the changes I am now getting an error when the connection is negotiated in $.connection.hub.start().
I've stripped down the code to the very basics, but still get this error. Poking around in the jquery.signalR-2.2.0.js where the negotiate request is made, I found that the result returned from the ajax request to http://localhost:44379/signalr/negotiate?clientProtocol=1.5&connectionData=[] is returning the HTML of the page instead of JSON data!
connection._.negotiateRequest = /* This is on line 659 */ signalR.transports._logic.ajax(connection, {
url: url, // http://localhost:44379/signalr/negotiate?clientProtocol=1.5&connectionData=%5B%5D
error: function (error, statusText) {
// Irrelevant code removed.
},
success: function (result) { // We get here at least...
var res,
keepAliveData,
protocolError,
transports = [],
supportedTransports = [];
try {
res = connection._parseResponse(result); // This fails because result contains HTML.
} catch (error) {
// error.message is "Unexpected token <"
onFailed(signalR._.error(resources.errorParsingNegotiateResponse, error), connection);
return;
}
Here is my javascript for establishing the hub/connection:
$(function () {
var hub = $.connection.testHub;
if (hub)
console.log("SignalR hub initialized.");
$.connection.hub.start().done(function () {
console.log("SignalR connection established.");
}).fail(function (err) {
console.log("Error starting SignalR connection: " + err); // Ends up here.
});
});
And the script references (I have the signalr code in a separate js file named messaging.js):
<script src="~/assets/js/signalr/jquery.signalR-2.2.0.js"></script>
<script src="~/Scripts/messaging/messaging.js"></script>
<script src="~/signalr/hubs"></script>
I don't really understand why the ajax response from signalr/negotiate would be returning HTML instead of JSON. I've stripped down the server side hub code to an empty class with [AllowAnonymous] to ensure nothing in there was causing the problem. I have the app.MapSignalR() call in Startup.cs in place. My first thought, since this occurred after shelfing and unshelfing, was that something didn't make it into the shelf and was lost, but I can't seem to find anything missing...
Anyone have any ideas?
I found the problem while playing with the rules in web.config.
Previously, I had this rule for signalr:
<add input="{REQUEST_URI}" matchType="Pattern" pattern="/signalr/hubs" negate="true" />
Changing the pattern allowed communication with /signalr/negotiate, I think:
<add input="{REQUEST_URI}" matchType="Pattern" pattern="^/(signalr)" negate="true"/>
...I have no idea how this worked before.
Related
This is my first webRTC project so I'm very inexperienced in tracing these sorts of errors. Especially since I'm using this NPM package, I don't know exactly what to do with this error message. If you follow that link, I've just copy/pasted the "usage" demo code but replaced some of it with sockets using Laravel echo to transfer the peer-to-peer connection data. In the "usage" demo, they generate an "offer" object and have you paste it into the other peers form. Then that client generates an "answer" object and when you paste it into the form on the initiating client, the connection is made. If I do it that way, everything works fine. But I'm trying to establish an auto-connection when all the clients are ready. Here is my code:
var Peer = require("simple-peer");
window.p = new Peer({
initiator: location.hash === "#1",
trickle: false
});
p.on("error", err => console.log("error", err));
p.on("signal", data => {
if (location.hash === "#1") {
$.ajax({
url: "/autoCon",
type: "get",
data: {
connectionData: JSON.stringify(data)
},
success: function() {
console.log("sent: " + JSON.stringify(data));
}
});
}
});
p.on("connect", () => {
console.log("CONNECT");
});
And then on the blade file, I'm listening with Echo like this:
Echo.channel('myChannel')
.listen('MyEvent', (e) => {
p.signal(e.connectionData)
});
And now for the error:
Failed to execute 'setRemoteDescription' on 'RTCPeerConnection': Failed to set remote offer sdp: Failed to apply the description for 0: Failed to setup RTCP mux.
If I console log p.signal(e.connectionData), it shows "undefined", which is strange because it's generating the "answer" object and displaying to the page in text. So what I've tried to do is ajax send the initial "offer" object to the second peer, then take its "answer" object and signal for the initiating peer to connect when the data is received by socket. But it's giving me that error. Can anyone help?
I ended up figuring this out. This is my final code. It might be messy but it took me like 6 hours into the night and it made my brain hurt XD . If anyone can offer some advice on how to clean it up, I'll gladly take it but this works as is.
in app.js:
p.on("signal", data => {
//document.querySelector("#outgoing").textContent = JSON.stringify(data);
$.ajax({
url: "/autoCon",
type: "get",
data: {
conData: JSON.stringify(data)
}
});
});
And in my blade file using Echo:
var signalData = []
Echo.channel('myChannel')
.listen('MyEvent', (e) => {
signalData.push(e.conData)
if(e.conData.includes('offer') && location.hash !== '#1'){
console.log('received offer')
p.signal(JSON.parse(e.conData))
} else {
if(e.conData.includes('answer') && location.hash === '#1' ){
console.log('received answer')
p.signal(JSON.parse(signalData[1]))
}
}
});
I'm trying to use a simple post request on a route on top of a mongo DB.
my js file (I combined the router with the app) looks like:
var express = require('express');
var app = express();
var router = express.Router();
app.use(express.static('public'));
MongoClient = require('mongodb').MongoClient,
Server = require('mongodb').Server;
var url = 'mongodb://localhost:27017/test';
MongoClient.connect(url, function (err, db) {
if (err) {
console.log('Unable to connect to the mongoDB server. Error:', err);
} else {
console.log('Connection established to', url);
//Close connection
//db.close();
}});
router.post('/', function(req, res){
res.send('Got a POST request');
});
app.listen(27017,function(){
console.log("Server started successfully at Port 27017!");
});
on my html file I simple have a section like this (yes, my post request doesn't do much for now):
$.ajax({
method: "POST",
url: "localhost:27017/test/",
});
I can't seem to get it to work, my console keeps throwing: "[Error] Failed to load resource: unsupported URL (localhost:27017/test/, line 0)"
at me, and when I try to browse directly to the url via my browser I'm getting a "Cannot GET /test/" message.
What am I doing wrong?
Sharing what worked for me in the end:
1. Changed the app to listen to 3000 (or any other port that my DB server wasn't listening to). Thanks TomG.
2.changed router.post to app.post (you can use expressing routing but I had a mistake there).
I'm comfortable working with $.ajax and also in using cache.manifest. Recently I decided to start using "get" instead of "post" to help see the parameters easier.
In this proof-of-concept, if I delete the cache.manifest from the server, everything works. But when I put the cache.manifest on the server, the page stops working with an undefined jqXHR.responseText.
Furthermore, if I change the get to a post, it works with the cache.manifest.
Q: Does an https require a post, making "get" invalid if you are using a cache manifest? It seems to be working if the cache manifest is missing and it works with the cache manifest if I use post.
var local = {}
local.type = 'get'
local.dataType = 'text'
local.data = {}
local.data.CtrlName = 'testing123'
var promise = $.ajax('where_ctrlName.cfm',local)
promise.done(done)
promise.fail(fail)
function done(response) {
console.log(response)
}
function fail(jqXHR, textStatus, errorThrown) {
debugger
}
window.applicationCache.addEventListener('updateready', updateReady, false)
function updateReady() {
if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
$('body').html('<h1>Updating</h1>')
setTimeout(reloadCache,1000)
}
}
function reloadCache() {
window.location.reload()
}
<html manifest="cache.manifest">
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</body>
</html>
Here's my cache.manifest:
CACHE MANIFEST
https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js
For What It's Worth, this is an https call.
Error: The connection to <websocket> was interrupted while the page was loading.
Source File: localhost/socket.io/node_modules/socket.io-client/dist/socket.io.js
Line: 2371
I am new to socket.io and I have tried to search for this, but I didn't get an answer.
Websocket is interrupted when I refresh page on Firefox. That's why server side is waiting to authorise client.
Here is code:
server.js
var app = require('http').createServer(handler),
io = require('socket.io').listen(app),
fs = require('fs')
app.listen(8080);
function handler(req, res) {
fs.readFile(__dirname + '/index.html',
function (err, data) {
if (err) {
res.writeHead(500);
return res.end('Error loading index.html');
}
res.writeHead(200);
res.end(data);
});
}
io.sockets.on('connection', function (socket) {
socket.emit('news', {
hello: 'world'
});
socket.on('my other event', function (data) {
//alert(JSON.stringify(data));
console.log(data);
});
});
index.html
<script src="node_modules/socket.io-client/dist/socket.io.js"></script>
<script>
var socket = io.connect('http://localhost:8080');
socket.on('news', function (data) {
alert(JSON.stringify(data));
console.log(data);
socket.emit('my next event', { my: 'data' });
});
</script>
It happens because, you are not closing your open websocket.
This code would remove this error:
$(window).on('beforeunload', function(){
socket.close();
});
This seems to be an open bug in Firefox (as of 2015-03-29):
https://bugzilla.mozilla.org/show_bug.cgi?id=712329
The workaround (for now) is to call close() on the websocket on beforeunload, as Alexander pointed out.
Update 2016-04: According to Bugzilla, this will be fixed in Firefox 48
I was just running through the Socket.IO tutorials and I ran into this exact problem. I tried the posted solutions but they didn't seem to work at all.
After some fiddling and some screaming and some rubber-ducking, I finally figured out what the issue was. The issue is that it's trying to connect to the socket before the socket variables have been properly initialized. Javascript boo boo #1.
If you will ammend your file to include jQuery and then wrap your functions like so:
<script src="/socket.io/socket.io.js"></script>
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script>
$(function(){
var socket = io.connect('http://localhost:8080');
socket.on('news', function (data) {
alert(JSON.stringify(data));
console.log(data);
socket.emit('my next event', { my: 'data' });
});
});
</script>
You will have much more success.
What impact does this have on your application? My guess is that it's just not great to see an error in the console.
The problem here is that you are seeing Firefox loggin this error and there's nothing you can do about it. It's not possible to capture this error with a try...catch block or via websocket.onerror/websocket.onclose.
See: How do I catch a WebSocket connection interruption?
Related:
Should WebSocket.onclose be triggered by user navigation or refresh?
Firefox - Race condition allows ghost WebSocket connections to live after tab closed
I've had this problem with our custom Undertow-based webserver for years -- my problem was that my server was not responding to the socket close message.
Based on a comment by Jan Wielemaker I checked my socket close handler code for AbstractReceiveListener.onFullCloseMessage and realized I had not called the super method. After adding super.close() the socket closes cleanly on the client and no error is emitted.
One solution is to put a timeout on the disconnect event.
setTimeout(() => {
$('#offlineModal').modal('show')
}, 5000)
I have a web application that must work with IE7 (yeah i know..) where the frontend is entirely made with ExtJS4, and theres a servlet used to download files. To download a file i send some parameters so i cant simply use location.href. it must be a POST.
So far it works, but when an exception is thrown in the servlet i dont know how to handle it to show the user some alert box or some message without redirecting to another page.
In my webapp im also using DWR and im aware of the openInDownload() function, but it triggers a security warning in IE.
So, (finally!) the question is
Using this code:
post = function (url, params) {
var tempForm=document.createElement("form");
tempForm.action=url;
tempForm.method="POST";
tempForm.style.display="none";
for(var x in params) {
// ...snip boring stuff to add params
}
document.body.appendChild(tempForm);
tempForm.submit();
return tempForm;
}
is it possible to stay in the same page after submitting ?
or with this other one:
Ext.Ajax.request({
url: './descargaArchivoNivs',
method: 'POST',
autoAbort: true,
params: {
nivs: jsonData
},
success: function(response){
// HERE!!
// i know this is wrong
document.write('data:text/plain,' + response.responseText );
/* this looked promising but a warning pops up
var newwindow = window.open();
newwindow.document.open();
newwindow.document.write('data:text/plain, ' + response.responseText );
newwindow.document.close();*/
},
failure: function(resp){
alert('There was an error');
}
});
is it possible to open the file download dialog // HERE!! with the response content??
or is there some other way to open the file download dialog on success, and on failure show a friendly message without losing the users input (the params of the POST) ?
(sorry if this post was too long)