Giter Site home page Giter Site logo

adzialocha / osc-js Goto Github PK

View Code? Open in Web Editor NEW
249.0 12.0 31.0 3.97 MB

OSC library for Node.js, Electron, Chrome Apps, Webpages or any other JS application. It comes with a customizable Plugin API for WebSocket, UDP or bridge networking

Home Page: https://adzialocha.github.io/osc-js

License: MIT License

JavaScript 100.00%
osc-js udp osc-applications javascript music websocket-client electron osc websockets

osc-js's Introduction

osc-js

Build status npm version npm licence ESDoc status

osc-js is an Open Sound Control library for JavaScript applications (UMD module for Node, Browser etc.) with address pattern matching and timetag handling. Sends messages via UDP, WebSocket or both (bridge mode) and offers a customizable Plugin API for network protocols.

Wiki | Basic Usage | Documentation | Plugin API

Features

  • UMD Module running in Node.js, Electron, Chrome Apps, browser or any other JS environment
  • Can be used with Webpack and Browserify
  • TypeScript definitions
  • No dependencies (except of ws in Node.js or similar environments)
  • Receive sender information from incoming messages
  • Built-in UDP, WebSocket networking support as plugins
  • Special bridge plugin for easy communication between UDP- and WebSocket clients
  • Plugin API for custom network protocols
  • Featuring all OSC 1.0 specifications
  • OSC Address pattern matching
  • Time-critical OSC Bundles with Timetags
  • Extended (nonstandard) argument types

Documentation

Read more about osc-js and how to use it in the Wiki and Documentation.

Example

const osc = new OSC()

osc.on('/param/density', (message, rinfo) => {
  console.log(message.args)
  console.log(rinfo)
})

osc.on('*', message => {
  console.log(message.args)
})

osc.on('/{foo,bar}/*/param', message => {
  console.log(message.args)
})

osc.on('open', () => {
  const message = new OSC.Message('/test', 12.221, 'hello')
  osc.send(message)
})

osc.open({ port: 9000 })

Installation and Usage

Recommended installation via npm: npm i osc-js or yarn add osc-js.

Import the library const OSC = require('osc-js') or add the script lib/osc.js or lib/osc.min.js (minified version) for usage in a browser.

Plugins

osc-js offers a plugin architecture for extending it's networking capabilities. The library comes with four built-in plugins. This is propably all you need for an OSC application:

  • WebsocketClientPlugin (default)
  • WebsocketServerPlugin
  • DatagramPlugin for UDP network messaging
  • BridgePlugin useful Bridge between WebSocket- and UDP Clients

Configuration and examples of every plugin can be read here: Wiki.

Example: WebSocket Server

Register the plugin when creating the OSC instance:

const osc = new OSC({ plugin: new OSC.WebsocketServerPlugin() })
osc.open() // listening on 'ws://localhost:8080'

Example: OSC between MaxMSP/PD/SC etc. and your browser

  1. Write a simple webpage. The library will use a WebSocket client by default.
<button id="send">Send Message</button>
<script type="text/javascript" src="lib/osc.min.js"></script>
<script type="text/javascript">
  var osc = new OSC();
  osc.open(); // connect by default to ws://localhost:8080

  document.getElementById('send').addEventListener('click', () => {
    var message = new OSC.Message('/test/random', Math.random());
    osc.send(message);
  });
</script>
  1. Write a Node app (the "bridge" between your UDP and WebSocket clients).
const OSC = require('osc-js')

const config = { udpClient: { port: 9129 } }
const osc = new OSC({ plugin: new OSC.BridgePlugin(config) })

osc.open() // start a WebSocket server on port 8080
  1. Create your Max/MSP patch (or PD, SuperCollider etc.).
[udpreceive 9129] // incoming '/test/random' messages with random number

Custom solutions with Plugin API

It is possible to write more sophisticated solutions for OSC applications without loosing the osc-js interface (including its message handling etc.). Read the Plugin API documentation for further information.

class MyCustomPlugin {
  // ... read docs for implementation details
}

const osc = new OSC({ plugin: MyCustomPlugin() })
osc.open()

osc.on('/test', message => {
  // use event listener with your plugin
})

Usage without plugins

The library can be used without the mentioned features in case you need to write and read binary OSC data. See this example below for using the Low-Level API (even though the library already has a solution for handling UDP like in this example):

const dgram = require('dgram')
const OSC = require('osc-js')

const socket = dgram.createSocket('udp4')

// send a messsage via udp
const message = new OSC.Message('/some/path', 21)
const binary = message.pack()
socket.send(new Buffer(binary), 0, binary.byteLength, 41234, 'localhost')

// receive a message via UDP
socket.on('message', data => {
  const msg = new OSC.Message()
  msg.unpack(data)
  console.log(msg.args)
})

Development

osc-js uses Babel for ES6 support, ESDoc for documentation, Mocha + Chai for testing and Rollup for generating the UMD module.

Clone the repository and install all dependencies:

git clone [email protected]:adzialocha/osc-js.git
cd osc-js
npm install

Testing

npm run test for running the tests. npm run test:watch for running specs during development. Check code style with npm run lint.

Deployment

npm run build for exporting UMD module in lib folder.

Contributors

ESDocs

npm run docs for generating a docs folder with HTML files documenting the library. Read them online here: https://adzialocha.github.io/osc-js

License

MIT License MIT

osc-js's People

Contributors

adzialocha avatar davidgranstrom avatar elgiano avatar eliot-akira avatar jan2100 avatar yaxu avatar yojeek avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

osc-js's Issues

Handling errors in unpack in Node.js

I am using osc-js in a Node.js environment with the DatagramPlugin.

When a malformed UDP packet arrives, where the path doesn't start with a /, osc-js throws an error with the message OSC Message found malformed or missing address string. In my case this causes the application to exit with code 1, although I think, osc-js could recover from this error by ignoring this message. (For your reference: such a malformed packet is being produced by the JUCE OSC component, when the path is just a /. JUCE removes trailing slashes and creating an invalid OSC message).

What is the recommended way to handle errors that might occur during unpacking an OSC message (or any other recoverable error)? As a workaround I am using process.on('uncaughtException', (error) => {...}) to handle this, but this gets difficult to handle, since I wouldn't want to catch other unhandled exceptions, except the ones from osc-js.

Also, I think it would make sense to catch recoverable errors in osc-js and fire the 'error' event of osc-js instead of crashing the application.

Having trouble using the bridge plug-in

Hi.

I am working on a project using Touch Designer & we want to send data using OSC from a Node.js app.

I am getting the following error at run-time when trying to use the bridge plug-in:

"Error: BridgePlugin can not be used in browser context"
	BridgePlugin
osc.js:1073
require<[5]<
camera_osc.js:34:30
newRequire
http://localhost:1234/dist/904f316f53e694a9253efea39d6a5f51.js:42:7
require<
http://localhost:1234/dist/904f316f53e694a9253efea39d6a5f51.js:69:5
<anonymous>
http://localhost:1234/dist/904f316f53e694a9253efea39d6a5f51.js:10:12

cannot replicate the example for getting messages from browser to Pure Data through node

Im attempting to replicate the bridge html websocket- to node server- to pure data [netreceive] from the wiki.
html code:

<html>
<head>
<title>websockets udp bridge TEST</title>
<script src="lib/osc-js-master/lib/osc.min.js"></script>
</head>
<body>
<button id="send">Send Message</button>
<script type="text/javascript">
  var osc = new OSC();
  osc.open(); // connect by default to ws://localhost:8080
  document.getElementById('send').addEventListener('click', function() {
    var message = new OSC.Message('/test/random', Math.random());
    osc.send(message);
  });
</script>
</body>
</html>
 

server js:

var express = require('express');
// request allows us to make http requests to external apis
var request = require('request');
var path = require('path');
var fs = require('fs');
var ws = require('ws');

var app = express();
// load up web files with express
app.use(express.static(__dirname + '/views'));
app.use('/lib', express.static(__dirname + '/lib'));
app.use('/images', express.static(__dirname + '/images'));

// tell our node app to open its ears
var server = app.listen(8080, function() {
  console.log('listening at localhost:8080');
})

const OSC = require('osc-js')

const config = { udpClient: { port: 9129 } }
const osc = new OSC({ plugin: new OSC.BridgePlugin(config) })

osc.open() // start a WebSocket server on port 8080

PD vanilla patch is a simple:
[listen 9129]message
|
[netreceive -u -b]
|
[print]

console messages are:
WebSocket connection to 'ws://localhost:8080/' failed: Connection closed before receiving a handshake response
WebSocket is already in CLOSING or CLOSED state.

Actually, I noticed (as writing this post) that the html in your example in the wiki requires osc.min.js, (which I had to go get from the osc.js repository {not osc-js}) but i was using osc.browser.js to get these errors. When I switched it to requiring osc.min.js, I get:
Uncaught ReferenceError: OSC is not defined
(the link to the library file works fine)

osx and chrome, btw.
I'm sure I'm missing something silly.

Ionic 3 CORS issue

Hi,

I am trying to get this great package into Ionic 3 (only websocket client support I guess?)

I set up a websocket client like the example:

var websocketClient = new OSC({plugin: new OSC.WebsocketClientPlugin({host: address', port:9011})});

When running this on the ios simulator I get a cors issue:

Origin http://192.168.1.247:8100 is not allowed by Access-Control-Allow-Origin.

I tried setting a proxy which is recommended by ionic but this doesn't fix the problem

Any ideas?

[UDP] open() overrides initial options

Hi,

I'm trying out the UDP plugin and I found that calling open() without options actually seem to override the options passed to the constructor. The code below demonstrates the issue, comment out osc.open({ port: PORT }); and it should receive the /test message on port 9912. Its easy to solve as seen below, thought I should report it here just so you'd know about it! :)

const OSC = require('osc-js');
const PORT = 9912;
const options = {
  open: {
    host: 'localhost',
    port: PORT
  }
};
const osc = new OSC({ plugin: new OSC.DatagramPlugin(options) });

osc.on('test', (message) => {
  console.log('message.args', message.args);
});

// osc.open({ port: PORT });
osc.open();

Closing tab stops the server

I am implementing OSC.js in my server for external communications and to send data from my page but everytime I close a tab all the server goes down.
Error is:

events.js:167

      throw er; // Unhandled 'error' event
      ^

Error: read ECONNRESET
    at TCP.onStreamRead (internal/stream_base_commons.js:111:27)
Emitted 'error' event at:
    at WebSocket.finalize (/Users/luisarandas/Desktop/GitHub/akson/node_modules/ws/lib/WebSocket.js:182:41)
    at Socket.emit (events.js:182:13)
    at emitErrorNT (internal/streams/destroy.js:82:8)
    at emitErrorAndCloseNT (internal/streams/destroy.js:50:3)
    at process._tickCallback (internal/process/next_tick.js:63:19)

Any help on this?
Best, Luis

Pass client when Websocket Server receives Message

Hi,

I am trying to find out which websocket client send a message to the WebSocket Server but the 'message' event only passes the received message. Is it possible to add the client to the message event handler so you can see who send it and easily send a message back from the server to the client?

Thanks

From maxmsp to browser

Hello,
the Example: OSC between MaxMSP/PD/SC etc. and your browser, works.
It let us send from browser to maxmsp (UDP)
but I can't figure out how to send from Maxmsp to browser.

Does anyone know how to?

Browser(http) osc message to Reaper(udp)

I don't get it. I just want to send osc messages from a browser (Firefox or Chrome) to DAW Reaper sur son port UDP in order to control settings. I do it with another application in c++ and it works.
I wrote this code:

<!DOCTYPE html>
<html>
    <head>
        <title>osc.js Web Sockets</title>
        <meta charset="UTF-8" />
      <script type="text/javascript" src="osc.js"></script>
       <script type="text/javascript" src="osc-browser-min.js"></script>
        
    </head>
    <body>
	 <button id="send">Send Message</button>
	
	<script type="text/javascript">
	 
	 const  config  =  {  udpClient: {host:'127.0.0.1',  port:9001  }  } 
 	 var osc = new OSC({plugin : new  OSC.BridgePlugin (config)  } );
 	 osc.open(); 
//console.log("Bridge listening as Server:: Host: " + osc.server.host + ", Port: " + osc.client.port);
  	 document.getElementById('send').addEventListener('click', () => {
    var message = new OSC.Message('/track/2/*',  Math.random());
    osc.send(message);
  });
</script>
    </body>
</html>
Uncaught ReferenceError: OSC is not defined
    <anonymous> http://localhost/OSC/oscsend.html:15

What is not correct?
What are the .js files that need to be loaded into the html page for this to work?
I'm not sure about the procedure either, can you tell me if this would be suitable?
It's a bit hopeless!

Connecting to another device on the network fails with host: localhost. need 0.0.0.0

When I create a UDP OSC server with new DatagramPlugin({ open: { port: 9000 }, send: { host: '192.168.1.123', port: 9001 }}), I can not send or receive messages to/from the machine at 192.168.1.123.

However, this will make it so I can both send and receive: new DatagramPlugin({ open: { host: '0.0.0.0' port: 9000 }, send: { host: '192.168.1.123', port: 9001 }}).

This is a common stumbling block when setting up communication on a LAN. Hopefully this issue saves someone some time and frustration. :-)

Difficult to have WSServer and Express on the same port

Hi, first of all thanks for this super useful package!
I'm making a web interface for supercollider, and I need WSServer and Express on the same port. I use Express to serve the interface (and adb to forward ports between my local machine and an android smartphone).

It would be nice to have the bridge plugin accept a server option, to be passed directly to WebSocketServer. This wouldn't disrupt other use-cases and it would make mine much cleaner :)

I could submit a Pull Request, for now I'm directly hacking into the osc-js.js :)

Trouble sending osc message to UDP client in LAN network

First of all, thank you very much for this library. It makes things a lot easier for me.

I would like to send osc messages from a browser via the bridge.js to another PC in the network but when I enter the UDP clients IP address it does not deliver the messages
To verify that I can send osc messages from one to the other PC it works flawlessly when using this tool and oscdump on the other device. Ports are open in ufw, no problems.

My bridge.js looks like this:

const OSC = require('osc-js') 
const config = {
    udpClient: {
        host: '192.168.178.100',
        port: 3333
    }
}
const osc = new OSC({ plugin: new OSC.BridgePlugin(config) })
osc.open() 

When changing to "host: localhost" it surely sends data on the same machine but not to another one in the network.

And in the index.html file I am sending messages like this

var osc = new OSC();
  osc.open();
 function sOSC() {
    message = new OSC.Message('test', 123)
    osc.send(message);
}

I would highly appreciate any help, as I am out of ideas how to establish the desired connection.

Thanks in advance!
T

WebSocket connection to 'ws://127.0.0.1:57121/' failed: Error in connection establishment: net::ERR_CONNECTION_REFUSED

Hi, thanks for the module!

Trying to run the WebSocket server example code (https://github.com/adzialocha/osc-js/wiki/Node.js-Server#websocket-server-example, with this workaround #24) in a webpack based project (using the instructions here https://github.com/adzialocha/osc-js/wiki/Webpack-Bundling), but getting WebSocket connection to 'ws://127.0.0.1:57121/' failed: Error in connection establishment: net::ERR_CONNECTION_REFUSED

No idea why. I have had success with osc.js but can't get that to work with webpack so trying to migrate to this library.

Any ideas how to figure out why this connection gets refused?

const OSC = require('osc-js')

const osc = new OSC();
osc.open({ host: '127.0.0.1', port: 57121 });

osc.on('/test', (message) => {
  console.log(message.args)
})

Can't send message with value of 0

    if (!this.value) {
      throw new Error('OSC Atomic cant\'t be encoded with empty value')
    }

This check throws when there are falsy values (like 0).
This should either check for null or undefined values which would also allow empty strings or maybe use a separate function like isEmpty(value): boolean which can be overridden.

What do you think? I can create a pull request with a fix if you want.

TypeError: OSC.WebsocketClientPlugin is not a constructor

Greetings!

I'm using this fine work as a dependency in an A-Frame component and am running into this error using the browser files of the current release. This code results in the error: var plugin = new OSC.WebsocketClientPlugin({host: this.data.serverURL, port: this.data.serverPort });

Since WebSocketClientPlugin is the default I can work around this like so: osc = new OSC(); osc.open({host: this.data.serverURL, port: this.data.serverPort });

TypeScript compile error because of incompatible override of Atomic.unpack by its subclasses

I am a TypeScript user with strict mode turned on, and in that configuration this library doesn't compile without manual modifications. I would like to address that issue for fellow strict TypeScript users, to allow them access to this otherwise great library.

❗ Behavior

When trying to install and thus compile the library with TypeScript, the following error occurs:

node_modules/osc-js/lib/osc.d.ts:200:5 - error TS2416: Property 'unpack' in type 'AtomicTimetag' is not assignable to the same property in base type 'Atomic'.
  Type '(dataView: DataView, initialOffset?: number | undefined) => number' is not assignable to type '(dataView: DataView, method: string, byteLength: number, initialOffset?: number | undefined) => number'.
    Types of parameters 'initialOffset' and 'method' are incompatible.
      Type 'string' is not assignable to type 'number'.

❔ Cause

AtomicTimetag is overriding its parent method unpack in an incompatible way. Parent method Atomic.unpack is defined as

unpack(dataView: DataView, method: string, byteLength: number, initialOffset?: number): number;

While AtomicTimetag.unpack is defined as

unpack(dataView: DataView, initialOffset?: number): number;

By omitting the method and byteLength property, it renders itself incompatible with its base class, preventing TypeScript from compiling.

✔️ How to fix

By changing the child signature into

unpack(dataView: DataView, initialOffset?: number|string): number;

it overlaps with the parent signature enough to compile. However, this is kinda hacky and the child classes should not override their base methods incompatibly.

Connect to PD or Max MSP

I ran into another problem, I'm building a heroku server app with node.js but I don't seem to be able to open more ports than the one the app is serving.
I am not able to implement this by sockets in my app. Everytime I test osc.js it denies and closes the socket. My point would be to connect to pure data or maxmsp, any help on this?
Best, Luis

Originally posted by @luisarandas in #38 (comment)

Configuration for using https with web sockets?

Hi.

We have been using your library for weeks; it has been great. Now, we want to be able to use https; this is because we want the web browser to remember the user's web cameras choice. We have osc-js working with the Google PoseNet demo. We are seeing the connection fail when trying to see wss.

Firefox can’t establish a connection to the server at wss://localhost:8080/.

I have set up the code using yarn & parcel based on the original demo code, from the package.json:

  "scripts": {
    "secure": "NODE_ENV=development parcel --no-hmr --open camera2.html --https",
  },

here is the code in the app that sends the data using the bridge:

let osc = new OSC();
osc.open({secure: true});

An example message:

    // Right Shoulder
    let message9 = new OSC.Message(messageRightWrist, keypoints[10].position.x,
      keypoints[10].position.y);

    osc.send(message9);

And here is the bridge server code:

const OSC = require('osc-js');
const chalk = require('chalk');
const log = console.log;


// This port value is the receiver port for the touch designer project
const sendingPort = 3333;
const receivingPort = 3334;

// Using default values for everything else with the configuration.
const config = {
  wsServer: {
    secure: true
  },
  udpServer: {
   port: receivingPort,   // @param {number} Port of udp server to bind to
   exclusive: false       // @param {boolean} Exclusive flag
  },
  udpClient: {
    port: sendingPort,
    exclusive: false
  }
};

const osc = new OSC({ plugin: new OSC.BridgePlugin(config) });

osc.open() // start a WebSocket server on port 8080

log(chalk.underline("OSC Bridge server running"));
log("Web Socket - listening on port: " + chalk.green('8080'));
log("UDP - sending on port: " + chalk.green(sendingPort));
log("UDP - receiving on port: " + chalk.green(receivingPort));

osc.on('/posenet', message => {
  // Send the posenet OSC message to the Posenet Node.js app.
  osc.send(message);
})

Failed to execute 'send' on 'WebSocket': Still in CONNECTING state.

I am using bridge plugin to send a stream of data from the client to maxmsp. My server code is as follows-

const OSC = require('osc-js')

const config = { udpClient: { port: 8080 } }
const osc = new OSC({ plugin: new OSC.BridgePlugin(config) })

osc.open(); // start a WebSocket server on port 8080

osc.on('/imagecolors', (message) => {
  console.log(message);
})

And my client code is as follow-

(function(window) {
  var App = window.App || {};
  var colorlist = App.colorlist;
  var osc = new OSC();
  osc.open(); // connect by default to ws://localhost:8080
  for (var i = 0; i < colorlist.length; i++) {
    var message = new OSC.Message('/imagecolors', colorlist[i]);
    osc.send(message);
  }
})(window);

While sending the data I get an error message saying websocket still in connecting. I tried debugging the code at osc.send() the osc.status is STILL_CONNECTING.

Get address of sender in message?

if we are using the datagram plugin, is there a way to pass along the sender address of any message we receive in the .on('/someaddress', callback)

Implement booleans

The boolean type tags are listed in the wiki but don't actually work:

Also, while in the OSC protocol booleans take no space in the message encoding, I think it would be beneficial to add true/false values into TypedMessage.args at the corresponding position. Otherwise the mapping from type to args is broken, which means the user has to essentially re-parse the type string just to find the corresponding value.

Accept full URL in osc.open()

It would be nice to shorten this:

osc.open({ host: '127.0.0.1', port: 80, secure: true  })

to something like this:

osc.open('wss://127.0.0.1:80')

If you are interested I can implement this feature and create a pull request (:

Failed to execute 'send' on 'WebSocket': Still in CONNECTING state.

I cannot get the websocket to work… :(

Any idea what I'm missing?

My Server:

const express = require("express");
const app = express();
const OSC = require('osc-js');

app.use(express.static("public"));

app.get("/", (request, response) => {
  response.sendFile(__dirname + "/views/index.html");
});

const listener = app.listen(process.env.PORT, () => {
  console.log("Your app is listening on port " + listener.address().port);
});


const config = { udpClient: { port: 8888 } }
const osc = new OSC({ plugin: new OSC.BridgePlugin(config) })

osc.open({ port: 9912 }) // start server

// listen for invoing messages

osc.on('/test', message => {
  console.log(message.args)
})

// sent messages frequently when socket is ready

osc.on('open', () => {
  setInterval(() => {
     osc.send(new OSC.Message('/response', Math.random()))
  }, 1000)
})

And This is my client


const express = require("express");
const app = express();
const OSC = require('osc-js');

app.use(express.static("public"));

app.get("/", (request, response) => {
  response.sendFile(__dirname + "/views/index.html");
});

const listener = app.listen(process.env.PORT, () => {
  console.log("Your app is listening on port " + listener.address().port);
});


const config = { udpClient: { port: 8888 } }
const osc = new OSC({ plugin: new OSC.BridgePlugin(config) })

osc.open({ port: 9912 }) // start server

// listen for invoing messages

osc.on('/test', message => {
  console.log(message.args)
})

// sent messages frequently when socket is ready

osc.on('open', () => {
  setInterval(() => {
     osc.send(new OSC.Message('/response', Math.random()))
  }, 1000)
})

Here is also a Glitch link of the code: https://glitch.com/edit/#!/express-osc

And the Glitch Website: https://express-osc.glitch.me/

Thanks a lot!

Export `Message` class (and possibly other classes)

I'm using your library in a project where I only need the Message class. It would be great if I could import it like this:

import { Message } from 'osc-js'

I could just import it like this, but this will load all the other code which I don't need in this case

import OSC from 'osc-js`
const { Message } = OSC

Importing OSC-js from ES module does not work

I would like to import OSC from a Web Component in a web app (that, in browser), using the ES module import syntax:

import { OSC } from "osc-js";

const osc = new OSC();
osc.open({ host, port });

You would assume I have added the module as dependency of my package.json and did run npm install to retrieve the osc-js package from the NPM registry:

  …
  "dependencies": {
    "osc-js": "^2.0.2",
   …
  },

The build of OSC-js version 2.0.2 currently does not support module imports. Its build uses a version
of the UMD wrapper, which contains a common bug, the incorrect detection of browser global in strict mode implied by module imports (see umdjs/umd#125).

I am unfamiliar with the build process; naively, I would think it is a matter of updating the UMD wrapper that the bundler is using to its latest version – as the above mentioned UMD issue was fixed and merged on 13.10.2017.

Nested bundles cannot be processed

Hello I was using this library to receive data from an ESP32 through websocket, using the WebsocketClientPlugin, and I found an issue processing nested bundles.
I've narrowed down the issue to a small node based script that has the same error. What's really interesting is that the lib can generate a bundle with nested bundles the problem occurs when receiving the messages from the net.
I'll paste the script down below:

const OSC = require('osc-js')

let test = new OSC({plugin: new OSC.WebsocketServerPlugin()});
test.open();
let client = new OSC({ plugin: new OSC.WebsocketClientPlugin({host: 'localhost', port:8080})});
client.open();

client.on('*', (message) => {
	console.log(message);
});

let message = new OSC.Message("/test1", "test");
let inner_bundle = new OSC.Bundle(message);
let outer_bundle = new OSC.Bundle(inner_bundle);

console.log(outer_bundle);

client.on('open', () => {
client.send(outer_bundle, { host: 'localhost', port:8080});
});

If I run this script I get: "Error: OSC EventHander dispatch() accepts only arguments of type Packet".

Integer bundle timetags ignored

Hi, I'm having trouble getting a timestamped bundle through BridgePlugin.

I send the bundle like this, to timestamp it 5 seconds into the future:

<button id="send" style="font-size: 2em">Send bundle</button>
<script type="text/javascript" src="./node_modules/osc-js/lib/osc.min.js"></script>
<script type="text/javascript">
  const comm = new OSC();
  comm.open(); // connect by default to ws://localhost:8080
  document.getElementById('send').addEventListener('click', function () {
    const message = new OSC.Message(
      '/dirt/play',
      ...['s', 'hh'],
    );
    const bundle = new OSC.Bundle([message], Date.now() + 5000)
    comm.send(bundle);
  });
</script>

This goes through the bridge:

const OSC = require('osc-js');

const config = {
  receiver: 'ws', 
  udpServer: {
    host: 'localhost', 
    port: 57121,
    exclusive: false,
  },
  udpClient: {
    host: 'localhost',
    port: 57120, 
  },
  wsServer: {
    host: 'localhost',
    port: 8080,
  },
};

const osc = new OSC({ plugin: new OSC.BridgePlugin(config) });
osc.open();

Sniffing the UDP with wireshark though, I can see that the OSC that comes out has a timestamp of 'now' rather than 'now-plus-5-seconds'.

Could there be something wrong in the BridgePlugin, or am I constructing the bundle wrong in the first place? Any help would be much appreciated!

C++ OSC receiver

Hi,
Thank you for the ES6 update!
I plan to use it with my C++ Cinder project.
I tryed osc.js it the past, unfortunately it was sending a \0 character, which was interpreted as a "end of string" if my c++ app.
So I switched to websockets nodejs ws npm module...
I will try osc.js again and let you know if this is fixed.

Can we avoid using websocket and use the library in the browser?

Is this possible to use this library without socket?
More generally is it possible to use OSC without websocket directly from browser?
I'm not sure to understand what the websocket is here for but I guess there is an explanation.
wouldn't be possible to do something like

osc.open( { host:'127.0.0.1', port:8080 } );

and send some OSC message to this port directly over UDP for example. I'm quite a newbie to OSC so I'm trying to understand

Thanks in advance

Webpack 2 bundling error

Hi,

I have encountered an issue when including this library using Webpack 2. I have attached the error log [1], and I have also published a minimal reproducer that can be found here

I'm looking forward to use this library, it looks great! :)

Btw, I had to add:

  node: {
    fs: 'empty',
    tls: 'empty'
  }

..in my webpack config, to avoid errors from node-specific modules (fs etc) in ws. But it seems like a known issue with webpack. Maybe it could be mentioned in the wiki somewhere?

I have also tried installing the library using npm instead of yarn, just in case, but I encountered the same error.

Hash: e9cfd813b9d98ebecc84
Version: webpack 2.5.1
Time: 1948ms
                      Asset       Size  Chunks                    Chunk Names
app-e9cfd813b9d98ebecc84.js    1.05 MB       0  [emitted]  [big]  app
                 index.html  200 bytes          [emitted]
   [0] ./~/buffer/index.js 48.6 kB {0} [built]
   [5] (webpack)/buildin/global.js 509 bytes {0} [built]
  [40] ./~/stream-http/index.js 1.72 kB {0} [built]
  [43] ./~/ws/index.js 1.05 kB {0} [built]
  [61] ./~/isarray/index.js 132 bytes {0} [built]
  [64] ./~/node-libs-browser/mock/empty.js 0 bytes {0} [built]
  [87] ./~/ws/lib/Receiver.js 23.1 kB {0} [built]
  [88] ./~/ws/lib/Sender.js 7.88 kB {0} [built]
  [89] ./~/ws/lib/WebSocket.js 27.6 kB {0} [built]
  [90] ./~/osc-js/lib/osc.js 44.2 kB {0} [built]
 [100] ./~/base64-js/index.js 3.48 kB {0} [built]
 [147] ./~/ieee754/index.js 2.05 kB {0} [built]
 [182] ./~/ultron/index.js 2.96 kB {0} [built]
 [194] ./~/ws/lib/WebSocketServer.js 16.9 kB {0} [built]
 [196] ./src/index.js 29 bytes {0} [built]
    + 184 hidden modules

WARNING in ./~/ws/lib/BufferUtil.js
Module not found: Error: Can't resolve 'bufferutil' in '/Users/$HOME/error/node_modules/ws/lib'
 @ ./~/ws/lib/BufferUtil.js 12:15-36
 @ ./~/ws/lib/Sender.js
 @ ./~/ws/index.js
 @ ./~/osc-js/lib/osc.js
 @ ./src/index.js

WARNING in ./~/ws/lib/Validation.js
Module not found: Error: Can't resolve 'utf-8-validate' in '/Users/$HOME/error/node_modules/ws/lib'
 @ ./~/ws/lib/Validation.js 12:16-41
 @ ./~/ws/lib/Receiver.js
 @ ./~/ws/index.js
 @ ./~/osc-js/lib/osc.js
 @ ./src/index.js

ERROR in ./~/osc-js/lib/osc.js
Module not found: Error: Can't resolve 'dgram' in '/Users/$HOME/error/node_modules/osc-js/lib'
 @ ./~/osc-js/lib/osc.js 936:47-63 1028:49-65
 @ ./src/index.js
Child html-webpack-plugin for "index.html":
       [0] ./~/lodash/lodash.js 540 kB {0} [built]
       [1] ./~/html-webpack-plugin/lib/loader.js!./~/html-webpack-plugin/default_index.ejs 538 bytes {0} [built]
       [2] (webpack)/buildin/global.js 509 bytes {0} [built]
       [3] (webpack)/buildin/module.js 517 bytes {0} [built]

Uncaught ReferenceError: OSC is not defined

<!DOCTYPE html>
<html>
    <head>
        <title>osc.js Web Sockets</title>
        <meta charset="UTF-8" />
        <script t type="text/javascript"  src="osc.js"></script>      
    </head>
    <body>
    <button id="send"> Test</button>
		<script type="text/javascript">

		const osc1 = new OSC();
		osc1.open({host:localhost, port:3819});
  		document.getElementById('send').addEventListener('click', () => {
   	var message = new OSC.Message('/strip/list');
    	osc1.send(message);
  });
</script> 
    </body>
</html>

I am unable to send an osc message to Ardour (DAW localhost port: 3819). I still have an error message: with the OSC object : OSC is not defined (with chrome).

ERR_SOCKET_DGRAM_NOT_RUNNING

When .close()ing and re-.open()ing a server, Node throws ERR_SOCKET_DGRAM_NOT_RUNNING.

As far as I can tell, it is not possible to reconnect an existing UDP connection, you have to recreate it from scratch, likely due to the underling node:dgram package.

This probably should be recorded in the docs, assuming I'm correct in my analysis.

Wildcard address for listeners

Hi,

great plugin! I was wondering if it would be possible to have a wildcard address like this:

    osc.on('/*', (message) => {
        console.log(message);
    })

Event listener on server on client connect

Hi! Thanks for creating this awesome library!

I am trying to have a bunch of OSC messages saved on the node server using the Bridge Plugin, so they could be sent to the browser client when they connect to the server. But I can't seem to find an event listener that listens to a new connection on the server and sending a message only to the new client.

Right now I'm using a workaround, which the client sends a message to the server on connection, which then in turn responds with the saved OSC messages. Though this would broadcast the message to other connected clients as well and might cause issues.

Client

osc.on('open', () => {
  const oscMsg = new OSC.Message('/connected', true)
  osc.send(oscMsg)
})

Server

const savedMessage = 123
osc.on(/'connected', () => {
  const oscMsg = new OSC.Message('/example', savedMessage)
  osc.send(oscMsg) // This broadcasts the osc message to all connected clients instead of only the new client
})

Any ideas on how to only respond to a new client?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.