-1

My p5js code is:

myFile = document.getElementById('file-input');

objUrl = URL.createObjectURL(myFile.files[0]);

uploadedImage =  loadImage(objUrl); 

image(uploadedImage,posX,posY,picWidth,picHeight);

How do I send this image object to Nodejs server to draw image to the client side.

HReynaud
  • 54
  • 1
  • 9
Adeeba
  • 67
  • 2
  • 7
  • Node is server sided. If the image is uploaded from the client, you can just display it at that moment, without sending it to node. – HReynaud May 17 '17 at 12:01
  • it is displaying on my side but i want to display it on client's side also.how this can be done? – Adeeba May 17 '17 at 12:10
  • You should explain what you are doing, globaly. As far as i understand, you are trying to get an image with node, and send it to the client? – HReynaud May 17 '17 at 12:16
  • @HReynaud i m getting a image from 'File-input', and it is displaying on my browser, I want this image is also shown on other browser which is connected by node server with my browser. – Adeeba May 17 '17 at 12:38
  • So you want to get an image on a client, upload it on your node server, and send it to other cients, right? The good solution for me seems to be socket io, it will let you send objetcs really easly, so you'll be able to send the image to the node server from your client, and then, from node, send the image to the other connected clients. clients and node are connected through socket io – HReynaud May 17 '17 at 12:42
  • image(uploadedImage,pos_x_clicked,pos_y_clicked,picWidth,picHeight);By this function ,i am not able to draw image on client side.i am using socket.io for sending image. – Adeeba May 17 '17 at 12:50
  • post your code plz. – HReynaud May 17 '17 at 12:52
  • socket.on('emitImgMsg',newImgDrawing); function newImgDrawing(draw_img){image(draw_img[3],draw_img[1].x,draw_img[1].y,draw_img[2].width,draw_img[2].height);} – Adeeba May 17 '17 at 12:58
  • If you want help you need to make an effort explaining what you want to do, when i ask your code, i mean : edit your post, so i can see the different part of it and try to figure out what you don't understand – HReynaud May 17 '17 at 13:04

2 Answers2

-1

You can pass data in common POST request easily using Express.js server-side or set WebSocket server (socket.io).

Community
  • 1
  • 1
Reski
  • 169
  • 7
-1

The best way to send the image in real time, would be using socket.io. It's a websocket module, working with all browsers. It means that the clients and the server are connected and can send information to each other in real-time.

here is the documentation with simple examples : https://socket.io/docs/

Be carefull to send the library to the client as well, so he can send and receive events from socket.io

You'll be able to send an image from a client to the server, then send it from the server to the other connected client(s) with a broadcast or selecting a unique client.

HReynaud
  • 54
  • 1
  • 9