0

I have 2 apps running in containers running on the same docker network.

One app provides some JSON data via its web api, while the other reads it. The app that is doing the reading is a node.js app that uses a bundler (parcel.js). Both apps are running in the same network and I can ping one container from another container by using their names.

Ok, so now when I'm defining the api endpoint url from where the data should be read I expected to set the url domain part as the docker service name, but instead I get a response only when setting the domain as localhost:<docker_exposed_port>!

Not only is it possible, but it is the only why I can read the API! Why must I read from localhost?

I'm guessing it has something to do with the app being bundled by parcel.js and it being run in my browser?

docker-compose.yml:

version: "3.1"

services:
  prometheus:
    image: prom/prometheus:latest
    ports:
    - 9090:9090
    volumes:
    - ./SimpleMicroService/prometheus.yml:/etc/prometheus/prometheus.yml
    networks:
      - my_app_network
      
  pixi:
    build: ./Visualizer
    image: pixi:latest
    ports:
      - 7001:1234
      - 1235:1235
    environment:
      - "CHOKIDAR_USEPOLLING=1"
    networks:
      - my_app_network
    volumes:
    - ./Visualizer/src:/usr/src/app/src

networks:
  my_app_network:
    driver: bridge

package.json:

{
  "name": "pixitest",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "test": "jest",
    "start": "npm run clean && parcel src/index.html --hmr-port 1235",
    "build": "npm run clean && parcel build src/index.html --public-url ./",
    "build_serve": "npm run build && http-server ./dist",
    "clean": "rimraf ./dist ./.cache"
  },
  "author": "Llorenç Pujol Ferriol",
  "license": "MIT",
  "dependencies": {
    "pixi.js": "~5.3.3"
  },
  "devDependencies": {
    "@types/jest": "~26.0.15",
    "@types/pixi.js": "^5.0.0",
    "babel-preset-es2015": "~6.24.1",
    "http-server": "~0.12.3",
    "jest": "~26.6.3",
    "parcel-bundler": "~1.12.4",
    "rimraf": "~2.6.2",
    "ts-jest": "~26.4.4",
    "typescript": "~4.0.5"
  }
}

How I read API data :

add() first param is the name under which to store the loaded resource ("foo") and url as the second param. load() param is a callback for when all data has been read

this.loader
            .add("foo", "http://localhost:9090/api/v1/query?query=rate(application_request_sent_total[1m])*60")
            .load((loader, resources) => {console.log(resources.foo)}); // works, but why??
Tadija Bagarić
  • 2,495
  • 2
  • 31
  • 48
  • 1
    I think you are confusing between a browser's localhost v/s the code localhost. When you have JS code open it browser, it's localhost is still your host machine and which is where you are port mapping the `prometheus` service too. This is the reason one use reverse proxy solutions like `nginx` – Tarun Lalwani Apr 07 '21 at 06:47
  • Ok, lets say I'm using 2 asp.net apps, both in docker and both exposing a port to my host machine. If I'd want them to communicate, I can't just set one to read the other over my host's localhost since docker containers do not have access to host's localhost. Which is expected docker behaviour. Here, this principal is broken, but I don't understand why – Tadija Bagarić Apr 07 '21 at 06:52
  • 1
    To restate what @TarunLalwani said: your code _isn't_ running in Docker. The `http-server` inside a container is serving the code to the browser, and your code is running in the browser, outside of Docker. – David Maze Apr 07 '21 at 10:21
  • 1
    As @DavidMaze said, it will differ for UI code which run out of docker context and for server side code, you will use the service names – Tarun Lalwani Apr 07 '21 at 11:59

0 Answers0