Angular应用如何全局注册cron任务实现每日定期刷新页面

Angular 中要保证 cron 任务全局仅初始化一次，可以使用以下两种成熟方案：

方案1：根级单例服务（推荐） #

声明为 providedIn: 'root' 的服务默认是全局单例，整个应用生命周期只会实例化一次，只要不在组件/子模块的 providers 数组中重复声明该服务，就不会出现重复初始化的问题。

1. 首先创建全局定时任务服务：

// src/app/services/global-cron.service.ts
import { Injectable } from '@angular/core';
import { CronJob } from 'cron';

@Injectable({
  providedIn: 'root' // 声明为根级单例
})
export class GlobalCronService {
  private cronJob: CronJob | null = null;

  constructor() {
    // 双重判断防止异常场景下重复初始化
    if (!this.cronJob) {
      // 修正cron表达式：秒 分 时 日 月 周，对应每天12点整触发
      this.cronJob = new CronJob('0 0 12 * * *', () => {
        window.location.reload();
      }, null, true);
      this.cronJob.start();
    }
  }
}

2. 在根组件（AppComponent）中注入一次服务即可，无需额外调用方法：

// src/app/app.component.ts
import { Component } from '@angular/core';
import { GlobalCronService } from './services/global-cron.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor(private globalCronService: GlobalCronService) {}
}

方案2：直接写在应用入口main.ts中 #

如果不需要对定时任务做启停、修改等额外控制，可以直接把代码放在应用启动入口，整个应用启动阶段只会执行一次：

// src/main.ts
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { CronJob } from 'cron';

// 全局cron任务，应用启动时仅初始化一次
const cronJob = new CronJob('0 0 12 * * *', () => {
  window.location.reload();
}, null, true);
cronJob.start();

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));

注意事项 #

• 你当前使用的 * * * * * * cron表达式表示每秒触发一次，不符合每天12点刷新的需求，需要替换为 0 0 12 * * *
• 页面刷新后cron任务会自动重新初始化，不会出现任务丢失的问题
• 如果后续需要扩展暂停/重启定时任务的能力，选择方案1的单例服务更易维护

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