Dismiss Notice

Register now to be one of the first members of this SharePoint Community! Click here it just takes seconds!

Dismiss Notice
Welcome Guest from Country Flag

How to use AMQP protocol in Browser (JavaScript)

Discussion in 'Official Microsoft News' started by michaeljqzq, Mar 28, 2017.

Thread Status:
Not open for further replies.
  1. michaeljqzq

    michaeljqzq Guest

    Blog Posts:
    0
    In my previous 2 posts, Connect to Azure Event Hub in browser ( using AMQP over WebSockets ) and Connect to Azure IoT Hub in browser ( using AMQP over WebSockets ), I introduced the parameters needed to connect to IoT Hub and Event Hub. Since we chose to connect in front-end, so we have to find a JavaScript library for AMQP. However, it isn’t quite easy to find one.

    rhea is a reactive messaging library based on the AMQP protocol which meet our need.It is a NodeJS project, but it provides a browserify command in script. So all we have to do is to make a little changes.

    1.In the type wrapper (types.js), it is designed for Node so it uses Buffer class in code.


    if (o instanceof Buffer) {
    return types.wrap_binary(o);
    }


    The corresponding data structure in front-end JavaScript is ArrayBuffer. So here we make this code compatible with browser.


    if (o instanceof Buffer || o instanceof ArrayBuffer) {
    return types.wrap_binary(o);
    }


    2.The library doesn’t implement disconnect method. So let’s add one in container.js


    Container.prototype.disconnect = function () {
    this.connection.close();
    };


    Now let’s try to browerify the project!
    First we need to set dependency.In the terminal, point to project root folder, set the environment variable NODE_PATH to the parent folder of your rhea project. For example, my project folder is C:Usersv-zhqIoTrhea then you will set NODE_PATH to C:Usersv-zhqIoT.
    Then execute in project folder C:Usersv-zhqIoTrhea:

    npm run browserify

    rhea.js get!
    Then you can use example to test! Point to examples/websockets and start an HTTP server. Then visit http://localhost:8000, input websocket url.

    client.html ( in line #31 I made a little change or client object can’t be initialized )


    <!DOCTYPE html>
    <html>
    <head>
    <title>AMQP websockets example</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <!-- This example was adapted from a chat example included in the
    excellent 'JavaScript: The Definitive Guide', by David Flanagan and
    published by O'Reilly. -->
    <script src="rhea.js"></script>
    </head>

    <body>
    <input type="text" id="request" style="width:100%"/>
    <script>
    var server = prompt("Enter details of server to use", "ws://localhost:5673");
    var input = document.getElementById("request");
    input.focus();

    function append(txt) {
    var node = document.createTextNode(txt);
    var div = document.createElement("div");
    div.appendChild(node);
    document.body.insertBefore(div, input);
    input.scrollIntoView();
    }
    input.onchange = function() {
    sender.send({"body":input.value});
    input.value = "";
    };

    var client = new(require("rhea"))();
    client.on("message", function (context) {
    append(context.message.body);
    });
    var ws = client.websocket_connect(WebSocket);
    var connection = client.connect({"connection_details":ws(server, ["AMQPWSB10"]), "reconnect":false});
    connection.open_receiver("examples");
    var sender = connection.open_sender("examples");

    </script>
    </body>
    </html>

    Continue reading...
     
Thread Status:
Not open for further replies.

Share This Page

LiveZilla Live Chat Software