TeamSpeak Remote Apps

Since some people have had problems with the remote apps up to now, I wanted to show an example including the code.

Request an API Key:

{
  "type": "auth",
	"payload": {
				"identifier": "de.bytestore",
				"version": "0",
				"name": "Example",
				"description": "Description of your App.",
				"content": {
					"apiKey": ""
			}
  }
}

If you send this Request to your Client (WebSocket Server) than you should get following Response on Accept the Request:

{
   "payload":{
      "apiKey":"e4f1bc71-bd45-46fc-b523-b44fe5c4a2e7",
      "connections":[
         
      ],
      "currentConnectionId":0
   },
   "status":{
      "code":0,
      "message":"ok"
   },
   "type":"auth"
}

Now some Code examples:

// WebSocket Client Endpoint in JavaScript
 
var ws = new WebSocket("ws://localhost:5899");
 
// Event handler for the WebSocket connection opening
ws.onopen = (event) => {
   ws.send("connected")
};
 
// Event handler for receiving text messages
ws.onmessage = (event) => {
      console.log(event.data)
}
 
// Event handler for errors in the WebSocket object
ws.onerror = (err) => {
   console.log("Error ", err);
};
 
// Listen for the close connection event
 ws.onclose = (event) => {
   console.log("Disconnected: " + event.reason);
}
 
// Send the message
ws.send({
         "type": "auth",
         "payload": {
             "identifier": "de.teamspeak",
             "version": "0",
             "name": "DISPLAY NAME",
             "description": "Some description",
             "content": {
                 "apiKey": ""
           }
      }
});
 
ws.close();

Hotkeys in (5.0.0-beta55)
You now have your API Key and your Open Stream, lets start by the first Action wich was implemented at 02.06.2021 on the Beta Clients.

You can simply create your “own” Button by following Request:

{
   "type":"buttonPress",
   "payload":{
      "button":"de.bytestore.key1",
      "state":true
   }
}

de.bytestore can be your Application identification.
key1 can be your Key identification.

For setting up now your custom Keybind, you can Navigate into your Settings and as you set a normal Keybind you can setup your Key via the Remote App in following Steps:

YOU SHOULD EXECUTE THE REQUEST TWICE (Like a real Button):

  1. Button Enable
  2. Button Disable

Other Examples, will follow if TeamSpeak publish more Information.

Best Regards
Jan

6 Likes

Hey there! Nice writeup.
I have written a library in go that supports (ATM) sending the auth-event and the buttonPress-event …
and receiving much more (auth, clientSelfPropertyUpdated, clientPropertiesUpdated, connectStatusChanged, channelsSubscribed, clientMoved, channelPropertiesUpdated, clientChannelGroupChanged, channels, groupInfo, permissionList, serverPropertiesUpdated, neededPermissions, buttonPress).

That are all the events I could find during development. If you encounter different ones please send payloads and names :slight_smile:

btw… contributions are welcome!

3 Likes

When I run that script I get like
WebSocket connection to 'ws://localhost:5899/' failed: WebSocket is closed before the connection is established.
TeamSpeak 5 is open and running with the Remote App being enabled
Do you guys have any idea what’s wrong?

1 Like
You have to wait till the connection ist established, 
after this you can send your message.

Maybe like this:
	ws.onopen = (event) => {
	  ws.send({
		"type": "auth",
		"payload": {
			"identifier": "net.example",
			"version": "1.0.0",
			"name": "example Application",
			"description": "An example application that does things",
			"content": {
				"apiKey": ""
			}
		}
	});

But I prefer the built-in query from the program “Postman” is easier to start with

image

2 Likes

Look here is what i got now

// WebSocket Client Endpoint in JavaScript

import WebSocket from 'ws';

var ws = new WebSocket("ws://localhost:5899");

// Event handler for the WebSocket connection opening

ws.onopen = (event) => {

   ws.send("connected")

   // Send the message

   ws.send({

      "type": "auth",

      "payload": {

         "identifier": "POQDavid.TESTSCRIPT",

         "version": "0",

         "name": "TESTSCRIPT",

         "description": "Some description",

         "content": {

            "apiKey": ""

         }

      }

   });

   //ws.close();

};

// Event handler for receiving text messages

ws.onmessage = (event) => {

   console.log(event.data)

}

// Event handler for errors in the WebSocket object

ws.onerror = (err) => {

   console.log("Error ", err);

};

// Listen for the close connection event

ws.onclose = (event) => {

   console.log("Disconnected: " + event.reason);

}

and with that I still get jswebsocketerror (github.com)
also I tested websocket with C# and I get 'The remote party closed the WebSocket connection without completing the close handshake.

1 Like

Is there any way I can see if the TeamSpeak5 Client is receiving my connection? i mean like a console

1 Like

u will see a request right here:
image

1 Like

Oh, awesome and just got that notification :slight_smile: ty

1 Like

I can connect to the websocket and the console on firefox tells me, that i’m connected but I never get a request in the teamspeak app. What I’m doing wrong?

var teamspeakWebsocket = new WebSocket("ws://localhost:5899")
teamspeakWebsocket.onopen = (event) => {
	console.log("Connected:")
	console.log(event)
	teamspeakWebsocket.send("connected")
	teamspeakWebsocket.send({
		"type": "auth",
		"payload": {
			"identifier": "com.berofa.teamspeak",
			"version": "1.0.0",
			"name": "StreamDeck TeamSpeak 5 Integration",
			"description": "Enable Websocket connection to StreamDeck.",
			"content": {
				"apiKey": ""
			}
		}
	})
};

teamspeakWebsocket.onmessage = (event) => {
	console.log(event)
}

teamspeakWebsocket.onerror = (err) => {
	console.log("Error ", err)
};

teamspeakWebsocket.onclose = (event) => {
	console.log("Disconnected:")
	console.log(event)
}

Console output:

Connected: 
open { target: WebSocket, isTrusted: true, srcElement: WebSocket, currentTarget: WebSocket, eventPhase: 2, bubbles: false, cancelable: false, returnValue: true, defaultPrevented: false, composed: false, … }

Remote Apps is enabled in the teamspek app and the port is set to 5899 (default)…

TS Version: 5.0.0-beta70 Windows 11
I’ve allready reinstalled teamspeak but that did not solve the problem.

1 Like

I had the same problem with the websocket not connecting properly. My solution was to put a JSON.stringify() around the JSON object.

teamspeakWebsocket.send(JSON.stringify({
		"type": "auth",
		"payload": {
			"identifier": "com.berofa.teamspeak",
			"version": "1.0.0",
			"name": "StreamDeck TeamSpeak 5 Integration",
			"description": "Enable Websocket connection to StreamDeck.",
			"content": {
				"apiKey": ""
			}
		}
	}));
};

1 Like

I have created a small project using the remote app feature.
It currently serves as an example project to play around with the remote apps. I thought others might be able to pull very simple examples from it, and I’m posting it here.

However, the most interesting part for an example would be the “js/app.js” file:
https://github.com/DerTyp876/ts5-obs-overlay/blob/master/js/app.js

3 Likes

Hey guys can someone explain to me how this works with the button calls check it not really

1 Like

Hello there,

i know its an old thread, but I am struggeling with the “buttonPress” command. Maybe someone of you could help me.

When I send the buttonPress command (state true), I wait 200 millisecons and then send the unpress (state false) command. When I try to assign this to a hotkey, the button works fine. When I try to use the Hotkey Button, nothing is happening. Any ideas why?

There is a bug in the current version of TS5 (beta77) such that the button press state is inverted. So you need to send false for press and true for release. This will be fixed in the next version of TS5.

4 Likes