Running ASP.NET Boilerplate template under virtual directory











up vote
0
down vote

favorite












I have an Angular template created by ASP.NET Boilerplate. I have published it successfully and it is running smoothly on IIS under a website. My client, however, wants to have it run under a Virtual Directory rather than a website for itself.
enter image description here



I have updated the appconfig.json as below:



{
"remoteServiceBaseUrl": "http://localhost:8080/Training",
"appBaseUrl": "http://localhost:8080/Training"
}


and did the same with App in the appSettings.json:



"App": {
"ServerRootAddress": "http://localhost:8080/Training/",
"ClientRootAddress": "http://localhost:8080/Training/",
"CorsOrigins": "http://localhost:8080/Training"
}


For some reason, when I run the app, I get the following errors that it cannot load some CSS and JavaScript bundles:
enter image description here



I have manually changed the index.html in the wwwroot folder and added http://localhost:8080/Training/ to the beginning of each href. By doing that, all those errors have gone and now I am left with this error:



GET http://localhost:8080/assets/appconfig.json 404 (Not Found)


Which I think is related to the AppPreBootstrap.ts file, where it reads from the appconfig.json file.



Do I have to make any changes in the application settings somewhere, before publishing it, to get rid of the above issues?










share|improve this question




























    up vote
    0
    down vote

    favorite












    I have an Angular template created by ASP.NET Boilerplate. I have published it successfully and it is running smoothly on IIS under a website. My client, however, wants to have it run under a Virtual Directory rather than a website for itself.
    enter image description here



    I have updated the appconfig.json as below:



    {
    "remoteServiceBaseUrl": "http://localhost:8080/Training",
    "appBaseUrl": "http://localhost:8080/Training"
    }


    and did the same with App in the appSettings.json:



    "App": {
    "ServerRootAddress": "http://localhost:8080/Training/",
    "ClientRootAddress": "http://localhost:8080/Training/",
    "CorsOrigins": "http://localhost:8080/Training"
    }


    For some reason, when I run the app, I get the following errors that it cannot load some CSS and JavaScript bundles:
    enter image description here



    I have manually changed the index.html in the wwwroot folder and added http://localhost:8080/Training/ to the beginning of each href. By doing that, all those errors have gone and now I am left with this error:



    GET http://localhost:8080/assets/appconfig.json 404 (Not Found)


    Which I think is related to the AppPreBootstrap.ts file, where it reads from the appconfig.json file.



    Do I have to make any changes in the application settings somewhere, before publishing it, to get rid of the above issues?










    share|improve this question


























      up vote
      0
      down vote

      favorite









      up vote
      0
      down vote

      favorite











      I have an Angular template created by ASP.NET Boilerplate. I have published it successfully and it is running smoothly on IIS under a website. My client, however, wants to have it run under a Virtual Directory rather than a website for itself.
      enter image description here



      I have updated the appconfig.json as below:



      {
      "remoteServiceBaseUrl": "http://localhost:8080/Training",
      "appBaseUrl": "http://localhost:8080/Training"
      }


      and did the same with App in the appSettings.json:



      "App": {
      "ServerRootAddress": "http://localhost:8080/Training/",
      "ClientRootAddress": "http://localhost:8080/Training/",
      "CorsOrigins": "http://localhost:8080/Training"
      }


      For some reason, when I run the app, I get the following errors that it cannot load some CSS and JavaScript bundles:
      enter image description here



      I have manually changed the index.html in the wwwroot folder and added http://localhost:8080/Training/ to the beginning of each href. By doing that, all those errors have gone and now I am left with this error:



      GET http://localhost:8080/assets/appconfig.json 404 (Not Found)


      Which I think is related to the AppPreBootstrap.ts file, where it reads from the appconfig.json file.



      Do I have to make any changes in the application settings somewhere, before publishing it, to get rid of the above issues?










      share|improve this question















      I have an Angular template created by ASP.NET Boilerplate. I have published it successfully and it is running smoothly on IIS under a website. My client, however, wants to have it run under a Virtual Directory rather than a website for itself.
      enter image description here



      I have updated the appconfig.json as below:



      {
      "remoteServiceBaseUrl": "http://localhost:8080/Training",
      "appBaseUrl": "http://localhost:8080/Training"
      }


      and did the same with App in the appSettings.json:



      "App": {
      "ServerRootAddress": "http://localhost:8080/Training/",
      "ClientRootAddress": "http://localhost:8080/Training/",
      "CorsOrigins": "http://localhost:8080/Training"
      }


      For some reason, when I run the app, I get the following errors that it cannot load some CSS and JavaScript bundles:
      enter image description here



      I have manually changed the index.html in the wwwroot folder and added http://localhost:8080/Training/ to the beginning of each href. By doing that, all those errors have gone and now I am left with this error:



      GET http://localhost:8080/assets/appconfig.json 404 (Not Found)


      Which I think is related to the AppPreBootstrap.ts file, where it reads from the appconfig.json file.



      Do I have to make any changes in the application settings somewhere, before publishing it, to get rid of the above issues?







      javascript iis aspnetboilerplate virtual-directory base-url






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Nov 10 at 8:13









      aaron

      7,90331130




      7,90331130










      asked Nov 7 at 7:49









      Mohammad Shadmehr

      618




      618
























          1 Answer
          1






          active

          oldest

          votes

















          up vote
          0
          down vote













          Ensure that appRootUrl ends with '/' in AppPreBootstrap.ts:



          private static getApplicationConfig(appRootUrl: string, callback: () => void) {
          appRootUrl += appRootUrl.endsWith('/') ? '' : '/'; // Add this line
          return abp.ajax({
          url: appRootUrl + 'assets/' + environment.appConfig,
          // ...
          }).done(result => {
          // ...
          });
          }





          share|improve this answer





















          • My getApplicationConfig method is like this: private static getApplicationConfig(callback: () => void) { return abp.ajax({ url: '/assets/appconfig.json', method: 'GET', headers: { 'Abp.TenantId': abp.multiTenancy.getTenantIdCookie() } }).done(result => { AppConsts.appBaseUrl = result.appBaseUrl; AppConsts.remoteServiceBaseUrl = result.remoteServiceBaseUrl; callback(); }); } What should I pass for the appRootURL param?
            – Mohammad Shadmehr
            yesterday










          • What is the evironment.appConfig?
            – Mohammad Shadmehr
            yesterday










          • Which version of the template is that?
            – aaron
            yesterday











          Your Answer






          StackExchange.ifUsing("editor", function () {
          StackExchange.using("externalEditor", function () {
          StackExchange.using("snippets", function () {
          StackExchange.snippets.init();
          });
          });
          }, "code-snippets");

          StackExchange.ready(function() {
          var channelOptions = {
          tags: "".split(" "),
          id: "1"
          };
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function() {
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled) {
          StackExchange.using("snippets", function() {
          createEditor();
          });
          }
          else {
          createEditor();
          }
          });

          function createEditor() {
          StackExchange.prepareEditor({
          heartbeatType: 'answer',
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader: {
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          },
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          });


          }
          });














           

          draft saved


          draft discarded


















          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53185356%2frunning-asp-net-boilerplate-template-under-virtual-directory%23new-answer', 'question_page');
          }
          );

          Post as a guest
































          1 Answer
          1






          active

          oldest

          votes








          1 Answer
          1






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes








          up vote
          0
          down vote













          Ensure that appRootUrl ends with '/' in AppPreBootstrap.ts:



          private static getApplicationConfig(appRootUrl: string, callback: () => void) {
          appRootUrl += appRootUrl.endsWith('/') ? '' : '/'; // Add this line
          return abp.ajax({
          url: appRootUrl + 'assets/' + environment.appConfig,
          // ...
          }).done(result => {
          // ...
          });
          }





          share|improve this answer





















          • My getApplicationConfig method is like this: private static getApplicationConfig(callback: () => void) { return abp.ajax({ url: '/assets/appconfig.json', method: 'GET', headers: { 'Abp.TenantId': abp.multiTenancy.getTenantIdCookie() } }).done(result => { AppConsts.appBaseUrl = result.appBaseUrl; AppConsts.remoteServiceBaseUrl = result.remoteServiceBaseUrl; callback(); }); } What should I pass for the appRootURL param?
            – Mohammad Shadmehr
            yesterday










          • What is the evironment.appConfig?
            – Mohammad Shadmehr
            yesterday










          • Which version of the template is that?
            – aaron
            yesterday















          up vote
          0
          down vote













          Ensure that appRootUrl ends with '/' in AppPreBootstrap.ts:



          private static getApplicationConfig(appRootUrl: string, callback: () => void) {
          appRootUrl += appRootUrl.endsWith('/') ? '' : '/'; // Add this line
          return abp.ajax({
          url: appRootUrl + 'assets/' + environment.appConfig,
          // ...
          }).done(result => {
          // ...
          });
          }





          share|improve this answer





















          • My getApplicationConfig method is like this: private static getApplicationConfig(callback: () => void) { return abp.ajax({ url: '/assets/appconfig.json', method: 'GET', headers: { 'Abp.TenantId': abp.multiTenancy.getTenantIdCookie() } }).done(result => { AppConsts.appBaseUrl = result.appBaseUrl; AppConsts.remoteServiceBaseUrl = result.remoteServiceBaseUrl; callback(); }); } What should I pass for the appRootURL param?
            – Mohammad Shadmehr
            yesterday










          • What is the evironment.appConfig?
            – Mohammad Shadmehr
            yesterday










          • Which version of the template is that?
            – aaron
            yesterday













          up vote
          0
          down vote










          up vote
          0
          down vote









          Ensure that appRootUrl ends with '/' in AppPreBootstrap.ts:



          private static getApplicationConfig(appRootUrl: string, callback: () => void) {
          appRootUrl += appRootUrl.endsWith('/') ? '' : '/'; // Add this line
          return abp.ajax({
          url: appRootUrl + 'assets/' + environment.appConfig,
          // ...
          }).done(result => {
          // ...
          });
          }





          share|improve this answer












          Ensure that appRootUrl ends with '/' in AppPreBootstrap.ts:



          private static getApplicationConfig(appRootUrl: string, callback: () => void) {
          appRootUrl += appRootUrl.endsWith('/') ? '' : '/'; // Add this line
          return abp.ajax({
          url: appRootUrl + 'assets/' + environment.appConfig,
          // ...
          }).done(result => {
          // ...
          });
          }






          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Nov 10 at 8:02









          aaron

          7,90331130




          7,90331130












          • My getApplicationConfig method is like this: private static getApplicationConfig(callback: () => void) { return abp.ajax({ url: '/assets/appconfig.json', method: 'GET', headers: { 'Abp.TenantId': abp.multiTenancy.getTenantIdCookie() } }).done(result => { AppConsts.appBaseUrl = result.appBaseUrl; AppConsts.remoteServiceBaseUrl = result.remoteServiceBaseUrl; callback(); }); } What should I pass for the appRootURL param?
            – Mohammad Shadmehr
            yesterday










          • What is the evironment.appConfig?
            – Mohammad Shadmehr
            yesterday










          • Which version of the template is that?
            – aaron
            yesterday


















          • My getApplicationConfig method is like this: private static getApplicationConfig(callback: () => void) { return abp.ajax({ url: '/assets/appconfig.json', method: 'GET', headers: { 'Abp.TenantId': abp.multiTenancy.getTenantIdCookie() } }).done(result => { AppConsts.appBaseUrl = result.appBaseUrl; AppConsts.remoteServiceBaseUrl = result.remoteServiceBaseUrl; callback(); }); } What should I pass for the appRootURL param?
            – Mohammad Shadmehr
            yesterday










          • What is the evironment.appConfig?
            – Mohammad Shadmehr
            yesterday










          • Which version of the template is that?
            – aaron
            yesterday
















          My getApplicationConfig method is like this: private static getApplicationConfig(callback: () => void) { return abp.ajax({ url: '/assets/appconfig.json', method: 'GET', headers: { 'Abp.TenantId': abp.multiTenancy.getTenantIdCookie() } }).done(result => { AppConsts.appBaseUrl = result.appBaseUrl; AppConsts.remoteServiceBaseUrl = result.remoteServiceBaseUrl; callback(); }); } What should I pass for the appRootURL param?
          – Mohammad Shadmehr
          yesterday




          My getApplicationConfig method is like this: private static getApplicationConfig(callback: () => void) { return abp.ajax({ url: '/assets/appconfig.json', method: 'GET', headers: { 'Abp.TenantId': abp.multiTenancy.getTenantIdCookie() } }).done(result => { AppConsts.appBaseUrl = result.appBaseUrl; AppConsts.remoteServiceBaseUrl = result.remoteServiceBaseUrl; callback(); }); } What should I pass for the appRootURL param?
          – Mohammad Shadmehr
          yesterday












          What is the evironment.appConfig?
          – Mohammad Shadmehr
          yesterday




          What is the evironment.appConfig?
          – Mohammad Shadmehr
          yesterday












          Which version of the template is that?
          – aaron
          yesterday




          Which version of the template is that?
          – aaron
          yesterday


















           

          draft saved


          draft discarded



















































           


          draft saved


          draft discarded














          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53185356%2frunning-asp-net-boilerplate-template-under-virtual-directory%23new-answer', 'question_page');
          }
          );

          Post as a guest




















































































          這個網誌中的熱門文章

          Post-Redirect-Get with Spring WebFlux and Thymeleaf

          Xamarin.form Move up view when keyboard appear

          JBPM : POST request for execute process go wrong