Question

我第一次问这个问题。

我试图对我的团队制作的stormpath应用程序进行GET调用，这需要一些授权。使用Postman进行测试时，经过一些配置后，一切都出现了200。

使用curl工作

curl --verbose --user ID:SECRET -H "Accept: application/json" https://api.stormpath.com/v1/tenants/current
...
< HTTP/1.1 302 
< Cache-Control: private, no-cache, no-store, max-age=0, no-transform
< Date: Tue, 10 Jan 2017 09:27:14 GMT
< Location: https://api.stormpath.com/v1/tenants/TENANTID
< Pragma: no-cache
< Stormpath-Request-Id: f8e4dee0-d716-11e6-9795-22000aa92aa2
< Strict-Transport-Security: max-age=31536000; includeSubDomains; preload
< X-Frame-Options: SAMEORIGIN
< Content-Length: 0
< Connection: keep-alive
< 
* Connection #0 to host api.stormpath.com left intact

但是当我尝试通过Axios中的React拨打电话时，我收到401错误。

XMLHttpRequest cannot load https://api.stormpath.com/v1/tenants/current. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. The response had HTTP status code 401.

这就是我使用的：

axios({ 
method: 'get',
url: "https://api.stormpath.com/v1/tenants/current", 
auth:
{
    username: 'api ID',
    password: 'api Secret'
}
})

我不知道为什么，但根据我的回复，它没有提供用户名和密码。

code:401
developerMessage:"Authentication with a valid API Key is required."
message:"Authentication required."
moreInfo:"http://www.stormpath.com/docs/quickstart/connect"
requestId:"3686f590-d69e-11e6-9b8a-22000a8ce5d1"
status:401

似乎之前已经提出了类似的问题，但仍然没有回复。

Reactjs Axios / Spring boot security

Cannot Basic Auth from React App with Axios or SuperAgent

Basic authentication : failure supergaent+OSX , success on superagent+Redhat , success on Postman+OSX,

感谢您花时间阅读本文。

Answer 1

几个月前遇到同样的问题并最终得到了相同的解决方案。我认为它与前端的cors有关，因为你试图为api打其他域名。

您可以在标题中添加一些自定义身份验证数据，因此您可能需要使用＆＃39; withCredentials：true＆＃39;当你打电话时。然后它将导致预检选项调用问题。而且我认为它不应该在前端处理。希望这有帮助。

Answer 2

好的，所以我无法弄清楚为什么axios auth电话无法正常工作，但我找到了办法。我所做的是在express内而不是React内进行身份验证API调用。

所以发生的事情是React调用我的服务器localhost。

axios.get("/secret")
    .then(
        function(response)
        {
            console.log(response)
        }
    )

然后节点/快速服务器捕获它并运行我想要的API调用。我使用了request和cors

app.use(cors());

...

app.get('/secret', function(req, res){

    var queryUrl = "https://api.stormpath.com/v1/tenant/current;
    request({url:queryUrl,   auth: {
    user: ID,
    pass: SECRET
  }}, function(err, response, body){

        if(!err && response.statusCode == 200){
            info = JSON.parse(body);
            res.send(info);
        }
        else{
            res.send(err)
        }
    })
})

它适用于我需要的所有stormpath API URL。

Axios基本授权不在Reactjs中进行

2 个答案: