|
| 1 | +--- |
| 2 | +layout: post |
| 3 | +title: Deploy a Blazor Web App to Linux with NGINX | Syncfusion |
| 4 | +description: Learn here all about deploying the Blazor Web App with Syncfusion Blazor Components to Linux server using NGINX. |
| 5 | +platform: Blazor |
| 6 | +component: Common |
| 7 | +documentation: ug |
| 8 | +--- |
| 9 | + |
| 10 | +# Deploy Blazor Web App to Linux with NGINX |
| 11 | + |
| 12 | +This section provides information about deploying a Blazor Web applications with the Syncfusion Blazor components to Linux server using NGINX as a reverse proxy. |
| 13 | + |
| 14 | +Refer to [Host ASP.NET Core on Linux with Nginx](https://learn.microsoft.com/en-us/aspnet/core/host-and-deploy/linux-nginx?view=aspnetcore-9.0&tabs=linux-ubuntu) topic for more information. |
| 15 | + |
| 16 | +## Install and Start NGINX |
| 17 | + |
| 18 | +Install NGINX on your Linux system and enable it to start automatically: |
| 19 | + |
| 20 | +```bash |
| 21 | +sudo dnf install nginx |
| 22 | +sudo systemctl start nginx |
| 23 | +sudo systemctl enable nginx |
| 24 | +sudo systemctl status nginx |
| 25 | +``` |
| 26 | + |
| 27 | +**Verification**: Open `http://your-server-ip` in a browser — you should see the NGINX welcome page. |
| 28 | + |
| 29 | +## Publish Your Blazor Web App with Syncfusion Components |
| 30 | + |
| 31 | +Publish your Blazor Web application in Release configuration and run it: |
| 32 | + |
| 33 | +```bash |
| 34 | +dotnet publish -c Release -o publish |
| 35 | +cd publish |
| 36 | +dotnet SfBlazorApp.dll --urls "http://0.0.0.0:5000" |
| 37 | +``` |
| 38 | + |
| 39 | + |
| 40 | + |
| 41 | +## Configure NGINX to Proxy Requests |
| 42 | + |
| 43 | +Create a new NGINX configuration file for your Blazor application: |
| 44 | + |
| 45 | +```bash |
| 46 | +sudo nano /etc/nginx/conf.d/blazorapp.conf |
| 47 | +``` |
| 48 | + |
| 49 | +Add the following configuration to enable NGINX to act as a reverse proxy: |
| 50 | + |
| 51 | +```nginx |
| 52 | +server { |
| 53 | + listen 80; |
| 54 | + server_name _; |
| 55 | + location / { |
| 56 | + proxy_pass http://localhost:5000; |
| 57 | + proxy_http_version 1.1; |
| 58 | + proxy_set_header Host $host; |
| 59 | + proxy_set_header X-Real-IP $remote_addr; |
| 60 | + proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; |
| 61 | + proxy_set_header X-Forwarded-Proto $scheme; |
| 62 | + proxy_set_header Upgrade $http_upgrade; |
| 63 | + proxy_set_header Connection "upgrade"; |
| 64 | + } |
| 65 | +} |
| 66 | +``` |
| 67 | + |
| 68 | +Save and exit the file (Ctrl+O, Enter, then Ctrl+X). |
| 69 | + |
| 70 | +## Validate and Restart NGINX |
| 71 | + |
| 72 | +Test the NGINX configuration and restart the service: |
| 73 | + |
| 74 | +```bash |
| 75 | +sudo nginx -t |
| 76 | +sudo systemctl restart nginx |
| 77 | +``` |
| 78 | + |
| 79 | +## Configure SELinux (For Red Hat-based Systems) |
| 80 | + |
| 81 | +On Red Hat-based systems, SELinux may block NGINX from accessing your Blazor app. Allow NGINX to connect to network services: |
| 82 | + |
| 83 | +```bash |
| 84 | +sudo setsebool -P httpd_can_network_connect 1 |
| 85 | +``` |
| 86 | + |
| 87 | +## Access the Application |
| 88 | + |
| 89 | +From your Windows machine or any other device, open a browser and navigate to: |
| 90 | + |
| 91 | +``` |
| 92 | +http://<your-vm-ip>/ |
| 93 | +``` |
| 94 | + |
| 95 | +You should now see your Blazor Web app running successfully with Syncfusion components! |
| 96 | + |
| 97 | + |
| 98 | + |
| 99 | +## See also |
| 100 | + |
| 101 | +* [Host ASP.NET Core on Linux with Nginx](https://learn.microsoft.com/en-us/aspnet/core/host-and-deploy/linux-nginx?view=aspnetcore-9.0) |
| 102 | +* [Configure NGINX for ASP.NET Core](https://learn.microsoft.com/en-us/aspnet/core/host-and-deploy/linux-nginx?view=aspnetcore-9.0#configure-nginx) |
0 commit comments