Skip to content

Instantly share code, notes, and snippets.

@thecopy
Last active January 28, 2021 01:35
Show Gist options
  • Save thecopy/5874375 to your computer and use it in GitHub Desktop.
Save thecopy/5874375 to your computer and use it in GitHub Desktop.
Quick way to test SignalR Hubs: http://i.imgur.com/aWnUrln.png
<html>
<head>
<title>SignalMan</title>
<script src="/Scripts/jquery-1.6.4.min.js"></script>
<script src="/Scripts/jquery.signalR-1.1.2.js"></script>
<script type="text/javascript">
window.signalman = { connected: false, hub: null, argumentCount: 0 };
$(function() {
$('#connect').click(function() {
$('#connect').prop('value', 'Connecting...');
$.getScript($("#url").val() + '/hubs', function() {
$('#url').prop('disabled', true);
$('#hubname').prop('disabled', true);
$('#connect').prop('disabled', true);
$.connection.hub.url = $("#url").val();
$.connection.hub.start({ jsonp: true }).done(function() {
$('#connect').prop('value', 'Connected!');
$("#methodname").prop('disabled', false);
$(".argumentInputBox").prop('disabled', false);
$("#sendInvocation").prop('disabled', false);
$("#hubname").prop('disabled', false);
var count = 0;
for (var h in $.connection) {
console.log(h);
count++;
if (count > 10)
$("#hubname").append($('<option>', {
value: h,
text: h
}));
}
fillMethods();
});
});
});
var fillMethods = function() {
$("#methodname").html('');
var hub = $("#hubname").val();
window.signalman.hub = $.connection[hub];
for (var m in window.signalman.hub.server) {
console.log(m);
$("#methodname").append($('<option>', {
value: m,
'data-arg-num': m.length,
text: m
}));
}
};
$("#hubname").change(function() { fillMethods(); });
// Focus Hub Name Input
$('#connect').focus();
$("#sendInvocation").click(function() {
$("#sendInvocation").prop('disabled', true);
$('#sendInvocation').prop('value', 'Sending...');
var methodName = $('#methodname').val();
var args = [];
$('#arguments input').each(function() {
var type = $(this).attr("type");
if (type == "text")
args.push($(this).val());
});
console.log(args);
window.signalman.hub.server[methodName].apply(this, args).done(function(result) {
$("#sendInvocation").prop('disabled', false);
$('#sendInvocation').prop('value', 'Send');
console.log('Invocation of "' + methodName + '" succeeded');
console.log(result);
$("#response").text(JSON.stringify(result, null, 4));
}).fail(function(error) {
$("#sendInvocation").prop('disabled', false);
$('#sendInvocation').prop('value', 'Send');
console.log(error);
$("#response").html('<span style="color:red">Invocation of "' + methodName + '" failed. Error: ' + error + '</span>');
});
});
});
addArgument = function() {
window.signalman.argumentCount++;
$("#arguments").append(
'<tr id="argumentRow'
+ window.signalman.argumentCount + '"><td>Argument:</td><td><input type="text" name="key'
+ window.signalman.argumentCount + '" class="argumentInputBox"/></td><td><input type="button" value="Delete" onclick=" deleteArgument('
+ window.signalman.argumentCount + ') "/></td></tr>');
};
deleteArgument = function(count) {
$("#argumentRow" + count).remove();
};
</script>
</head>
<body>
<h1>SignalMan</h1>
<h3>Server</h3>
<table>
<tr>
<td>Url: </td>
<td><input type="text" id="url" size="60" value="https://mlse1300:8001/signalr"/></td>
</tr>
</table>
<input type="button" id="connect" value="Connect"/>
<hr>
<h3>Hub</h3>
<form id="invokeForm">
<table>
<tr>
<td>Hub:</td>
<td><select disabled id="hubname" name="hub"/></td>
</tr>
<tbody>
<tr>
<td>Method Name</td>
<td><select disabled id="methodname" name="method" /></td>
</tr>
</tbody>
<tr>
<td><h4>Arguments </h4></td>
<td><a href="#" onclick=" javascript:addArgument(); " id="addArgument">Add...</a></td>
</tr>
<tbody id="arguments">
</tbody>
</table>
<input type="button" id="sendInvocation" disabled value="Send"/>
</form>
<hr>
<h3>Response</h3>
<pre id="response">
</pre>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment