title: Use a different server on a page Angular
body: <p>I am trying to implement a chat to a view on my Angular / NodeJS website.</p>
  
  <p>The <code>website</code> is deployed on a server running on port 4200, the <code>backend</code> runs on 8000 and for now the <code>chat</code> socket.io template runs on 3000.</p>
  
  <p>I have followed the socket.io's official chat tutorial in detail so I have a functionnal chat page that works on port 3000 but how can I implement it to an Angular component?</p>
  
  <p>Here is my code so far:</p>
  
  <p><code>server.js</code>:</p>
  
  <pre><code>const app = require('express')();
  var http = require('http').Server(app);
  var http2 = require('http').Server(app);
  var io = require('socket.io')(http2);
  
  http.listen(8000, function(){
    console.log('listening on *:8000');
  });
  http2.listen(3000, function(){
    console.log('listening on *:3000');
  });
  
  const home = require('./home.js');
  const chat = require('./chat.js');
  
  // SOCKET.IO for testing purpose, following the tutorial
  app.get('/', function(req, res){
    res.sendFile(__dirname + '/socket.html');  
  });
  
  io.on('connection', function(socket){
    ...
  });
  </code></pre>
  
  <p><code>chat.component.html</code>:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt; 
  &lt;body&gt;
  
  ...
  
  &lt;div class="bottom"&gt;
    &lt;form action=""&gt;
      &lt;input id="m" class="messageInput" autocomplete="off"/&gt;
      &lt;button type="button" class="btn btn-primary btn-lg btn-block"&gt;SEND&lt;/button&gt;
    &lt;/form&gt;
  &lt;/div&gt;
  
  &lt;script src="/socket.io/socket.io.js"&gt;&lt;/script&gt;
  &lt;script src="https://code.jquery.com/jquery-1.11.1.js"&gt;&lt;/script&gt;
  &lt;script&gt;
      $(function () {
        var socket = io();
        $('form').submit(function(e){
          e.preventDefault(); // prevents page reloading
          socket.emit('chat message', $('#m').val());
        $('#m').val('');
          return false;
        });
        socket.on('chat message', function(msg){
          $('#messages').append($('&lt;li&gt;').text(msg));
        });
      });
    &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I can't figure out to make the chat 'module' work on my HTML page without accessing it through a route (<code>app.get('/', function(req, res){ res.sendFile(__dirname + '/socket.html') });</code></p>
  
  <p>What can I do? Thanks! And sorry for being a noob :p</p>