NGINX configure Websocket in NginX – how to make it available

In the proxy.conf file, at the top, write:

upstream websocket {
        server name_of_my_docker_container:8080;
}

map $http_upgrade $connection_upgrade {
        default upgrade;
        '' close;
}

server {...

Why this? The Websocket has a constantly open connection with the client. The communication lies above the http protocol. This why we need to enable an „upgrade“ of the connection.

This example addresses a name of a Docker container. It would work with any other url too.

server {
      location / {...
      }
      ...	
      location name_of_my_docker_container {
		rewrite name_of_my_docker_container/(.*) /$1  break;
		proxy_set_header X-Real-IP $remote_addr;
		proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
		proxy_set_header X-NginX-Proxy true;
		proxy_ssl_session_reuse on;
		proxy_set_header Host $http_host;
		proxy_cache_bypass $http_upgrade;
		proxy_redirect off;
		proxy_set_header X-Forwarded-Proto "http";
		proxy_pass http://name_of_my_docker_container:8080;
		
                // These headers need to be set in order 
                // to enable the communication:
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection "Upgrade";

		proxy_set_header Connection '';
		proxy_http_version 1.1;
		chunked_transfer_encoding off;
		proxy_buffering off;
		proxy_cache off;
	}

Calculation Errors and Mistakes in Java – How to calculate correctly

This is a real world example on which money was lost by client. This was not explicable, but I managed to analyze and reconstruct the problem.

The Code you are about to see is NOT the production code, but my own reconstruction of it, with a means to show the problem.

 @Test
    public void testWrong() {

        // GIVEN
        final Integer price = -595;
        final Integer someUnit = 90;

        // WHEN
        int multiplicationResult = price * someUnit;
        // = -53550


        Integer resultAmount = multiplicationResult / 100;
        // = -535
        // …Division failed,
        // decimal places ignored...

        // THEN
        assertTrue(resultAmount == -535);
        // Wrong. Correct: -536.
    }

The specification on which the primitives and float are defined do not allow a correct calculation (mistake 1).

Although primitives cause the most trouble in calculation programming for many people, this example would have worked, if the return type of „multiplicationResult“ would be a double (mistake 2).

But experience shows that even these basics are quite often the main reason for calculation mistakes in Java, so I always recommend a certain way of calculating to avoid them, which I will show below.

@Test
public void testCorrect() {

        // GIVEN
        final Integer price = -595;
        final Integer someUnit = 90;
        // WHEN
        BigDecimal priceBD = new BigDecimal(price);
        BigDecimal someUnitBD = new BigDecimal(someUnit);
        BigDecimal hundred = new BigDecimal(100);

        BigDecimal multiplicationResult = priceBD.multiply(someUnitBD); // = -53550

        // = -535.5 - looks great.
        BigDecimal resultAmountBD = multiplicationResult.divide(hundred);


        final int noDecimalPlaces = 0;
        // rounding mode is vital to get a correct result
        final RoundingMode roundingMode = RoundingMode.HALF_UP;

        // do not forget to define the decimal places...0
        BigDecimal result = resultAmountBD.setScale(noDecimalPlaces, roundingMode);

        // THEN
        assertThat(result.toBigInteger().intValue(), equalTo(-536)); // Correct!

    }

The Big Decimal is calculated by using a String representation. Calculation is done piece by piece. Thus, the specification of float and primitives in general cannot interfere and cause calculation mistakes through number spaces, computing practices of the CPU etc..

Standard IEEE 754 defines Exception Handling and number spaces. It defines, how float and double is processed. Floating Points are meant to approach a certain precision, but without being 100% accurate. It is equivalent to Math/Analysis lambda, which is marking a barrier to come close to, which is never really reached (infinite lambda for instance).

In Summary:

  • Division, multiplication must be done by using a wrapper like BigDecimal.
  • Decimal Places have to be defined
  • Rounding modes have to be defined
  • In case that multiple systems are calculating together (e.g. bank or any other financial institution or software), a contract has to be agreed on. The contract must state how many decimal places are to be used (retail does often use 3 decimal places but only shows 2 on the displays in the shelves). Also the rounding mode plays a vital role in calculation.
  • Never use primitives, even if you are sure that in ‚your specific case‘ it is sufficient
  • Also experienced programmers make these mistakes, which is why I am posting this in my Blog.

Chrome – add insecure origins as secure

  1. Navigate to `chrome://flags/#unsafely-treat-insecure-origin-as-secure` in Chrome.
  2. Find and enable the `Insecure origins treated as secure` section (see below).
  3. Add any addresses you want to ignore the secure origin policy for. Remember to include the port number too (if required).
  4. Save and restart Chrome.

CSS Grid Layout Example – Visible Structure – Easy Tutorial

4 Items, stretched with different sizes across a Matrix 4×4 grid.

You can see the Grid structure in the CSS in this example.

Picture:

CSS:

.item-a {
    grid-area: itemA;
    border: 1px solid violet;
}
.item-b {
    grid-area: itemB;
    border: solid 1px cyan;
}
.item-c {
    grid-area: itemC;
    border: solid 1px yellow;
}
.item-d {
    grid-area: itemD;
    border: solid 1px red;
}

.container {
    height: 100%;
    border: solid 1px green;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    grid-template-areas:
            "itemA itemA itemC itemC"
            "itemA itemA itemC itemC"
            "itemA itemA itemD itemD"
            "itemA itemA itemD itemD";

HTML (in this example a React JS Grid):

return (
        <Grid className={"container"}>
            <Grid item className={"item-a"}></Grid>
            <Grid item className={"item-b"}></Grid>
            <Grid item className={"item-c"}></Grid>
            <Grid item className={"item-d"}></Grid>
        </Grid>
    );