Over a million developers have joined DZone.

POST Request Logger Using WebSockets

DZone's Guide to

POST Request Logger Using WebSockets

In this article, the we work to create a simple HTTP by emitting a WebSocket instead of logging the request.

· Integration Zone ·
Free Resource

WSO2 is the only open source vendor to be named a leader in The Forrester Wave™: API Management Solutions, Q4 2018 Report. Download the report now or try out our product for free.

I’ve been working with background geolocation with an ionic application. There’s a cool plugin to do that. The free version of the plugin works fine, but here’s also a premium version with improvements, especially in battery consumption with Android devices.

Basically, this plugin performs a POST request to the server with the GPS data. When I was developing my application, I needed a simple HTTP server to see the POST requests. Later, I’ll code the backend to handle those requests. I can develop a simple Silex application with a POST route and log the request in a file or flush those request to the console. This would have been easy, but as far as I’m a big fan of WebSockets (yes, I must admit that I want to use WebSockets everywhere), I had one idea in my mind. The idea was to create a simple HTTP server to handle my GPS POST requests but instead of logging the request I will emit a WebSocket. Then I can create one site that connects to the WebSocket server and register on screen the POST request. OK, today I’m a bit lazy to fight with the frontend, so my log will be on the browser’s console.

To build the application I’ll reuse one of my projects in GitHub: The PHP dumper. The idea is almost the same. I’ll create a simple HTTP server with Silex with two routes. One to handle POST requests (the GPS ones) and another GET to allow me to connect to the WebSocket

That’s the server. Silex, a bit of Twig, another bit of Guzzle and that’s all!

use GuzzleHttp\Client;
use Silex\Application;
use Silex\Provider\TwigServiceProvider;
use Symfony\Component\HttpFoundation\Request;

$app = new Application([
    'debug'       => true,
    'ioServer'    => '//localhost:8888',
    'wsConnector' => ''

$app->register(new TwigServiceProvider(), [
    'twig.path' => __DIR__ . '/../views',

$app['http.client'] = new Client();

$app->get("/{channel}", function (Application $app, $channel) {
    return $app['twig']->render('index.twig', [
        'channel'  => $channel,
        'ioServer' => $app['ioServer']

$app->post("/{channel}", function (Application $app, $channel, Request $request) {
    $app['http.client']->get($app['wsConnector'] . "/info/{$channel}/" . json_encode($request->getContent()));

    return $app->json('OK');


That’s the Twig template. Nothing especial: A bit of Bootstrap and one socket.io client. Each time user access to one “channel's” URL (GET/mychannel). It connects with the WebSocket server:

var CONF = {
        IO: {HOST: '', PORT: 8888},
        EXPRESS: {HOST: '', PORT: 26300}
    express = require('express'),
    expressApp = express(),
    server = require('http').Server(expressApp),
    io = require('socket.io')(server, {origins: 'localhost:*'})

expressApp.get('/:type/:session/:message', function (req, res) {
    var session = req.params.session,
        type = req.params.type,
        message = req.params.message;

    io.sockets.emit('dumper.' + session, {title: type, data: JSON.parse(message)});

io.sockets.on('connection', function (socket) {
    console.log("Socket connected!");

expressApp.listen(CONF.EXPRESS.PORT, CONF.EXPRESS.HOST, function () {
    console.log('Express started');

server.listen(CONF.IO.PORT, CONF.IO.HOST, function () {
    console.log('IO started');

And each time background geolocation plugin POSTs GPS data Silex POST route will emit a WebSocket to the desired channel. Our WebSocket client just logs the GPS data using console.log. Is hard to explain but very simple process.

We also can emulate POST requests with this simple node script:

var request = require('request');

request.post('http://localhost:8080/Hello', {form: {key: 'value'}}, function (error, response, body) {
    if (!error && response.statusCode == 200) {

And that’s all. You can see the whole code within my GitHub account!

IAM is now more than a security project. It’s an enabler for an integration agile enterprise. If you’re currently evaluating an identity solution or exploring IAM, join this webinar.

integration ,websockets ,post request

Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}