WEBSOCKETS: client does not revice the messages I send from server - java

I will try to explain my problem without attaching any code, I think that that is not needed.
Okay, I have a websocket client in JS that connects to my java server. The handshake is done, connected handler is called on the client, so I send a message to server, wich is readed. Then the message is reversed and sended back to the client, but the client messagerecived handler or any other handler are not called.
This is the message that I send to the client:
b[0]=-127;//Its the same of 129?
b[1]=1;
b[2]=18;//any char..
I think that the problem must be on the first byte. I write "b[0] = (byte)129;" but when I read it it returns -127, maybe because, ¿the byte 129 have to be unsigned?
Thanks for help :P
The requested client code:
<html><head><meta charset="utf-8">
<title>WebSocket Test</title>
<script language="javascript" type="text/javascript">
var wsUri = "ws://localhost:10637/penise";
var output;
function init()
{
output = document.getElementById("output");
testWebSocket();
}
function testWebSocket()
{
websocket = new WebSocket(wsUri);
websocket.onopen = function(evt) { onOpen(evt) };
websocket.onclose = function(evt) { onClose(evt) };
websocket.onmessage = function(evt) { onMessage(evt) };
websocket.onerror = function(evt) { onError(evt) };
}
function onOpen(evt)
{
writeToScreen("CONNECTED");
var msg = String.fromCharCode(1)+ String.fromCharCode(0)+"This is niceeee"
doSend(msg);
}
function onClose(evt)
{
writeToScreen("DISCONNECTED");
}
function onMessage(evt)
{
writeToScreen('<span style="color: blue;">RESPONSE: ' + evt.data+'</span>');
websocket.close();
}
function onError(evt)
{
writeToScreen('<span style="color: red;">ERROR:</span> ' + evt.data);
}
function doSend(message)
{
writeToScreen("SENT: " + message);
websocket.send(message);
}
function writeToScreen(message)
{
var pre = document.createElement("p");
pre.style.wordWrap = "break-word";
pre.innerHTML = message;
output.appendChild(pre);
}
window.addEventListener("load", init, false);
function char(i) {
return String.fromCharCode(i);
}
</script>
</head><body><h2>WebSocket Test</h2>
<div id="output"><p style="word-wrap: break-word;">CONNECTED</p><p style="word-wrap: break-word;">SENT: This is niceeee</p><p style="word-wrap: break-word;"><span style="color: red;">ERROR:</span> undefined</p><p style="word-wrap: break-word;">DISCONNECTED</p></div>
</body></html>

I would recommend that you use a buffer of unsigned bytes to avoid confusion.
Your main problem is that the first byte indicates that the payload is UTF-8 text, but the single byte value in your payload is 180 which is not a valid UTF-8 character. If you are trying to send a binary value then you need to indicate that in the first byte by setting the opcode to 0x2 rather than 0x1 (e.g. 130 rather than 129).

OK, I have solved the problem. The problem was that, when i sent the header, I putted 2 "\r\n", instead of only one, so one of the \r\n becomes part of the next frame and the connection is broken (because it becomes the opcode of the next frame).
Thanks you for trying to help me <3

Related

How to create Websocket Java SE client?

My problem is that not since a Websocket creates client in Java SE to be able to connect to the Websocket HTML5 server.
Ningun example I dress in Internet they me have worked.
Code in HTML5
<script type="text/javascript">
var mysocket = new WebSocket("ws://localhost:8080");
mysocket.onopen = function (evt){
escribir("Websocket abierto");
};
mysocket.onmessage = function (evt){
escribir("RECIBIDO: " + evt.data);
};
mysocket.onclose = function (evt){
escribir("Websocket cerrado");
};
mysocket.onerror = function (evt) {
escribir("ERROR: " + evt.data);
}
function escribir(texto){
valor = document.getElementById("caja").value;
document.getElementById("caja").value = valor + texto + "\n";
}
function enviar(texto) {
mysocket.send(texto);
escribir("ENVIADO: " + texto);
}
function desconectar(){
mysocket.close();
}
</script>
I have tried Jetty and it me has not worked.
Do you help me please?
In java there are some options, if you aren't interested in secure websocket server, then this link can help you. There are enough examples.
PD: You can try Jetty, using some dependencies needed for websocket.

HTTP Node.js Java API

I am creating a Node.js Java backend. The Node.js middleware receives HTTP requests from an Android application and then relays it to the Java code. The reason for choosing this technologies is to create a highly scalable backend from scratch.
I want the Node.js api to receive the HTTP requests, pass it to the Java-side of the backend, the Java code does its calculations, sends back the result to the Node.js API and then finishes the process by sending the result back to the Android application.
I can receive and parse HTTP requests:
var BodyParser = require('body-parser');
var Express = require('express');
var JavaClient = require('./NodeJavaBridge.js');
var JavaClientInstance = new JavaClient();
var app = Express();
///// Receive message logic \\\\\
app.use(BodyParser.json());
app.post('/', function (request, response)
{
var task = request.body;
response.writeHead(200, { 'content-type': 'text/plain' });
var otherObject = { SomeData: 1234 };
var json = JSON.stringify({
data: otherObject
});
response.end(json);
});
console.log("START --> Java Client Instance");
JavaClientInstance.run();
app.listen(8080); //to port on which the express server listen
console.log("Server listening on: " + 8080);
I can also send and receive data between Node.js and Java:
var Util = require('util');
var EventEmitter = require('events').EventEmitter;
var ChildProc = require('child_process');
var JavaClient = function () {
var _self = this;
// The child process object we get when we spawn the java process
var _javaSpawn = null;
// buffer for receiving messages in part and piecing them together later
var _receiveBuffer = null;
// The location of java and the - we're making these public because maybe
// we want to change them in the user of this module.
_self.javaPath = 'java';
_self.jarPath = 'C:/Dev/Backend_Java.jar';
_self.verbose = true;
// list of events emitted - for informational purposes
_self.events = [
'spawn', 'message', 'exception', 'unknown', 'sent', 'java_error',
// Response messages that then become events themselves
'Error', 'Hello', 'Info'
];
/**
* Attach our own event handler to reply to the hello message.
* This is just a convenience part of the protocol so that clients don't have to do it.
* Also connects if connection data was supplied.
*/
_self.on('Hello', function () {
_self.sendHello();
});
/**
* Executes the java process to begin sending and receiving communication
*/
_self.run = function () {
// Invoke the process
_javaSpawn = ChildProc.spawn(_self.javaPath, ['-jar', _self.jarPath]);
// Wire up events
_javaSpawn.stdout.on('data', onData);
_javaSpawn.stderr.on('data', onJavaError);
_javaSpawn.on('exit', function (code) {
console.log("The java program exited with code " + code + ".");
});
// Emit our own event to indicate to others that we have spawned
_self.emit('spawn', _javaSpawn);
}
// sends the hello request message
_self.sendHello = function () {
sendMessage(
{
messageName : 'Hello',
version : '1.1'
});
}
// sends a message that will be echoed back as an Info message
_self.sendEcho = function (message) {
sendMessage(
{
messageName : "Echo",
message : message
});
}
// sends a message telling the java app to exit
_self.sendGoodbye = function () {
sendMessage(
{
"messageName" : "Goodbye"
});
}
/**
* Sends a message object as a JSON encoded string to the java application for processing.
*/
function sendMessage(aMsg)
{
// convert to json and prepare buffer
var aJsonString = JSON.stringify(aMsg);
var lByteLength = Buffer.byteLength(aJsonString);
var lMsgBuffer = new Buffer(4 + lByteLength);
// Write 4-byte length, followed by json, to buffer
lMsgBuffer.writeUInt32BE(lByteLength, 0);
lMsgBuffer.write(aJsonString, 4, aJsonString.length, 'utf8');
// send buffer to standard input on the java application
_javaSpawn.stdin.write(lMsgBuffer);
_self.emit('sent', aMsg);
}
/**
* Receive data over standard input
*/
function onData(data)
{
// Attach or extend receive buffer
_receiveBuffer = (null == _receiveBuffer) ? data : Buffer.concat([_receiveBuffer, data]);
// Pop all messages until the buffer is exhausted
while (null != _receiveBuffer && _receiveBuffer.length > 3)
{
var size = _receiveBuffer.readInt32BE(0);
// Early exit processing if we don't have enough data yet
if ((size + 4) > _receiveBuffer.length)
{
break;
}
// Pull out the message
var json = _receiveBuffer.toString('utf8', 4, (size + 4));
// Resize the receive buffer
_receiveBuffer = ((size + 4) == _receiveBuffer.length) ? null : _receiveBuffer.slice((size + 4));
// Parse the message as a JSON object
try
{
var msgObj = JSON.parse(json);
// emit the generic message received event
_self.emit('message', msgObj);
// emit an object-type specific event
if ((typeof msgObj.messageName) == 'undefined')
{
_self.emit('unknown', msgObj);
}
else
{
_self.emit(msgObj.messageName, msgObj);
}
}
catch (ex)
{
_self.emit('exception', ex);
}
}
}
/**
* Receive error output from the java process
*/
function onJavaError(data)
{
_self.emit('java_error', data.toString());
}
}
// Make our JavaClient class an EventEmitter
Util.inherits(JavaClient, EventEmitter);
// export our class
module.exports = JavaClient;
My problem: How do I let the POST request send a request to my JavaClient instance, wait for a response and then send it back to origin (Android app).
Here is an example of how I am trying to get the logic working:
var client = require('./JavaClient');
var instance = new client();
instance.on('message', function(msg) {
console.log('Received a message...');
console.log(msg);
});
instance.on('sent', function(msg) {
console.log('Sent a message...');
console.log(msg);
});
instance.on('Info', function(msg) {
console.log("Received info");
console.log(msg.message);
});
(function() {
// Start it up (Hello exchanges happen)
instance.run();
// Receive acknowledgement of hello
instance.once('Info', function() {
// Try echoing something
instance.sendEcho("ECHO!");
});
})();
If I should make something more clear please let me know (it's really late and I assume that my writing capabilities is taking a dive). I would appreciate any answer/suggestion/thisisabadidea type of comments.
Thanks!
var Util = require('util');
var EventEmitter = require('events').EventEmitter;
var ChildProc = require('child_process');
var JavaClient = function () {
var _self = this;
// The child process object we get when we spawn the java process
var _javaSpawn = null;
// buffer for receiving messages in part and piecing them together later
var _receiveBuffer = null;
// The location of java and the - we're making these public because maybe
// we want to change them in the user of this module.
_self.javaPath = 'java';
_self.jarPath = 'C:/Dev/Backend_Java.jar';
_self.verbose = true;
// list of events emitted - for informational purposes
_self.events = [
'spawn', 'message', 'exception', 'unknown', 'sent', 'java_error',
// Response messages that then become events themselves
'Error', 'Hello', 'Info'
];
/**
* Attach our own event handler to reply to the hello message.
* This is just a convenience part of the protocol so that clients don't have to do it.
* Also connects if connection data was supplied.
*/
_self.on('Hello', function () {
_self.sendHello();
});
/**
* Executes the java process to begin sending and receiving communication
*/
_self.run = function () {
// Invoke the process
_javaSpawn = ChildProc.spawn(_self.javaPath, ['-jar', _self.jarPath]);
// Wire up events
_javaSpawn.stdout.on('data', onData);
_javaSpawn.stderr.on('data', onJavaError);
_javaSpawn.on('exit', function (code) {
console.log("The java program exited with code " + code + ".");
});
// Emit our own event to indicate to others that we have spawned
_self.emit('spawn', _javaSpawn);
}
// sends the hello request message
_self.sendHello = function () {
sendMessage(
{
messageName : 'Hello',
version : '1.1'
});
}
// sends a message that will be echoed back as an Info message
_self.sendEcho = function (message) {
sendMessage(
{
messageName : "Echo",
message : message
});
}
// sends a message telling the java app to exit
_self.sendGoodbye = function () {
sendMessage(
{
"messageName" : "Goodbye"
});
}
/**
* Sends a message object as a JSON encoded string to the java application for processing.
*/
function sendMessage(aMsg)
{
// convert to json and prepare buffer
var aJsonString = JSON.stringify(aMsg);
var lByteLength = Buffer.byteLength(aJsonString);
var lMsgBuffer = new Buffer(4 + lByteLength);
// Write 4-byte length, followed by json, to buffer
lMsgBuffer.writeUInt32BE(lByteLength, 0);
lMsgBuffer.write(aJsonString, 4, aJsonString.length, 'utf8');
// send buffer to standard input on the java application
_javaSpawn.stdin.write(lMsgBuffer);
_self.emit('sent', aMsg);
}
/**
* Receive data over standard input
*/
function onData(data)
{
// Attach or extend receive buffer
_receiveBuffer = (null == _receiveBuffer) ? data : Buffer.concat([_receiveBuffer, data]);
// Pop all messages until the buffer is exhausted
while (null != _receiveBuffer && _receiveBuffer.length > 3)
{
var size = _receiveBuffer.readInt32BE(0);
// Early exit processing if we don't have enough data yet
if ((size + 4) > _receiveBuffer.length)
{
break;
}
// Pull out the message
var json = _receiveBuffer.toString('utf8', 4, (size + 4));
// Resize the receive buffer
_receiveBuffer = ((size + 4) == _receiveBuffer.length) ? null : _receiveBuffer.slice((size + 4));
// Parse the message as a JSON object
try
{
var msgObj = JSON.parse(json);
// emit the generic message received event
_self.emit('message', msgObj);
// emit an object-type specific event
if ((typeof msgObj.messageName) == 'undefined')
{
_self.emit('unknown', msgObj);
}
else
{
_self.emit(msgObj.messageName, msgObj);
}
}
catch (ex)
{
_self.emit('exception', ex);
}
}
}
/**
* Receive error output from the java process
*/
function onJavaError(data)
{
_self.emit('java_error', data.toString());
}
}
// Make our JavaClient class an EventEmitter
Util.inherits(JavaClient, EventEmitter);
// export our class
module.exports = JavaClient;
var client = require('./JavaClient');
var instance = new client();
instance.on('message', function(msg) {
console.log('Received a message...');
console.log(msg);
});
instance.on('sent', function(msg) {
console.log('Sent a message...');
console.log(msg);
});
instance.on('Info', function(msg) {
console.log("Received info");
console.log(msg.message);
});
(function() {
// Start it up (Hello exchanges happen)
instance.run();
// Receive acknowledgement of hello
instance.once('Info', function() {
// Try echoing something
instance.sendEcho("ECHO!");
});
})();

Flow.js and Java Servlet upload file 0 bytes

I added flow.js in my proyect following the instructions and the call to my java servlet:
localhost:8080/WebExample/UploadImgServlet?flowChunkNumber=1&flowChunkSize=1048576&flowCurrentChunkSize=693916&flowTotalSize=693916&flowIdentifier=693916-image2png&flowFilename=image2.png&flowRelativePath=image2.png&flowTotalChunks=1`
In my servlet I get all parameters of the url (flowChuckNumber, flowChuckSize, etc) but when I try to get the file (request.getInputStream()), it's empty and upload 0 bytes.
Where is the problem? Any Idea?
I found a similar question but it was with PHP...
My code:
HTML(the image is displayed):
...
...
<div flow-init="{singleFile:true}"
flow-file-added="!!{png:1,gif:1,jpg:1,jpeg:1}[$file.getExtension()]"
flow-files-submitted="$flow.upload()"
flow-file-success="$file.msg = $message">
<div class="drop" flow-drop ng-class="dropClass">
<md-button class="md-raised md-primary" type="file" flow-btn>Upload Image</md-button>
<b>OR</b>
Drag And Drop your image here
</div>
<div class="thumbnail" ng-show="!$flow.files.length">
<img src="http://www.placehold.it/200x150/EFEFEF/AAAAAA&text=no+image" alt="Image"/>
</div>
<div class="thumbnail" ng-show="$flow.files.length">
<img flow-img="$flow.files[0]" />
</div>
<table>
<tr ng-repeat="file in $flow.files">
<td>{{$index+1}}</td>
<td>{{file.name}}</td>
<td>{{file.msg}}</td>
</tr>
</table>
</div>
...
...
App AngularJs:
var app = angular.module("webexample", ['ngMaterial', 'ngNotify','uiGmapgoogle-maps','flow'])
.config(['flowFactoryProvider', function (flowFactoryProvider) {
flowFactoryProvider.defaults = {
target: '/WebExample/UploadImgServlet',
permanentErrors: [404, 500, 501],
maxChunkRetries: 1,
chunkRetryInterval: 5000,
simultaneousUploads: 1
};
flowFactoryProvider.on('catchAll', function (event) {
console.log('catchAll', arguments);
});
// Can be used with different implementations of Flow.js
// flowFactoryProvider.factory = fustyFlowFactory;
}])
.directive('appDownloadUrl', [function () {
return {
restrict: 'A',
link: function(scope, element, attrs) {
element.bind('dragstart', function (event) {
var config = scope.$eval(attrs.appDownloadUrl);
if (!config.disabled) {
var data = config.mime + ':' + config.name + ':' + window.location.href + config.url;
console.log("data: "+data);
event.dataTransfer.setData('DownloadURL', data);
}
});
}
};
}])
.directive("appDragstart", [function () {
return function(scope, element, attrs) {
element.bind('dragstart', function (event) {
scope.$eval(attrs.appDragstart);
});
}
}]).directive("appDragend", [function () {
return function(scope, element, attrs) {
element.bind('dragend', function (event) {
scope.$eval(attrs.appDragend);
});
}
}]).run(function ($rootScope) {
$rootScope.dropEnabled = true;
});
My Servlet (I followed this example):
protected void doService(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException
{
LOGGER.debug("[UploadImgServlet - doService] - init");
int resumableChunkNumber = getResumableChunkNumber(request);
ResumableInfo info = getResumableInfo(request);
//info contains all flow parameters of the url.
RandomAccessFile raf = new RandomAccessFile(info.resumableFilePath, "rw");
//Seek to position
raf.seek((resumableChunkNumber - 1) * info.resumableChunkSize);
//Save to file
InputStream is = request.getInputStream();
long readed = 0;
long content_length = request.getContentLength();
//**PROBLEM: request.getContentLength return -1 so read 0 bytes**
byte[] bytes = new byte[1024 * 100];
while(readed < content_length) {
int r = is.read(bytes);
if (r < 0) {
break;
}
raf.write(bytes, 0, r);
readed += r;
}
raf.close();
...
...
The input stream will be empty because flowjs posts the content using MultiPart by default.
The author of the Java code specified that "Octet" should be used for uploads, not multi-part.
UploadServlet accepts Resumable.js Upload with 'octet'
You need to add "method:octet" to your init,
<div flow-init="{singleFile:true, method:octet}"
I am using Spring, so I just used MultipartHttpServletRequest to get the posted data with MultiPart instead because MultiPart is more common.
This is how I received the contents of the file:
Iterator<String> itr = request.getFileNames();
/* Iterate each file, there should only be one/one chunk */
while (itr.hasNext()) {
fileUploaded = request.getFile(itr.next());
raf.write(fileUploaded.getBytes());
}
raf.close();
I had to do more fixes to the java code provided because it was estimating the number of chunks to receive wrong, so I just used the "flowTotalChunks" parameter.
You don't need to worry about content length. The HttpServletRequest will terminate the input stream at the correct point. Just read until end of stream.
I wanted a lib to upload images with more options and visually appealing (drop file from a folder, thumbnail, etc) than the default html input and I have not been able to do with Flowjs and Java Servlet, so I looked for another lib:
https://github.com/danialfarid/ng-file-upload
https://angular-file-upload.appspot.com/
With this lib, I found it easy to use with Java Servlet.
I don't mark this post as solved for if someone finds a way to do it with Flowjs.

Unable to call a function with ENTER key

I need to pass in some values to my function
I want the function to run when I press ENTER KEY in PHP
the function is update()
This is my PHP
echo '<input type="text" size="23" id= n'.$row["ContactID"].'
class = "name" placeholder="Contact Name"
value="'.$row["Name"].'
onkeydown="if (event.keyCode == 13) updatename(this,'.$row["ContactID"].') ">';
my javascript
function updatename(item, cid)
{
var varname = $(item).val();
var originaltext = $(item).val();
$.ajax({
url: 'changeContact.php',
type: 'POST',
data:{
varname: varname
},
success:function (data) {
if (data == '1')
{
$("#status")
.addClass("success")
.html("Data saved successfully")
.fadeIn('fast')
.delay(3000)
.fadeOut('slow');
}
else
{
$("#status")
.addClass("error")
.html("An error occured, the data could not be saved")
.fadeIn('fast')
.delay(3000)
.fadeOut('slow');
}
}
});
}
Why does it don't seem to be working? Nothing have been send to my database, even I change to a simple alert, nothing appear
How can I improve it?
Probably because your HTML is invalid.
...
value="'.$row["Name"].' <--------- " is missing
onkeydown="if (eve...
<input type="text" id="your id" onkeypress="MAGIC(event);" />
function MAGIC(event){
$("#id").keyup(function(event){
if(event.keyCode == 13){
//your code to be executed
}
}

PHP & Java poll script displays same data multiple times after host has upgraded php to 5.4

I have been asked to fix a script on a webpage that has stopped working correctly since the webhost upgraded their supported version of php to 5.4, I have already tried downgrading the version via a htaccess file but without success.
The script basically uses a very simple database to store questions and log votes against them, it uses Java to actually display the questions and their answers and I think its this bit is causing the issues.
There are 5 questions in the database and the actual page itself shows the last question 5 times, which leads me to suspect that a variable is not being cleared somewhere.
Here are the scripts
$topPart = "";
$botPart = "";
$query = mysql_query("SELECT * FROM questions");
while ($row = mysql_fetch_assoc($query)) {
//display question
$topPart .= "pollNum=" . $row['id'] . ";\n";
$topPart .= "$('#loader'+pollNum).fadeIn();\n";
$topPart .= "$.get('poll.php', 'pollid='+pollNum, function(data, status){\n";
$topPart .= "loadpoll(data, status, '". $row['id'] ."')\n";
$topPart .= "});\n";
$botPart .= "<div id=\"pollcontainer" . $row['id'] . "\" class=\"question\" >". $topPart . "</div>\n";
$botPart .= "<p id='loader" . $row['id'] . "'>Loading...</p>";
I believe this bit is working ok since when examining the page the id's and classes are all numbered correctly, its the actual questions that repeat, the surrounding divs number correctly. This is the java... I know nothing about Java...
<script>
$(function(){
var pollNum;
<?php
echo $topPart;
?>
function loadpoll(data, status, pollNum){
//alert(pollNum);
var pollcontainer=$('#pollcontainer'+pollNum);
var loader=$('#loader'+pollNum);
pollcontainer.html(data);
animateResults(pollcontainer);
pollcontainer.find('#viewresult'+pollNum).click(function(){
//if user wants to see result
$('#formcontainer'+pollNum).fadeOut(100, function(){
loader.fadeIn();
$.get('poll.php', 'pollid='+pollNum+'&result=1', function(data,status){
loadpoll(data,status, pollNum);
});
});
//prevent default behavior
return false;
}).end()
pollcontainer.find('#viewvote'+pollNum).click(function(){
//if user wants to see result
$('#formcontainer'+pollNum).fadeOut(100, function(){
loader.fadeIn();
$.get('poll.php', 'pollid='+pollNum, function(data,status){
loadpoll(data,status, pollNum);
});
});
//prevent default behavior
return false;
}).end()
.find('#pollform'+pollNum).submit(function(){
var selected_val=$(this).find('input[name=poll]:checked').val();
if(selected_val!=''){
//post data only if a value is selected
loader.fadeIn();
$.post('poll.php', $(this).serialize(), function(data, status) {
$('#formcontainer'+pollNum).fadeOut(100, function(){
$(this).html(data);
animateResults(this);
loader.fadeOut();
});
});
}
//prevent form default behavior
return false;
});
loader.fadeOut();
}
function showresults(data, status, pollNum){
var pollcontainer=$('#pollcontainer'+pollNum);
var loader=$('#loader'+pollNum);
pollcontainer.fadeOut(1000, function(){
$(this).html(data);
animateResults(this);
pollcontainer.find('#viewvote'+pollNum).click(function(){
//if user wants to see result
loader.fadeIn();
$.get('poll.php', 'pollid'+pollNum, function(data,status){
pollcontainer.fadeOut(1000, function(){
$(this).html(data);
animateResults(pollcontainer);
});
loader.fadeOut();
});
//prevent default behavior
return false;
}).end()
});
loader.fadeOut();
}
function animateResults(data){
$(data).find('.bar').hide().end().fadeIn('slow', function(){
$(this).find('.bar').each(function(){
var bar_width=$(this).css('width');
$(this).css('width', '0').animate({ width: bar_width }, 1000);
});
});
}
});

Categories