Base solution for your next web application
Open Closed

How to publish merged angular & .Net Core solution to Azure? #5476


User avatar
0
brallierc created

I have been looking at documentation here and also on aspnetboilerplate but I cannot find any guide on what steps you need to take to publish the "one solution" approach to Azure. Any help would be much appreciated.


14 Answer(s)
  • User Avatar
    0
    aaron created
    Support Team
  • User Avatar
    0
    maliming created
    Support Team

    <a class="postlink" href="https://aspnetzero.com/Download">https://aspnetzero.com/Download</a> Downloaded options: One Solution (Merged AngularUI and Host project)

    Read this document to publish to the Azure. <a class="postlink" href="https://aspnetzero.com/Documents/Step-by-step-publish-to-azure-angular">https://aspnetzero.com/Documents/Step-b ... re-angular</a>

  • User Avatar
    0
    brallierc created

    The documentation only shows examples of the settings for seperate web applications. It says that if you are using the merged solution then you only need to publish the host, does that mean I dont need to do the steps you would typically do to publish the angular cluent?

    If anyone has the exact steps to publish a merged .net core/angular solution to a single azure web application service I would very much appreciate it.

  • User Avatar
    0
    maliming created
    Support Team

    You only need to publish the host project, When the Host is compiled, it will automatically build angular.

  • User Avatar
    0
    brallierc created

    Ok... so what about the appSettings? Do I need to use different ports? I feel like there must be some steps missing because I tried a fresh copy of 5.6.1 and I cant get it to work once I publish to azure

  • User Avatar
    0
    brallierc created

    Actually I cannot get it to publish as a fresh solution because ng build --prod fails. So it would seem I still need to do the steps of npm install and installing the angular cli?

    It seems that just because the Host compiles does not mean it does everything necessary to allow me to publish.

  • User Avatar
    0
    maliming created
    Support Team

    Try to manually execute npm install in the Host directory.

    If you encounter any errors after deploying to Azure, please send out the relevant error details.

  • User Avatar
    0
    brallierc created

    If I manually run npm install in the Host project directory, the ng build -prod command runs successfully when I publish. It publishes to Azure, but when I navigate to the page afterwards it shows an error:

    An error has occurred! Error detail not sent by server.

    So I am going back to my original question, do I need to make any specific settings changes? Do I need to use a URL with a port for the server root address or client root address? Can they be the same URL? I am not aware how you can use a separate port on an Azure web application, they only use ports 80 and 443.

  • User Avatar
    0
    maliming created
    Support Team

    "An error has occurred!" Please take a look at the log. Generally in App_Data/Logs/Logs.txt.

    Yes, you can modify the URL or port in appsettings.production.json depending on the needs of the production environment.

  • User Avatar
    0
    brallierc created

    I know I can modify the Client and Server Root URLs, what I am asking is... Can they be the same URL?

    For example, if my ServerRootAddress is: <a class="postlink" href="http://test.mycompany.com">http://test.mycompany.com</a> can my ClientRootAddress be the same?

    I have looked at the Application Log and Web Server Log stream and nothing is in them.

  • User Avatar
    0
    maliming created
    Support Team

    They can be the same URL.

  • User Avatar
    0
    brallierc created

    Great! So then I have followed all instructions...

    1. modified constants file in Core.Shared to turn off multi-tenancy (this is optional, but I am not building a multi-tenant solution so for me it makes sense)
    2. modified appSettings in Host project root and also src/assets to reflect domain name I want to use
    3. modified appSettings in Host project with the connection string to the SQL Azure database
    4. ran npm install against Host project directory from the command prompt
    5. created a publish profile for my Azure web application service
    6. published to my Microsoft Azure Web Application

    -- Publish was successful --

    I can navigate to swagger (test.mycompany.com/swagger) and it appears as it should -> Success

    However, when I navigate to the root url: test.mycompany.com, i receive a modal with the following error: An error has occurred! Error detail not sent by server.

    I have made sure that logging is turned on for my app service, it is, but the logs are empty. It seems like a client side issue.

  • User Avatar
    0
    brallierc created

    I found the problem...

    After looking at all the files loaded on the client side, it appears the solution was loading appsetting.production.json, I had not edited that file in the src/assets folder and so it was still pointing to localhost. Once I updated that and re-published, that solved the problem.

    Thanks all for your help

  • User Avatar
    0
    maliming created
    Support Team

    Congratulations :D