Question

我在身份验证方面遇到问题。当我使用POSTMAN并添加带有Bearer令牌的授权标头时，一切都很好。但是，当我尝试Angular的请求时，就会得到响应405 Method Not Allowed。我正在使用Angular 5，我的代码非常简单：

    import { HttpHeaders, HttpClient } from '@angular/common/http';
    const my_token = 'xxx'
    @Injectable()
    export class RequestService {
      makeRequest() {
        return this.http.get(api.get, {headers: new HttpHeaders(
          {
            'Authorization': `Bearer ${my_token}`,
            'Content-Type': 'application/json'
          })});
        }
     }

我在做什么错了？

Answer 1

这是一个老问题，但向未来的读者发布了我的想法。将尝试使其简短。

理论

对我来说，问题似乎与CORS (Cross Origin Resource Sharing)有关。当www.domain1.com调用www.domain2.com时，它被认为是不安全的，浏览器需要一些特殊的标头来处理您的请求（读取Access-Control-Allow-Origin，Access-Control-Allow-Methods）。甚至www.domain:1000.com和www.domain:2000.com也被视为独立的域。

POSTMAN为什么起作用？

POSTMAN（甚至Telerik Fiddler）是一种工具，而不是浏览器。因此，它们不关心响应中的任何标头，而是呈现响应。这就是为什么它们起作用。但是，当您通过Angular运行它时，该应用程序将在浏览器中打开，因此您会看到CORS播放剧透的问题。

解决方案

最后，这是服务器端而不是客户端的问题。您的Angular代码很好，您需要执行以下任一操作来修复它。

永久：在服务器端代码中启用CORS。在互联网上了解更多。
临时：安装Chrome扩展程序（适用于CORS）（许多免费版本）并启用插件状态。您的Angular应用应该可以正常运行了。

旁注

关于添加新请求标头的代码，它不应该作为某些HTTP拦截器的一部分吗？

我了解您只是想提出问题，而这可能不是您的原始代码。但是仍然想指出这一点。

希望有帮助。

Answer 2

您必须与 Bearer

关联 my_token

这是一个例子

<?php
    if (!empty($datas) !== FALSE){
        foreach ($datas as $data) {
?>
            <input type="text" name="field1" value="<?php echo $data['field1'] ?>">
            <input type="text" name="field2" value="<?php echo $data['field2'] ?>">
<?php
    }} else {
?>
            <input type="text" name="field1">
            <input type="text" name="field2">
<?php
    }
?>

Answer 3

与 Bearer 的第一个连击 my_token 如下：
my_token1 =`承载者$ {my_token}`
（使用反引号）

然后像
一样使用它 '授权'：${my_token1}，

Angular-不记名令牌

3 个答案: