import ballerina/io;
import ballerina/http;
import ballerina/mime;endpoint http:Listener servicEp {
    port:9090
};@http:ServiceConfig {
    basePath:"/hello",
    webSocketUpgrade:{
                         upgradePath:"/ws",
                         upgradeService:typeof wsService
                     }
}
service<http:Service> httpService bind servicEp {    @http:ResourceConfig {
        path:"/world",
        methods:["POST", "GET", "PUT", "My"]
    }
    httpResource (endpoint conn, http:Request req) {
        http:Response resp = new;
        var payload = req.getStringPayload();
        match payload {
            http:PayloadError payloadError => {
                io:println(payloadError.message);
                resp.setStringPayload(payloadError.message);
                resp.statusCode = 500;
            }
            string val => {
                io:println(payload);
                resp.setStringPayload("I received");
            }
        }        _ = conn -> respond(resp);
    }
}
@http:WebSocketServiceConfig {
    subProtocols:["xml, json"],
    idleTimeoutInSeconds:5
}
service<http:WebSocketService> wsService {    onOpen (endpoint ep) {
        var conn = ep.getClient();
        io:println("New WebSocket connection: " + ep.id);
    }    onText (endpoint ep, string text) {
        io:println(text);
        _ = ep -> pushText(text);
    }    onIdleTimeout (endpoint ep) {
        var conn = ep.getClient();
        io:println("Idle timeout: " + ep.id);
    }
}

HTTP to WebSocket Upgrade

This sample explains how a Http endpoint can be updated to a WebSocket endpoint using configuration annotation.

import ballerina/io;
import ballerina/http;
import ballerina/mime;
endpoint http:Listener servicEp {
    port:9090
};
@http:ServiceConfig {
    basePath:"/hello",
    webSocketUpgrade:{
                         upgradePath:"/ws",
                         upgradeService:typeof wsService
                     }
}
service<http:Service> httpService bind servicEp {
    @http:ResourceConfig {
        path:"/world",
        methods:["POST", "GET", "PUT", "My"]
    }
    httpResource (endpoint conn, http:Request req) {
        http:Response resp = new;
        var payload = req.getStringPayload();
        match payload {
            http:PayloadError payloadError => {
                io:println(payloadError.message);
                resp.setStringPayload(payloadError.message);
                resp.statusCode = 500;
            }
            string val => {
                io:println(payload);
                resp.setStringPayload("I received");
            }
        }
        _ = conn -> respond(resp);
    }
}
@http:WebSocketServiceConfig {
    subProtocols:["xml, json"],
    idleTimeoutInSeconds:5
}
service<http:WebSocketService> wsService {

Note: When a WebSocket upgrade path is defined in HTTP configuration in WebSocket configuration there can be \n - Full service configuration: There will be two base paths for the same service from either HTTP or WebSocket \n - Without service configuration: WebSocket service will be a slave service of HTTP service. Then only the upgrade path can be there. \n - Configuration without basePath: It will act as a slave service but can configure sub protocols, idle timeout etc…

    onOpen (endpoint ep) {
        var conn = ep.getClient();
        io:println("New WebSocket connection: " + ep.id);
    }
    onText (endpoint ep, string text) {
        io:println(text);
        _ = ep -> pushText(text);
    }
    onIdleTimeout (endpoint ep) {
        var conn = ep.getClient();
        io:println("Idle timeout: " + ep.id);
    }
}
$ ballerina run http-to-websocket-upgrade.bal

To run the program, put the code in http-to-websocket-upgrade.bal and use ballerina run http-to-websocket-upgrade.bal command.

$ var ws = new WebSocket("ws://localhost:9090/hello/ws", "xml", "my-protocol");
$ var ws = new WebSocket("ws://localhost:9090/world/ws", "xml", "my-protocol");

To check the sample,use Chrome or Firefox javascript console and run the below commands
change “xml” to another sub protocol to observe the behavior of WebSocket server. There are two endpoints for this WebSocket sample since it is configured that way.

$ ws.onmessage = function(frame) {console.log(frame.data)};
$ ws.onclose = function(frame) {console.log(frame)};
$ ws.send("hello world");

To send messages