Error: URLs requested via Http on the server must be absolute.

[ghost]

EDIT: nevermind, just use ngx-universal, since I'm using Universal (hope I solve the Cannot resolve 'fs' module thing).

---

Writing this

export function HttpLoaderFactory(http: HttpClient) {
	return new TranslateHttpLoader(http, './assets/i18n/', '.json');
}

rather than this

export function HttpLoaderFactory(http: HttpClient) {
	return new TranslateHttpLoader(http, 'http://localhost:8000/assets/i18n/', '.json');
}

leads to Error: Uncaught (in promise). It would be nice to have an automatic way to retrieve the origin. Or I'm missing something.

[mmeylan]

The actual error spit by Universal is:

Error: URLs requested via Http on the server must be absolute. URL: /assets/i18n/en.json

I am also experiencing it.

[ronaldso55]

ngx-universal (UniversalTranslateLoader) won't work for Angular 5. See https://github.com/fulls1z3/ngx-translate/issues/44.

[sagrawal31]

As per the docs https://angular.io/guide/universal#using-absolute-urls-for-http-data-requests-on-the-server, it says-

If you are using one of the @nguniversal/*-engine packages (such as @nguniversal/express-engine), this is taken care for you automatically. You don't need to do anything to make relative URLs work on the server.

But this is not working (in app.module.ts)-

export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
    return new TranslateHttpLoader(http);
}

TranslateModule.forRoot({
    loader: {
        provide: TranslateLoader,
        useFactory: HttpLoaderFactory,
        deps: [HttpClient]
    },
}),

Here is the error-

ERROR NetworkError
    at XMLHttpRequest3.send (/Users/shashank/Projects/bharat-post/web-app/dist/web-app/server/main.js:1:2445465)
    at Observable2._subscribe (/Users/shashank/Projects/bharat-post/web-app/dist/web-app/server/main.js:1:336270)
    at Observable2._trySubscribe (/Users/shashank/Projects/bharat-post/web-app/dist/web-app/server/main.js:1:2091056)
    at Observable2.subscribe (/Users/shashank/Projects/bharat-post/web-app/dist/web-app/server/main.js:1:2090838)
    at scheduleTask (/Users/shashank/Projects/bharat-post/web-app/dist/web-app/server/main.js:1:4334513)
    at Observable2._subscribe (/Users/shashank/Projects/bharat-post/web-app/dist/web-app/server/main.js:1:4335116)
    at Observable2._trySubscribe (/Users/shashank/Projects/bharat-post/web-app/dist/web-app/server/main.js:1:2091056)
    at Observable2.subscribe (/Users/shashank/Projects/bharat-post/web-app/dist/web-app/server/main.js:1:2090838)
    at innerSubscribe (/Users/shashank/Projects/bharat-post/web-app/dist/web-app/server/main.js:1:2111774)
    at MergeMapSubscriber._innerSub (/Users/shashank/Projects/bharat-post/web-app/dist/web-app/server/main.js:1:2141009)

Having the latest dependencies-

"@angular/common": "~12.2.5",
"@angular/compiler": "~12.2.5",
"@angular/core": "~12.2.5",
"@nguniversal/express-engine": "^12.1.0",
"@ngx-translate/core": "^13.0.0",
"@ngx-translate/http-loader": "^6.0.0",

Although, adding the path resolves the problem return new TranslateHttpLoader(http, 'http://localhost:4200/assets/i18n/');