Why Removing a AWS Security Group Rule Does Not Stop Traffic Flow

Here’s the situation.  I created an AWS Security Group inbound rule to allow Ping, which allows me to ping an EC2 instance from my home computer. The issue is that when I remove the Ping inbound rule, Ping requests are still receiving a response.  I expect that when I remove the Ping inbound rule, the responses should stop.

In this post, I will reproduce the issue and show you that this is a feature of AWS Security Groups and not a bug.

Initial Setup:

  • 1 VPC 192.168.0.0 /16
  • 1 AZ
  • 1 EC2 Instance with public IP – 54.245.15.244
  • Internet Gateway (IGW)
  • Route
    • 0.0.0.0/0 -> igw-a664ec1
      • All traffic can pass through IGW
    • 192.168.0.0/16 -> local
      • All resources can talk to other resources within the IP Range
  • Security Group assigned to EC2 Instance is empty

There are no inbound Rules for Security Group WBC-Web.  No traffic will be permitted

Even though this EC2 instance has a Public IP, no inbound traffic should reach this instance since this instance is associated the Security Group WBC-Web with no Inbound Rules.

Let’s Validate this Setup

From my home computer, if I ping the EC2 instance, I will receive a “request time out.” message

There is no response since the Security Group has no inbound rules.

Create Inbound Ping Rules

In AWS console, I added the inbound rule to Security Group WBC-Web to allow ping from all IP addresses.

Now if I try to ping the EC2 instance, I will receive a response.

The Confusion

If I remove the Security Group inbound ping rule, I continue to receive a response, which I do not expect. I expect the ping should timeout.

To demonstrate this, I will run ping with the -t option. This will keep ping running until I cancel it manually.

I will start the ping before I remove the ping rule.

In the image below, the red line marks the point when I removed the ping inbound rule.  After I remove the ping inbound rule, a response is still returned.

I stopped the ping and started the ping to see if I would still receive a response, which I did receive a response.

I stop the ping again and waited a minute before starting it again. This time the ping finally timed out.

So What’s Going On

For Security Groups there is a feature called Connection Tracking.  Connection Tracking is used to track information to and from an instance.

When there’s a flow of traffic, for our example a ping, and the security group inbound rule is removed, the flow of traffic will not be stopped by the removal of the inbound rule.  The traffic is interrupted when it’s stopped on the client or the host for at least a few minutes.

Removing the ping inbound rule while traffic is flowing will not interrupt or stop the flow of traffic. You must first stop the ping on the client or host and wait at least 1 minute before the removal of the inbound rule will take affect.

I believe Amazon does a better job of describing this.

Not all flows of traffic are tracked. If a security group rule permits TCP or UDP flows for all traffic (0.0.0.0/0) and there is a corresponding rule in the other direction that permits all response traffic (0.0.0.0/0) for all ports (0-65535), then that flow of traffic is not tracked. The response traffic is therefore allowed to flow based on the inbound or outbound rule that permits the response traffic, and not on tracking information.

TCP traffic on port 22 (SSH) to and from the instance is tracked, because the inbound rule allows traffic from 203.0.113.1/32 only, and not all IP addresses (0.0.0.0/0). TCP traffic on port 80 (HTTP) to and from the instance is not tracked, because both the inbound and outbound rules allow all traffic (0.0.0.0/0). ICMP traffic is always tracked, regardless of rules.

An existing flow of traffic that is tracked may not be interrupted when you remove the security group rule that enables that flow. Instead, the flow is interrupted when it’s stopped by you or the other host for at least a few minutes (or up to 5 days for established TCP connections). For UDP, this may require terminating actions on the remote side of the flow. An untracked flow of traffic is immediately interrupted if the rule that enables the flow is removed or modified. For example, if you remove a rule that allows all inbound SSH traffic to the instance, then your existing SSH connections to the instance are immediately dropped.

Security Group – Connection Tracking

http://docs.aws.amazon.com/AWSEC2/latest/UserGuide/using-network-security.html#security-group-connection-tracking

It’s important to understand that if the traffic is being tracked and is flowing then removing an allow rule will not stop the traffic.

The following are a few way to stop the traffic.

  1. Create a Network Access Control List (ACL) inbound rule
  2. On the instance, disable the communication type or block the port
  3. Delete the Security Group

While learning about AWS Security Groups, I ran into this situation and was very confused. It took a lot of digging to understand what was going on.  I hope that this will help others and that others will not go through the pain I went through.

Update – Saturday, Nov 11, 2017

This does not seem relevavent to SSH connections.  As soon as I remove an SSH inbound rule the SSH connection is terminated.  I assume SSH and RDP rules would function similarly.

 

Kick-start: Create a Linux(Ubuntu) Environment for Windows Developers using VirtualBox, VSCode, Git, NodeJS

I enjoy working with Visual Studio Code (VSCode). Since it’s available for Linux and Mac, I thought I would give it a try in a different environment. As a Windows developer, I’ve wanted to try out Linux. In the past when I have attempted to work in Linux, I was overwhelmed with all the tools, configuration and such that must be learned to be productive.

I had a very difficult time finding beginner information that is current of setting up a Linux development environment. I found bits and pieces but nothing that showed end-to-end of how to get started.

In this post, I will describe how to setup a development environment in Linux (Ubuntu). The main technologies I will work with are the following:

  • Oracle VirtualBox – 5.1.14
  • Linux Ubuntu 64-bit: 16.04
  • Visual Studio Code (VSCode): 1.9.1
  • NodeJS: 6.9.5
  • Git: 2.7.4

This post is about setting up a basic Linux (Ubuntu) development environment.  I assume that the user is familiar with Windows and has very basic knowledge of hypervisor software to manage virtual machines.

I’m using Windows 10 as my host system. I don’t believe it should matter what host you are using, because other than VirtualBox, everything in this post will be installed on Linux Ubuntu.

Installing VirtualBox

We need somehow to run Ubuntu. To do this we need a Hypervisor. A hypervisor is software that runs virtual machines. There are many hypervisors available (Hyper-V, VMWare, VirtualBox, etc). I have selected Oracle VirtualBox for the following reasons:

  • Runs on Windows
  • Free for personal use
  • Easy to use
  • Very popular
  • Large Community

Let’s install VirtualBox by going to VirtualBox webpage:

https://www.virtualbox.org/wiki/Downloads

VirtualBaox Download
VirtualBaox Download

Once at the VirtualBox Download webpage, download VirtualBox

After downloading VirtualBox,  install it.

VirtualBaox Install
VirtualBaox Install

 Download Linux Ubuntu Desktop

When we create our virtual machine using VirtualBox we will need an image (iso) of Ubuntu to install. We will get this iso from Ubuntu’s website. It’s important that you download the desktop version of Ubuntu. Download Ubuntu Desktop from here:
Continue reading “Kick-start: Create a Linux(Ubuntu) Environment for Windows Developers using VirtualBox, VSCode, Git, NodeJS”

Super Simple systemJS Module Loader Tutorial

I’m currently in the process of building a new web application.  I want to use a module loader.  I have used Required as a AMD loader, but with ES2015 (ES6) around the corner and supports module loading, I would like to use something that is somewhat future proof.  So, I’ve decided to investigate SystemJS.

To learn SystemJS , I wanted to create a very simple application with no frills and uses ES5. Once I have this figured out, I will start using ES6 and/or TypeScript.

SystemJS

SystemJS is a universal module loader.  It can load modules synchronously or asynchronously.  In this post I’m going to load a very simple global module dynamically. SystemJS can load these additional modual formats:

  • esm: ECMAScript Module (previously referred to as es6)
  • cjs: CommonJS
  • amd: Asynchronous Module Definition
  • global: Global shim module format
  • register: System.register or System.registerDynamic compatibility module format

Assumption of Reader

I assume the reader has the following knowledge

  • Some knowledge node.js and npm
  • JavaScript
  • Chrome Developer Tools

I assume that since you want to learn about systemJS, which is a more advanced tool, that you understand NPM and how to install
libraries using package.json.  I also assume you know how to create a server to run the examples on.  In this example, I’m using HTTP-Server that I installed using NPM.

Tools and Version I used

Here’s the structure of the application

image

  • package.json: is used to install systemJS
  • .gitmore: can be ignored.  It’s used with Git source code repository.
  • node_modules: where npm installs systemJS
  • main.js: the module to be dynamically loaded and execute by systemjs

All source code can be found here:

Example without using systemJS: https://github.com/BarDev/Learning-SystemJS/tree/b.1.0

Example using systemJS:https://github.com/BarDev/Learning-SystemJS/tree/b.1.1

First run “npm install”. This will look in package.json and find dependencies to install.  The only client dependency that is required is systemjs.

npm install

package.json with systemJS

file structure with systemJS

Let’s now display a very simple HTML page.  Here’s the code:

Let’s do a a sanity check to validate that the server is working. You can use any server. I have decided to use http-server for it’s simplicity and no bloat.  Below in the images, you will notice I install http-server globally, and then ran it by just call “http-server”.  I then load the page using the port that http-server provided.

npm install http-server;

image

confirm htpp-server is run

Everything should be working now.

Let’s create a module. I’m using the term module somewhat loosely here.  Since the code is in a separate file, systemJS will treat it like a module. Here I’m using the Revealing Module Pattern.

Let’s create a new folder called app and add the file main.js. Here’s the code to include in main.js.

global module

We aren’t using systemJS and not doing module loading yet, but we will soon. For the time being, let’s see how main.js is loaded.

Add a reference in index.html to main.js. This can be added in the <head> element.  Then add the script that calls the domUpdater after the last div.  The script must be after the div, because of how the HTML page loads and is executed.
index html without using systemJS

Lets run the web page and see how the modules are loaded.  In the image below you will see that in Chrome Developer Tools, I added a breakpoint in the index.html. This allows me to see what files have been loaded in the network tab. As we can see the main.js file has been loaded. The main.js file is loaded as soon as the page is loaded. Imagine if you had 20 files that need to be loaded. Bundling can take care of this somewhat; but what if you had multiple bundles and not all bundles are needed when the page loads?

debug web page without systemJS

Now let’s do some module loading using systemJS.

In index.html, remove the script in the Head that is referencing main.js.  Also remove the script after the div that is calling domUpdated

Now we need to add the systemJS library and load mainJS using SystemJS.

In index.html, reference the system.js file in the <head>.

index.html with systemJS and module loading

Now, refresh the page and put a breakpoint on the console.debug, and refresh again.  If you look at the Network tab in Chrome Developer Tools, you will see that main.js has not been loaded yet.

debug module loading and systemJS

Continue the application and you will see in the network tab that main.js is loaded dynamically in the process..

debug systemJS and dynamic module loading

Resources

Duck Typing

In this post I will describe Duck Typing in regards to dynamic languages (JavaScript, PHP, Python, Ruby).

If you ever read or heard about Duck Typing, you have probably seen the following quote:

If it walks like a duck and quacks like a duck, it must be a duck.

Without context, this quote doesn’t mean much.  Hopefully at the end of this post the previous quote will make much more sense.

Below is an excerpt from Wikipedia.  Without understanding Duck Typing, the following excerpt doesn’t make much sense either.

Duck Typing requires that type checking is deferred to runtime, and is implemented by means of dynamic typing or reflection.

Duck typing is concerned with establishing the suitability of an object for some purpose. With normal typing, suitability is assumed to be determined by an object’s type only. In duck typing, an object’s suitability is determined by the presence of certain methods and properties (with appropriate meaning), rather than the actual type of the object.

https://en.wikipedia.org/wiki/Duck_typing

Duck Typing in JavaScript – Dynamic Language

In the following examples, we are going to create following 3 different objects in JavaScript

  • point2D
  • point3D 
  • me

All three objects  will include properties: name,  x and y, they  also include a calculate() function.  The Me object will include the properties occupation and birthDate. See image below for a visualization for object model.

image

In the code below, I created the three object (point2D, point3d, me).  I also created a function called calculate() for each object.  The calculate() function for all the objects returns a string. 

There is a displayPoint() function defined.  This function could just have been called display().  The function displayPoint() has one parameter called “point”.   The function signature looks like this:

function displayPoint(point)

The parameter name “point” doesn’t mean anything.  I could have called it “obj”.  I called the function “displayPoint” and the parameter “point” because contextually the function is created to work with points.  Even though I created the function displayPoint(point) to work with points, but I can pass any type of object as a parameter in to the function.

In function displayPoint(point) the code accesses the property “name” and the method “calculate()” of the object “point”. It doesn’t matter what type of object is passed in to the function “displayPoint”, but the object must have the property “name” and the method “calculate()” to run without an error.

This is Duck Typing.

What is the “me” object? Is it a person or a point – both, neither?  What do the properties x and y represents.  The properties x and y could represent a point, but they could also be pointers (reference) to XY chromosomes.  But in this context of the method “displayPoint”, the object “me”, and the properties x and y are points and treated like points.

Now, the following quote has context. I hope it makes more sense now.

If it walks like a duck and quacks like a duck, it must be a duck.

Resources

Visual Studio Code, AngularJs, & Intellisense

My primary goal is to get VSCode intellisense to work with AngularJs.

I’m working on a new application and I’m developing it with AngularJS (Angular 1). I’m also using VSCode (Visual Studio Code) as the IDE. My understanding is that VSCode should provide intellisense for JavaScript code, which it does. In the following image, you can see that VSCode provides intellisense for the variable “d”. VSCode is smart enough to see that this is a string and displays a list of string functions to select from.

image

Since I’m developing with AngularJS, I would like to have intellisense here also.  In the index.html page, I have reference to my AngularJs library, but in my JavaScript file intellisense is not working as expected.

image

To get intellisense working for AngularJS in VSCode.  The following steps need to occur

  1. Install node.js typings package globally
  2. Run typings and install AngularJS types
  3. Create a jsconfig.json file

Assumptions of reader

  • Have knowledge of node.js and npm

Tools and version

  • node.js 6.2.1
  • npm 3.9.5
  • Visual Studio Code 1.2
  • Windows

1. The Situation

I’m creating an AngularJS application.  I have two files index.html and module.js.  The index.html file references angular.js library and module.js. The module.js file is where the JavaScript and Angular 1.5 component will live.

image

image

By default, VSCode provides intellisense for JavaScript.  In the following image you will notice that the variable “d” is a string and that VSCode provides intellisense  based on the context of “d” being a string.

image

In module.js, when I enter “angular.” I expect that intellisense to display a list of AngularJS methods and properties, but as you can see in the image below, this does not occur.  My goal in this blog post is to have intellisense display AngularJS methods and properties.

image

2. Install typings package

The typings package needs to be installed.  Since this package will be used for this solution and others.  I want to install it globally.  First lets’ see what packages are installed currently on the computer.

To figure out what packages are installed globally, run the following command.

npm list -g –depth=0

This command will return all packages at a root depth and not include any children or dependencies of the base packages.

image

As we can see the typings package has not been install. Let’s install it globally.

npm install -g typings

SNAGHTML75b4fe

Now that we installed typings it should now be available to use.  Notice the version of typing is 1.3.0.

image

3. Install AngularJS types

When I initially attempted to install angular typings, I received the following error (see image). This worked just a few days ago. But I install typings 1.3.0. and my typing install didn’t use the same format as pre typings 1.0 used.  You can read more about that here Updating Typings From 0.x to 1.0?

image

To install angular typings, I had to enter the following command:

typings install dt~angular –save –global

image

When the angular typing is installed the typings.json file and a folder called typings should be created.  See image below for more information .

image

4. Create a jsconfig.json file

Now create an empty jsconfig.json file.

image

If we were using TypeScript and transpiling code, then this file would contain configuration. But since we are only need intellisense to work, this file can remain empty

5. Validate if Intellisense is working for Angular

Go back to the module.js file. Enter “angular.”.  The intellisense should now display AngularJS methods and properties.

image

Resources

KickStart – C# Custom Configuration

This post will provide an example and explanation of how to create custom configuration for C# applications. I will discuss ConfigurationSections, ConfigurationElements, ConfigurationElementCollection. Also I will discuss how to nest these items together. My plan is to take very small steps; implementing each part of the configuration individually.

By the end of the post we will be able to navigate a custom configuration similar to the following config file:

Assumption

  • Good understanding of C#
  • Good understanding Visual Studio – I’m will be using VS 2012
  • .NET 3.5 and higher
  • Basic understanding of configuration files

The application we are going to create is quite contrived. The school settings that we will store in the config file would usually be stored in a database, but I want to provide a domain that most people understand.

Our Domain

A School has
A Name
A Address
Zero or More Courses
A Course has
A Title
An Optional Instructor
Zero or More Students
A Student has
A StudentId

We are going to create a Windows Console application. All it’s going to do is display values from the config file. When we are completed with the application it will display something similar to this:

Continue reading “KickStart – C# Custom Configuration”

Kick-Start: Bower – A Simple Tutorial of Setting-Up and Using Bower.JS

The goal of this post is to provide a simple description of how to install Bower JS and how to use Bower JS to manage client side dependencies. The first time I tried to use Bower I had problems. Hopefully this tutorial will provide others a complete resource to navigate around the issues that I found.

Assumptions:

  • You are a Windows developer
  • You will use the Windows Command Prompt instead of Bash
  • You have little or no knowledge of Node.js
  • You have little or no knowledge of GIT

1. Download and install Node.js

To run Bower you will need to download and install Node.js. Go to http://nodejs.org/ website and select the “install” button (see image below). This should download the version of Node.js you need. For me, when I clicked the “install” the version for Windows 64-bit downloaded. Once Node.js is download, execute the file.

I will not go thought the steps for installing Node.js; it’s very straight forward. During the install I used all default options.

Continue reading “Kick-Start: Bower – A Simple Tutorial of Setting-Up and Using Bower.JS”

Understanding AngularJS – Simple Example

I did a similar post as this post for Backbone.js Understanding Backbone.js – Simple Example. Based on readers’ comments the backbone.js post seemed to assist many people. My goal with this post is to help others understand the core parts of AngularJS and how they work together.

The AngularJS application that we are building will display a list of movies and will have the ability to add movies. We could create this application with very minimum code, but extensibility and maintainability will be limited. My primary objective is to show how to structure an AngularJS application that provides a base of knowledge to create other AngularJS applications extensible and maintainable.

My target audience will have some knowledge about AngularJS, but are having a difficult time implementing all but the most basic applications. By simple, I mean you should only have to focus on AngularJS. We will not be using jQuery, Twitter Bootstrap, or other 3rd party libraries.

We could create this application with just a controller and a view. But in this post I will describe the following core AngularJS features:

  • Routes
  • Modules
  • Views
  • Controllers
  • Services

Above I mentioned I will keep this post simple, but we do need a web server. The AngularJS Theater application will load views and data (json files) from the server. I would like to do these examples by access “file:///E:/TempProjects/Theater/index.html#/” on local computer, but most browsers cannot access these files on local computer do to Cross Origin issues. Here a StackOverflow question and answer that describes this issue: Cross origin requests are only supported for HTTP but it’s not cross-domain. So we need a web server. Any web server will do, such as IIS, Node.js and Express or other server. In this example I will be using Node.js and Express. You will not need to know anything about Node.js; all that is need is for you to install Node.js and to execute a script that I will provide. I will step you through the complete process to get Node.js and Express up and running.

Google Chome will be the browser I use, but any current browser should work fine. The reason I pick Chome is for its development tools. I will be developing in JetBrains WebStorm IDE, but any IDE or text editor should be fine.

This post will be based on a contrived idea of displaying a list of movies at a theater. There is nothing fancy here.

The complete solution can be downloaded from here:
Source – Understand-AngularJS-Simple Example(Theater)

Based on comments from Hasan this example works with AngularJS 1.1.5. It does not work with AngularJS 1.2.3.

Continue reading “Understanding AngularJS – Simple Example”

How I Navigated to AngularJS

This article is about the process I’ve gone through of selecting AngularjS as my MV* JavaScript framework of choice. I will discuss the evolution I went through from learning jQuery, Knockout, Backbone.js, and eventually settling on AngularJS.

I’ve been programming in JavaScript since the late 90′s. JavaScript is not going anywhere. JavaScript is very popular today, and I believe it will only get more popular. For programming a browser, JavaScript is the least common denominator. This is the only language that all Browsers support. But, JavaScript has many pitfalls; just read the book JavaScript: The Good Parts by Douglas Crockford. In the early years, I used JavaScript mostly for validation and simple DOM manipulation. Writing different code for each browser sucked. Back in the early years JavaScript seemed like a toy, there weren’t many best practices and the expectations of what could be accomplished with JavaScript was limited.
Continue reading “How I Navigated to AngularJS”

Setting-up AngularJS, Angular Seed, Node.js and Karma

I’ve used AngularJS for a few months, but I have no knowledge when it comes to testing AngularJS apps. I have a subscription to PluralSight.com and wanted to go through their online video training course for AngularJS. Specifically with this course I want to learn how to use Karma to do testing.

I’m usually extremely happy with PluralSight.com course, but in the beginning of this course I was somewhat disappointed. In Section 7 (“Angular Seed”) new technologies were introduced. The author introduced Angular-Seed, Node.js and Karma. I’ve worked with Node.js, but there are probably many people who have never used it. I believe the author took for granted that the student knew Node.js. For those who have never used Node.js this could be an obstacle.

When I started the course I didn’t have Node.js installed. I installed Node.js and things didn’t work as intended. I couldn’t run tests in Node.js because Karma was not installed. Once I installed Karma, Chrome wouldn’t launch in the tests.

With all the issues I was having, I wondered if others were having the same problems. If others were having similar issues, were they discouraged and not continuing with the course. So I decided to create this blog post to help others to get stared with AngularJS, Angular-Seed, Node.js and Karma.

Here are my assumptions:

  • You are a windows developer
  • Google Chrome browser is installed
  • You will use the Windows Command Prompt instead of Bash
  • You have little or no knowledge of Node.js
  • You have little or no knowledge of Karma
  • You will use Node.js as the web server. I will step you through this.
  • You have access to and IDE. Visual Studio will be fine. NotePad++ would also probably work. I use JetBrains WebStorm. JetBrains has a free 30 day trial for WebStorm.

Here are the high level step we will follow:

  1. Download and install Angular-Seed
  2. Download and install JetBrains WebStorm (Optional)
  3. Download and install Node.js
  4. Confirm Node.js is installed
  5. Run Karma Unit Tests – will fail because Karma is not installed
  6. Install Karma
  7. Run Karma Unit Tests again – Will fail because Chrome will not start
  8. Add System Variable to Windows
  9. Confirm System Variable Were Added
  10. Run Unit Tests again – should succeed
  11. Confirm that Units are being tracked by Karma
  12. Start Web Server by using Node.js

Continue reading “Setting-up AngularJS, Angular Seed, Node.js and Karma”