0

I have deployed an angular 16 app on two different server in IIS, files inside the asset folder working/loading properly from one server, not from the other published app (returning 403 forbidden). The strange behavior of this app is that it loads 5 files at every request, so on first hit, it loads 5 json files, If I request again it will load 5 more files.

enter image description here

after I request again, it loads 5 more files as you can see below. since it caches the previous 5 files.

enter image description here

even the logo is not loaded as you can see the image broken as it also throws 403 forbidden.

code for translation is below:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import {HttpClientModule, HttpBackend} from '@angular/common/http';
import {TranslateModule, TranslateLoader} from '@ngx-translate/core';
import {MultiTranslateHttpLoader} from 'ngx-translate-multi-http-loader';
import {AppComponent} from './app.component';

export function HttpLoaderFactory(_httpBackend: HttpBackend) {
  return new MultiTranslateHttpLoader(_httpBackend, [
    {prefix: 'assets/translate/views/Pages/login/', suffix: '.json'}, 
    {prefix: 'assets/translate/views/Pages/reset-password/', suffix: '.json'}, 
    {prefix: 'assets/translate/views/Pages/forgot-password/', suffix: '.json'},
    {prefix: 'assets/translate/containers/default-layout/default_header/', suffix: '.json'},
      {prefix: 'assets/translate/containers/default-layout/default-footer/', suffix: '.json'},
      {prefix: 'assets/translate/containers/default-layout/sideNav/', suffix: '.json'}, // , "suffix: '.json'" being the default value
      {prefix: 'assets/translate/views/users/', suffix: '.json'},
      {prefix: 'assets/translate/views/Pages/change-password/', suffix: '.json'},
      
      
      {prefix: 'assets/translate/views/Pages/A/', suffix: '.json'},
      {prefix: 'assets/translate/views/Pages/B/', suffix: '.json'},
      {prefix: 'assets/translate/views/Pages/C/', suffix: '.json'},
      
      {prefix: 'assets/translate/views/Pages/confirmation-popup/', suffix: '.json'},
      {prefix: 'assets/translate/views/Pages/D/', suffix: '.json'}
  ]);
}

@NgModule({
  declarations: [],
  imports: [
    CommonModule,
    HttpClientModule,
        TranslateModule.forRoot({
            loader: {
                provide: TranslateLoader,
                useFactory: HttpLoaderFactory,
                deps: [HttpBackend]
            }
        })
  ],
  exports:[
    HttpClientModule,
    TranslateModule
  ]
})
export class LangTranslateModule { }

I have checked all the settings between the two servers related to IIS. Anything I am missing ?

I was expecting the same behavior on both servers, still dont understand whats missing here ?

habib ul haq
  • 824
  • 6
  • 13
  • Try using FRT to view details about the 403 error, which will generate a detailed log file to help you identify the problem. https://learn.microsoft.com/en-us/iis/troubleshoot/using-failed-request-tracing/troubleshooting-failed-requests-using-tracing-in-iis – YurongDai Jul 27 '23 at 07:03
  • Make sure that the necessary MIME types are configured in IIS for the type of file your Angular app is trying to load. If MIME types are configured incorrectly, the server may not be able to serve files correctly. – YurongDai Aug 16 '23 at 09:33

0 Answers0