Angular 5：全局变量类构造函数注入后未初始化致API调用失败

首先得澄清一个关键概念：在Angular的依赖注入体系里，类的构造函数本身就是在注入实例化时执行的——不存在“让构造函数在DI前执行”的说法，因为构造函数是创建实例的第一步。你遇到的API调用失败，本质是Globals实例的初始化时机晚于API调用，或者初始化逻辑依赖的资源（比如PlatformLocation的location.href）还没就绪。

下面给你几个针对性的解决方案：

方法1：用APP_INITIALIZER强制提前初始化 #

APP_INITIALIZER是Angular提供的核心令牌，能让你在应用启动（组件渲染、业务服务注入）之前执行初始化逻辑，确保Globals里的URL变量在任何API调用前都准备完毕。

步骤1：重构Globals类，抽离初始化逻辑 #

@Injectable({
  providedIn: 'root' // 确保是全局单例
})
export class Globals {
    public baseURL:string;
    public loginURL:string;
    public proxyURL:string;
    public servicesURL:string;

    constructor(private platformLocation: PlatformLocation) {}

    // 把初始化逻辑抽成独立方法，方便被初始化器调用
    init(): void {
        this.baseURL = (this.platformLocation as any).location.href;
        this.loginURL = this.baseURL + 'rest/login';
        this.proxyURL = this.baseURL + 'rest/proxy';
        this.servicesURL = this.baseURL + 'rest/serviceRegistry';
    }
}

步骤2：在AppModule中配置初始化器 #

import { NgModule, APP_INITIALIZER } from '@angular/core';
import { Globals } from './globals';

// 定义初始化工厂函数
function initializeGlobals(globals: Globals) {
  return () => globals.init(); // 返回一个Promise或函数，Angular会等待它完成再启动应用
}

@NgModule({
  providers: [
    Globals,
    {
      provide: APP_INITIALIZER,
      useFactory: initializeGlobals,
      deps: [Globals], // 声明依赖的服务
      multi: true // 允许同时配置多个初始化器
    }
  ]
})
export class AppModule {}

这样Angular会在应用启动前自动调用globals.init()，保证所有URL变量都已初始化完成。

方法2：改用DOCUMENT令牌优化URL获取 #

有时候(platformLocation as any).location.href会因为初始化时机问题取不到正确值，改用Angular提供的DOCUMENT抽象能更安全可靠地获取当前页面URL：

import { Injectable, Inject } from '@angular/core';
import { DOCUMENT } from '@angular/common';

@Injectable({
  providedIn: 'root'
})
export class Globals {
    public baseURL:string;
    public loginURL:string;
    public proxyURL:string;
    public servicesURL:string;

    constructor(@Inject(DOCUMENT) private document: Document) {
        this.baseURL = this.document.location.href;
        this.loginURL = this.baseURL + 'rest/login';
        this.proxyURL = this.baseURL + 'rest/proxy';
        this.servicesURL = this.baseURL + 'rest/serviceRegistry';
    }
}

这种方式不需要额外的初始化器，DOCUMENT的注入时机更稳定，能避免类型断言带来的潜在问题。

方法3：调整API调用的时机 #

如果你的API调用是在组件的constructor里直接执行的，可能会因为组件实例化时Globals还没完成初始化（懒加载模块场景下容易出现）。这时候把API调用移到ngOnInit生命周期钩子即可：

import { Component, OnInit } from '@angular/core';
import { AuthService } from './auth.service';

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html'
})
export class LoginComponent implements OnInit {
  constructor(private authService: AuthService) {}

  ngOnInit(): void {
    // 此时所有依赖服务都已完成初始化，放心调用API
    this.authService.login().subscribe(res => {
      // 处理登录结果
    });
  }
}

内容的提问来源于stack exchange，提问作者NDDT