Laravel后端+Angular 5前端推送通知方案求推荐

别担心，你之前对One Signal、Push Bullet的理解有点小偏差哦——这些工具完全能适配Laravel+Angular的前后端分离架构！下面给你几个靠谱的方案，一步步帮你搞定推送通知：

One Signal其实对前后端分离场景非常友好，不管你的前端是Angular还是其他框架，后端是Laravel还是别的技术栈，都能无缝对接。具体操作分为两步：

• 前端（Angular 5）：集成One Signal的Web SDK，获取用户的推送订阅ID（也就是player ID），然后把这个ID传到Laravel后端存储起来（比如给用户表加个one_signal_player_id字段）。
  你可以在Angular的app.component.ts里初始化SDK，代码大概是这样：

  import * as OneSignal from 'onesignal-ts';
  import { HttpClient } from '@angular/common/http';
  
  constructor(private http: HttpClient) {}
  
  ngOnInit() {
    OneSignal.init({
      appId: '你的One Signal App ID',
    });
    OneSignal.Notifications.requestPermission().then(() => {
      OneSignal.User.pushSubscription.getId().then(playerId => {
        // 调用Laravel的API接口，把playerId存到后端数据库
        this.http.post('/api/save-player-id', {player_id: playerId}).subscribe();
      });
    });
  }
  

• 后端（Laravel）：使用One Signal的PHP SDK或者直接调用它的REST API，根据存储的player ID给指定用户发送推送。
  可以先安装官方的Laravel包onesignal/onesignal-laravel，然后在控制器里写发送逻辑：

  use OneSignal;
  
  public function sendNotification() {
    // 从数据库获取目标用户的player ID
    $playerId = auth()->user()->one_signal_player_id;
    OneSignal::sendNotificationToUser(
      '这是一条测试推送！',
      $playerId,
      null,
      ['url' => 'https://你的Angular应用地址']
    );
  }
  

FCM也是前后端分离架构的绝佳选择，支持Web端（Angular）和后端（Laravel）的完美对接，而且基础功能完全免费：

• 前端（Angular 5）：集成Firebase SDK，获取用户的FCM令牌，传到Laravel后端存储。
  先安装@angular/fire和firebase包，然后在组件里获取令牌：

  import { AngularFireMessaging } from '@angular/fire/messaging';
  import { HttpClient } from '@angular/common/http';
  
  constructor(private afMessaging: AngularFireMessaging, private http: HttpClient) {}
  
  ngOnInit() {
    this.afMessaging.requestPermission.subscribe(() => {
      this.afMessaging.getToken.subscribe(token => {
        // 调用Laravel API存储FCM令牌
        this.http.post('/api/save-fcm-token', {fcm_token: token}).subscribe();
      });
    });
  }
  

• 后端（Laravel）：使用FCM的PHP SDK（比如kreait/laravel-firebase），调用API发送推送。
  安装包并配置好Firebase凭据后，在控制器里发送通知：

  use Kreait\Firebase\Messaging\CloudMessage;
  use Kreait\Laravel\Firebase\Facades\Firebase;
  
  public function sendFcmNotification() {
    // 获取当前用户的FCM令牌
    $fcmToken = auth()->user()->fcm_token;
    $message = CloudMessage::withTarget('token', $fcmToken)
      ->withNotification(['title' => 'FCM通知标题', 'body' => 'FCM推送内容'])
      ->withData(['url' => 'https://你的Angular应用地址']);
    
    Firebase::messaging()->send($message);
  }
  

如果不想依赖第三方服务，也可以基于Web Push协议实现自定义推送，全程自己掌控数据：

• 前端（Angular 5）：使用web-push相关的前端工具生成订阅对象，把订阅信息（端点、公钥、密钥）传到Laravel后端存储。
• 后端（Laravel）：使用minishlink/web-push包，先生成VAPID密钥对，然后发送推送。
  安装包后，在控制器里写发送逻辑：

  use Minishlink\WebPush\WebPush;
  
  public function sendCustomPush() {
    // 从数据库获取用户的订阅信息（需提前存储）
    $subscription = auth()->user()->web_push_subscription;
    $webPush = new WebPush([
      'VAPID' => [
        'subject' => 'mailto:你的联系邮箱',
        'publicKey' => '你的VAPID公钥',
        'privateKey' => '你的VAPID私钥',
      ],
    ]);
    $webPush->sendNotification(
      $subscription,
      '这是一条自定义Web Push通知！'
    );
  }
  

这个方案需要自己处理订阅管理、密钥生成等细节，适合对隐私和可控性要求较高的场景。

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