Azure Bot Framework DirectLine v3开始对话-禁止错误403

Question

我正在使用DirectLine v3在我的网站中实现一个使用Azure Bot Framework的机器人。我试图按照此处的说明开始对话：https://docs.microsoft.com/en-us/azure/bot-service/rest-api/bot-framework-rest-direct-line-3-0-start-conversation?view=azure-bot-service-4.0

[当我发送HTTP帖子时，我收到状态为403禁止的响应错误。有人可以建议我为什么收到403禁止响应吗？我在Angular应用程序中使用它。

我的HTTP帖子代码：

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http'
import 'rxjs/Rx';


@Injectable()
export class BotFramework {
    secret = 'SECRET';
    constructor(private httpClient: HttpClient) {}

    authenticate() {
        const headerAuth = new Headers({
            'Authorization': 'Bearer ' + this.secret
        });
        return this.httpClient.post('https://directline.botframework.com/v3/directline/conversations',{
        observe: 'response',
        response: 'json',
        })
        .map(
            (response) => {
                const data = response;
                console.log('Returned response: ' + response);
                return data;
            }
        )
    }
}

我在这里的Angular组件中使用它：

 //Azure Bot Framework code goes here
  setTimeout(() => {
    this.botFramework.authenticate()
      .subscribe(
        (authentification: any) => {
          console.log(authentification);
          (error) => console.log('Authentification error: ' + error);
        }
      )
  }, 1000)

以下是Azure上的DirectLine设置：

控制台出现错误：

而且我在[网络]标签中得到以下错误描述：

因此该消息说，缺少一个机密或令牌（我提供了机密）。我认为在设置HTTP Post时我一定做错了，因为Azure无法找到我的秘密。如果我正确地假定这是错误，那么如何正确发送HTTP Post以使Azure找到密钥？

Answer 1

好的，我找到了答案。因此，为了通过Azure Bot Framework DirectLine API进行身份验证，我不得不在Angular应用程序中使用HTTP拦截器。本质上，当我发送HTTP Post请求时，它被拦截器拦截，并在其中添加带有授权密钥的标头。参见拦截器代码：

import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from 

'@angular/common/http';
import { Observable } from 'rxjs';
import { Injectable } from '@angular/core';
import { BotFramework } from '../Services/botFrameworkDirectLine.service';

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
    constructor(private botFramework: BotFramework) {}
    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        console.log('Intercepted', req);
        const copiedReq = req.clone({headers: req.headers.set('Authorization',
        this.botFramework.secret)});
        return next.handle(copiedReq);
    }
}

这里是我发布帖子的代码，与上面的代码几乎相同，除了一个秘密变量：

import { Injectable } from '@angular/core';
import { HttpClient} from '@angular/common/http'
import 'rxjs/Rx';


@Injectable()
export class BotFramework {
    secret = 'Bearer SECRET';
    constructor(private httpClient: HttpClient) {}

    authenticate() {

        return this.httpClient.post(
            'https://directline.botframework.com/v3/directline/conversations',{
        observe: 'body',
        response: 'json',
        })
        .map(
            (response) => {
                const data = response;
                console.log('Returned response: ' + response);
                return data;
            }
        )
    }
}

在我的Angular应用程序的app.module.ts文件中，拦截器是通过这种方式导入的（请参阅提供者）：

@NgModule({


declarations: [
    AppComponent,
    HeaderComponent,
    BreadcrumbComponent,
    TopicComponent,
    HubComponent,
    ComputerHardwareComponent,
    BotComponent,
    PopularTopicsComponent,
    LoginComponent,
    GraphicsCardsComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpClientModule,
    HttpModule
  ],
  providers: [
    KeywordExtractor,
    Translator,
    BotFramework,
    {provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true}
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

最终结果是我从Azure Bot Service DirectLine连接得到正确的响应：

这提供了我自己的问题的答案，现在我可以继续开发应用程序了：）