It is really frustrating as I am not able to resolve this issue of Application error. The app is up and running however when I try to access via azure URL, it gives the application error. Help would be appreciated
The error message
No issue in the logs, app is up and running
Your webapp is deployed on the Linux platform, and it is temporarily unclear what language your webapp is written in from the log.
Regarding the problem of Application Error, we usually add Startup Command to solve this problem.
Prerequisites:
Make sure that the port defined in the code uses the process.env.PORT parameter.
Example: In the nodejs project, when we are testing locally, we can define it like this:
const port = 8081 || process.env.PORT.
Then we need to add the startup command.
① If it is a vue project, the recommended command is
pm2 serve /home/site/wwwroot --no-daemon --spa
②If it is react or angular, it is recommended to use
npx serve -s
If you are using Python, you can refer to the following document.
Configure a custom startup file for Python apps on Azure App Service
Related
The pipelines and releases seem to work finely as they get the artifact deployed on the app service or so it seems as the output error happens on start of the PM2 process.
I haven't found anything on this error on google, and don't know if there is a way to update PM2 on the app service machine as PM2 itself suggests.
These are the logs.
Error message
summary image
I was expecting the app to work and no longer show an application error as I fixed both build and release pipelines.
This is a picture of the important bit of info of the error as its really long
Check the below steps to run nextjs with PM2.
First create a nextJS app.
Run npm run dev command to run the app in development.
Deploy the app to Azure Linux App Service.
Open the SSH of the Azure App Service to run the PM2 commands.
We can open directly with the below URL.
Path to SSH - https://YourDeployedAppName.scm.azurewebsites.net/
OR
Navigate to the deployed Azure Linux App => Advanced Tools => Go => SSH.
Run the below command to install PM2.
npm install pm2 -g
Thanks #Azure OSS Developer Support for the commands.
In Configuration section => General Settings add the Startup command.
pm2 start site/root/index.js --name mynpmnextapp
Your path may differ for the index.js file.
My app entry point is index.js.For some apps it can be server.js.Change it according to your app.
cannot find module `../build/output/log'
Make sure you are not running the PM2 with the output folder. As mentioned above it has to be the entry point either server.js or index.js based on your code files.
don't know if there is a way to update PM2 on the app service
In the KUDU Console use npm install pm2#latest -g to update the PM2.
References taken from MSDoc and npmjs.
I have a React SPA which runs in Azure Web Apps, Node stack (Node 16 LTS), via the startup command:
pm2 serve /home/site/wwwroot --no-daemon --spa
I would like to add a response header (specifically, a Content-Security-Policy header) for every outgoing request.
Things I have tried:
adding a .htaccess file
adding a web.config file
looking for an evironment setting, or way to configure either pm2, or node
I don't have any node code to change (so I can't add headers there), and doing it in React feels "too late" - I think it's something that node on the server, or Azure needs to do.
My nuclear option is to wrap Front Door around it and do it there, but I'm hoping there is way to achieve this without that.
In App Service Linux, React application can be started with PM2, npm start or custom command.
The container automatically starts your app with PM2 when one of the common Node.js files is found in your project:
Also Note that Starting from Node 14 LTS, the container doesn't automatically start your app with PM2. To start your app with PM2, set the startup command to pm2 start <.js-file-or-PM2-file> --no-daemon.
Be sure to use the --no-daemon argument because PM2 needs to run in the foreground for the container to work properly.
Reference: https://learn.microsoft.com/en-us/azure/app-service/configure-language-nodejs?pivots=platform-linux
I am deploying a react web app on azure by creating a workflow on github.
Now after committing changes it shows an error on creating build as:
The same error occured when I was deploying it using surge.sh
Can anyone help me out?
It seems to be a problem related to the Node.js module in your repository. Therefore, I suggest you do the following
Part 1: Reinstall the Node module
yarn uninstall
yarn install
Part 2: Redeploy the project via GitHub Action
Part 3: Deploy the React app directly from Azure Portal
Adding to Mark's response. Try the following steps to further narrow-down the issue:
-Please check if there is a .deployment file in the root of the repository, and provide this file if present, along with the deploy._ file if present (deploy.cmd, deploy.sh, deploy.ps1).
-Just to isolate, test the deployment directly from your local Git repository to a new App Service.
--If a .deployment and deploy.sh file are included in the root directory of the app code, Kudu will use the legacy build to run the commands specified in the deploy.sh script.
--Just to highlight on this, Kudu is the engine behind Git deployments on both Windows and Linux. By default, App service uses Oryx to build/install and Kudu will determine type of stack is used and creates a generic deploy.sh script to install the packages.
-App Service sets the environment variable PORT in the Node.js container, and forwards the incoming requests to your container at that port number. your app should listen to that port using process.env.PORT
const port = process.env.PORT || 3000
1.Add a start-up script: Add the PM2 configuration file or your script file
2.Go to Azure Configuration>General Settings
If your build folder is at the root of the project:
Start up command: pm2 serve /home/site/wwwroot --no-daemon --spa
Certain web frameworks may use custom startup scripts when running in production mode.
Refer this doc Customize build automation for more details.
I'm trying to deploy an Angular CLI app to Azure App Service on Linux OS, using Azure Dev Ops - but no success. I get Image 1. No error in the server or application logs.
This is what I done so far:
Built the Angular CLI app using DevOps Build and placed the resulted "dist" folder to the "drop" folder. See below (Image 2) the tasks that compose my build. This is working fine and creating the expected files.
Created a release in DevOps, deploying all the dist files in the wwwroot folder in the Azure App Service in Linux. Shown below are both, the wwwroot folder (left) and my local dist folder (right) after I run a ng build --prod.
I have the suspicion that I need to kickstart the angular by feeding some time of command when doing the deployment. I have tried running "ng serve --host 0.0.0.0" but that didn't work.
Check the Azure App Service > Linux section on this page. Essentially, you have to serve the app. You can configure this with a ecoysystem.config.js PM2 file in the root directory, with this inside.
module.exports = {
apps: [
{
script: "npx serve -s"
}
]
};
I also added npx serve -s in the App Service Configuration > General Settings > Startup Command
See also: https://burkeholland.github.io/posts/static-site-azure
I had to give the npx serve -s as the startup command
Then set the Runtime Stack with node framework 10.16 (NODE|10.16). See below
Then everything started working.
If you still want to use App Service - Web App you can just the Windows OS instead of Linux.
Here are the parameters I Used:
Since the output of building angular is a static web app, IIS will serve the site right away.
When using Linux App Service container, you may also select PHP stack containing Apache2 Server. Since, Angular files are static ones (JS, CSS, HTML), so you just need some web server to serve this content.
Example configuration:
If you look at the default 'Deploy Node.js App to Azure App Service' release template, it uses the 'Deploy Azure App Service' task and adds the following commands to the task. this might help you out.
There is a subtle and big difference between the Linux and Windows App service: IIS - which in Windows is actively looking to serve any app, whereas in Linux you have to spin up something on your own to serve it - Express for example.
After some research I discovered that I don't need a full App service dedicated to run a static app (such as Angular or React). It can be done just as efficiently and much cheaper with something like Storage. -> https://code.visualstudio.com/tutorials/static-website/getting-started
I had the same problem on Azure App Service with Linux and Node, solved it using below startup command
pm2 serve /home/site/wwwroot --no-daemon --spa
I am trying to deploy an application I am building with the MEAN stack to Heroku and am having some trouble. I think the issue is with the structure of my application. I have all my server code in a folder called server, which has its own package.json and src folder that contains the actual server code.
Right now I am simply trying to get Heroku to deploy the client side of the application. I am only getting an error... I know that the database and server are not running but I cannot even get past the initial displaying of the app. I have one web dyno set up to run ng serve (npm start) on the app.
If someone would be willing to look at the structure of my application and sees why I am unable to deploy to Heroku without really digging into the code, that would be much appreciated.
Here is the code
Please note that it is on the deploy branch, and this is on purpose. I do not want to push anything to the master until I am sure it is working.
The Angular web server targets localhost:4200 by default. That can be changed with a couple command-line options. --port accepts a port and --host accepts a host IP address.
So you could modify the ng serve script as follows: ng serve --host [host-ip] --port [port-number] --disableHostCheck. That last flag (--disableHostCheck) tells the dev server to bypass host checking when normally ng serve fails on anything except localhost. Terrible idea if meant for anything except private development/testing.
Another issue: Heroku runs off web dynos and from what I understand about them, they use a random port and IP each time. While the random port is stored under the variable $PORT, the IP does not seem to have a similar variable. Web dynos keep that information to themselves.
Heroku does offer this command: heroku local web. It runs your application on localhost:5000. That means ng serve --port 5000 works perfectly with this command. This should tell you how your front-end will run on Heroku. Your angular dev server will function as expected too.
For actual deployment to Heroku, use that express server of yours. Run ng build from your file system and it will spit out an index.html in the dist folder. This file holds your entire front-end application. You can then upload that file into your browser from the server.
For express that usually breaks down into:
app.get('*', function(req, res) {
res.sendFile('path/to/index.html');
});
Hopefully this helps! Let me know if I missed the mark anywhere.