带有令牌和签名的角度认证答案

【问题标题】：angular authentication with token and signature带有令牌和签名的角度认证
【发布时间】：2018-08-15 06:51:02
【问题描述】：

我有graphql-go api 使用身份验证，当我测试它时它已经工作了卷曲

curl \
  -X POST \
  -H "Content-Type: application/json" \
  -H "Token: someS3cr3tT0ken" \
  -H "Signature: FAC2CA55E128AB2E399474200121DB19442324D7DFF40A919865130DC1A2409" \
  --data '{"transaction_id": "123", "query": "query {validate(phonenumber:\"XXXXXXXXX\") {request_id}}" }' \
  http://localhost:6060/validate

响应应该是：

{"data":{"validate":{"request_id":"22421462-4a3e-43c7-b188-57b6fe1c5575"}}}

但我想用 apollo 客户端以角度实现它。所以，从本质上讲，是否可以将上面的curl 命令转换为角度http 请求...？ 我已经尝试过使用拦截器并克隆http请求并修改标头，但我只能设置headers: request.headers.set("Authorization", "someS3cr3tT0ken"然后我将第二个拦截器与headers: request.headers.set("Signature", "FAC2CA55E128AB2E399474200121DB19442324D7DFF40A919865130DC1A2409"结合起来，当我这样做时它给了我400 badRequest这是一个错误当上面的任何一个参数curl 不正确时，服务器给我的响应是，我实际上只是在黑暗中拍摄，并且真的不知道如何将3 Header parameter 设置为角度，我发现的大部分资源是到getToken from localStorage 这在我的情况下不起作用，因为我无法提供Header signature

更新这是我的拦截器：

@Injectable()
export class graphqlInterceptor implements HttpInterceptor{
    intercept(request: HttpRequest<any> , next: HttpHandler){
        const newRequest = request.clone({
        headers: request.headers.set("Token", "someS3cr3tT0ken")
       // or
      // headers: request.headers.set("Authorization","someS3cr3tT0ken")
      //neither of the option above are working.
        return next.handle(newRequest)

然后我创建第二个拦截器来分配 Signature: ,,

这是上面实现的结果.. 我知道你会认为这是来自服务器的 CORS 问题，但是如果我将 Token 更改为 Authorization 响应更改为错误请求

这里是详细信息 XHR

谢谢。 .

【问题讨论】：

你能提供你的拦截器的代码吗？新的 HttpHeaders 是不可变的，每次设置新的标头值时，都会获得新的引用。 angular.io/api/common/http/HttpHeaders
感谢@SamiAI90 的回复，我已经更新了我的问题。。请检查一下。 .
请提供第二个拦截器的代码、来自浏览器开发工具的http请求截图和完整的错误响应。这样我们就可以看到发送了哪些标头。

标签： angular authentication token graphql apollo

【解决方案1】：

我的团队建议我需要将 express.js 放在中间，所以从 angular -> req 到 express 然后处理 req 并将其传递给 graphql-server 并且它可以工作。

【讨论】：