As title.
I am developing ASP.Net core project with react.js, and deployed the project to a physical folder in my computer. Assume that my IP is a.b.c.d, I want to deploy it as application under default web site, and set a virtual path point to the physical folder where I deploy my project. That is, I want to show my project result when I open a browser and key in http://a.b.c.d/MyvirtualPath inside my address bar.
I've tried a way that to set PUBLIC_URL but I didn't see anything on my browser, and what I found about deploying onto IIS is to publish as a website, and that is not what I want.
Could someone guide me to achieve this?
If you want to deploy a React application under the default website, you should not use a virtual directory but add an application under the default website:
Another point to note is that if IIS wants to host asp.net core applications, you need to install .NET Core Hosting Bundle. For more information about it, you can refer to this link.
Related
How to publish ASP.NET 6 Web API with React Project to IIS
I followed this MS tutorial for creating an ASP.NET Core project with a React front-end - https://learn.microsoft.com/en-us/visualstudio/javascript/tutorial-asp-net-core-with-react?view=vs-2022. I choose the option to create my client app in a separate project outside of the ASP.NET core project.
I am trying to publish my project to a local IIS server but I’m running into a few snags.
I’ve followed the instructions in the Publish the project section of the same guide. When I follow those steps, my web api project and dependencies are deployed to the root of my IIS project folder, and the react web files are placed in a wwwroot directory within my IIS project folder. If I navigate to the site, I get a can’t reach this page.
I was under the impression that my single asp.net app could host both the react web files as well as my web API. If I should be deploying the react app and the web API to separate sites within IIS, what is the most effective way to update all my API paths in react once deployed? Right now all my web api calls are relative links “/api/resourcesA”. Finding this all a bit confusing as someone coming from Razor Pages and MVC.
From what I gather I will also need to update the “homepage” property in package.json to my site’s URL, and I will also need to install and configure a URL rewriter as I am using react-router. However, I feel like I am getting stuck before getting to these steps. Any advice/direction appreciated.
I refer to the document(https://learn.microsoft.com/en-us/visualstudio/javascript/tutorial-asp-net-core-with-react?view=vs-2022) on my side and I am able to reproduce the said issue.
It might create confusion as its combines the React project and .Net Core API in the single folder while publishing it.
You could refer to the steps below may help to fix the issue.
I assume that your project is running successfully from the VisualStudio and showing the data.
Go to Program.cs file and add these 2 lines.
app.MapFallbackToFile("index.html");
app.UseStaticFiles();
It should look like below.
For simplicity, try to publish it to Folder.
While creating the site in the IIS, set physical path like below.
While setting physical path, Select the site folder(don't select the wwwroot folder in it).
Visit the site in the browser.
I have been working on this app on my localhost, which has Flask as the backend (localhost:5000) and React as the front end (localhost:3000), and they have been communicating well. Now I am supposed to put it up online so that other ppl can see it as well - I didn't have much experience in Azure, but how can I deploy these two components(React&Flask) into one URL on Azure web app service? (Before I had some experience in using FTP to upload the 'build' folder to a "site/wwwroot" folder to put up a simple React app without any backend)
Newest
After testing, the python project is deployed in the webapp, the react project is deployed in the virtual application, and the normal node project is also deployed in the virtual application.
Deploy the flask python project to the windows environment, the normal deployment method will fail, please be sure to follow this blog document (third-party document) to operate, it works for me.
Running Flask app with HttpPlatformHandler in Azure App Services
The effect is shown in the figure. You can see that the normal node project can be accessed normally, but the react project is not. I think there are some bugs. (Has raised a support ticket to confirm)
The deployment method of virtual application is recommended to adopt the publishing method shown in the figure below.
Privious
It is recommended to choose windows when creating azure web app, because windows supports virtual application.
We can deploy flask app normally and deploy react app in virtual app.
Under normal circumstances, the process.env.port of the two webapps is the same and will not interfere with each other because of the virtual path.
Reference post:
1. Vue Frontend and Express backend on same Azure web app Service
2. Azure Front Door Is Not Maintaining Custom Domain in Browser
I have a react JS web app hosted on firebase.
I would like to know how to deploy different versions of the web app.
Example myapp.com/1.0.0 and then another version myapp.com/ -> being the main version
Firebase Hosting represents your public directory exactly as-is. If you want to deploy different "versions" of your app to the same Firebase Hosting site, you'll need to have some kind of process that can put all of the versions you want to deploy into a directory structure and deploy the whole thing.
I created a new react app and also a new project on Visual Studio: .NET Framework Web Application, under my Azure subscription.
What should be the process so when I run the Web Application locally, I will see the new react app and not the ASP.NET screen ?
I deployed the new react app to azure so when I run the website I do see the new react app, however when I run it from the .sln file, I get this screen:
Thanks in advance!
I think the step you missed is to update the Index view which is used to generate the website root to include the bootstrapping of the React app. It should be located at Views/Home/Index.cshtml or Pages/Index.cshtml, depending on the template you used when you created the project.
As a side note, I would consider dropping the ASP.Net project entirely and just use VS Code for the React app, through there you can easily deploy your app to an Azure Storage Account using the new Static website hosting in Azure Storage, thus removing the need for an ASP.Net website.
Hope it helps!
HI I m new to google app engine,and I want to know is there an option in app engine to create a installer package of a project which can be deployed in other google app domains.So basically project will not be hosted publically but only for particular google app domains
An analogy I m looking here is salesforce package,where a developer can create a package url,through which package can be installed in other orgs. The project is not hosted publically. http://appexchange.salesforce.com/
You can package your source easily. The only variable that needs to change is in app.yaml application: field in python and appengine-web.xml in java. This will allow you to deploy the app in other domains.
As far as the package url that isn't how App Engine works. You can set your application to allow only certain domains to access it and provide an API for integrating it into another application, but that is different than Sales Force package url.
When developing a Google App Engine application you don't have to specify the url of the project. So you can install and deploy your application to several organizations or even subprojects.
The only thing you need to set is the application name in the app.yaml (in case you are using python) or appengine-web.xml (for java)
So for developing an installer I would create a script that first asks the user for the name of the application they want to deploy to, modifying the configuration files accordingly, and then calls the normal appcfg.py installer.