如何在 mPulse Boomerang 中为 Angular 应用程序注册软导航更改？

编程问答 2022-04-30

问题描述

BOomr.plugins.Angular plugin 似乎用于 AngularJS 1.x，到目前为止我没有找到可以使用的 Angular 示例或插件。根据文档，我想出了以下解决方案：

@Injectable()
export class boomerangBootstrapService implements OnAppInit {
    constructor(private router: Router) {}

    onAppInit() {
        const boomr = window['BOomr'];
        const callbacks = {};

        this.router.events.subscribe((e) => {
            if (!boomr) {
                return;
            }
            if (e instanceof NavigationStart) {
                boomr.plugins.SPA.last_location(e.url);
                const callback = () => {
                    boomr.plugins.SPA.markNavigationComplete();
                };
                callbacks[e.url] = callback;
                boomr.plugins.SPA.route_change(callback,[]);
            } else if (e instanceof NavigationEnd || e instanceof NavigationCancel || e instanceof NavigationError) {
                const callback = callbacks[e.url];
                if (callback) {
                    callback();
                    delete callbacks[e.url];
                }
            }
        });
    }
}

当我使用浏览器控制台插入帮助程序 diagnostics script 以调试调用时，我可以看到注册是正确的，但我没有看到在导航上提交任何数据。

诊断脚本：

(function(spa) {
  'use strict';
  var rc = spa.route_change;
  var ll = spa.last_location;
  var cm = spa.markNavigationComplete;

  spa.last_location = function(url) {
    console.log('last route url was ' + url);
    ll(url);
  };

  spa.route_change = function(c,o) {
    console.log('route_change start');
    rc(c,o);
  };

  spa.markNavigationComplete = function() {
    console.log('route_change completed');
    cm();
  };
})(window.BOomr.plugins.SPA);

我做错了吗？我是否需要创建 custom plugin 或调用其他方法？你能给我指出一个工作代码示例或插件 git 项目吗？

解决方法

现在无需在您的 Angular 应用程序中检测任何内容。从 Boomerang 1.632 版开始，只需检查

Enable Single Page App (SPA) monitoring

此处提供文档

https://developer.akamai.com/tools/boomerang/?language=en_US?language=en_US#single-page-apps

akamaiangularangularboomerangrum