1

I am trying to deploy dockerized React JS application (uses ngnix) on MS Azure App Service (Web application as Container/Web App). Using Azure Container Registry for the same.

Here is my Dockerfile

FROM node:14.17.0 as build
WORKDIR /app
ENV PATH /app/node_modules/.bin:$PATH
COPY package.json ./
COPY package-lock.json ./

RUN npm ci --silent
RUN npm install react-scripts -g --silent
COPY . .
RUN npm run build 

#prepare nginx
FROM nginx:stable-alpine
COPY --from=build /app/build /usr/share/nginx/html

#fire up nginx
EXPOSE 80
CMD ["nginx","-g","daemon off;"]

Able to run image as container on local machine and working perfectly.

docker run -itd --name=ui-container -p 80:80 abc.azurecr.io:latest

But problem starts after running the image on Azure App Service/ Container Service due to it is not able to ping the port. ERROR - Container didn't respond to HTTP pings on port: 80, failing site start. See container logs for debugging

This is the docker run command available on App service logs

docker run -d --expose=80 --name id_0_f8823503 -e WEBSITES_ENABLE_APP_SERVICE_STORAGE=false -e WEBSITES_PORT=80 -e WEBSITE_SITE_NAME=id -e WEBSITE_AUTH_ENABLED=False -e WEBSITE_ROLE_INSTANCE_ID=0 -e WEBSITE_HOSTNAME=id.azurewebsites.net -e WEBSITE_INSTANCE_ID=af26eeb17400cdb1a96c545117762d0fdf33cf24e01fb4ee2581eb015d557e50 -e WEBSITE_USE_DIAGNOSTIC_SERVER=False i.azurecr.io/ivoyant-datamapper

I see the reason is there is no -p 80:80 found in above docker run command. I have tried multiple approaches to fix this but nothing worked for me. Tried adding key: PORT value: 80 in configuration app settings key: WEBSITES_PORT value: 80 in configuration app settings

E_net4
  • 27,810
  • 13
  • 101
  • 139
Nagaraj S Kharvi
  • 73
  • 1
  • 2
  • 12

3 Answers3

1

Another good pointer is that builds from the newer M1/M2 chips will fail too. Wasted a great afternoon in App Service until I decided to go to Container App and finally found myself an error message indicating this issue:

The following field(s) are either invalid or missing. Field 
'template.containers.xxx.image' is invalid with details: 'Invalid 
value: "xxx.azurecr.io/frontend:latest": image OS/Arc must be 
linux/amd64 but found linux/arm64';. (Code: 
InvalidParameterValueInContainerTemplate)
Niels Uitterdijk
  • 713
  • 9
  • 27
0

App Service listens on port 80/443 and forwards traffic to your container on port 80 by default. If your container is listening on port 80, no need to set the WEBSITES_PORT application setting. The -p 80:80 parameter is not needed.

You would set WEBSITES_PORT to the port number of your container only if it listens on a different port number.

Now, why does App Service reports that error? It might be that your app fails when starting. Try enabling the application logs to see if you'll get more info.

CSharpRocks
  • 6,791
  • 1
  • 21
  • 27
0

Replaced

FROM node:14.17.0 as build

with

FROM node:19-alpine as build

Application was deployed successfully in Azure with success response. Usage of non alpine image caused the issue in Azure App Service.

Nagaraj S Kharvi
  • 73
  • 1
  • 2
  • 12