共享给团队错误“无法加载https://local.teams.office.com/sourcemaps/../unhashed-assets/launcher.js.map的内容”

问题描述

我们正试图在Web应用程序中添加“向团队共享”按钮,这是一个有角度的应用程序。

但是在添加脚本时,会显示错误消息

无法加载以下内容 https://local.teams.office.com/sourcemaps/../unhashed-assets/launcher.js.map: 连接错误:net :: ERR_CONNECTION_REFUSED

按钮不显示

 <a class="teams-share-button" data-href="someurl"></a>

打字稿中的脚本呈现功能

 private appendSharetoTeamsScript(): void{
        //Add Share to Teams script to the page 
        var script   = document.createElement("script");
        script.type  = "text/javascript";
        script.src   = "https://teams.microsoft.com/share/launcher.js";
        document.body.appendChild(script);
      }

解决方法

要在组件上加载外部JavaScript,请使用ngOnInit()附加库。

我尝试了以下代码段并为我工作。

在home.component.html的锚标记下添加

   <a class="teams-share-button" data-href="yor url" data-icon-px-size="64"></a>

在home.component.ts中添加以下代码段

    import { Component,OnInit } from '@angular/core';

      @Component({
      selector: 'app-home',templateUrl: './home.component.html',})

    export class HomeComponent implements OnInit {
     title = 'app';

      ngOnInit() {
        this.loadScript('https://teams.microsoft.com/share/launcher.js');
     }
  
     public loadScript(url: string) {
     const body = <HTMLDivElement> document.body;
     var script = document.createElement('script');   
     script.src = url;
     body.appendChild(script);
     }
   }