reactjs - 无法使用 axios 接收 monzo 访问令牌
问题描述
我一整天都在尝试使用 axios 在 react 中执行发布请求(我正在尝试为 Monzo 应用程序获取 access_token)。我已按照此处的说明进行操作,并且在使用命令行工具进行尝试时,它们可以正常工作,httpie
如所述说明所示。但是,当我尝试在我的 react 应用程序中使用它时,事情就出错了。使用httpie的post请求如下:
http --form POST "https://api.monzo.com/oauth2/token" \
"grant_type=authorization_code" \
"client_id=my_client_id" \
"client_secret=my_client_secret" \
"redirect_uri=my_redirect_uri" \
"code=my_authorization_code"
这可以按预期工作并返回一个包含我的 access_token 的 JSON 对象。
我在我的 react 应用程序中使用的(有问题的)axios 命令是:
axios.post(
"https://api.monzo.com/oauth2/token", {
grant_type: "authorization_code",
client_id: my_client_id,
client_secret: my_client_secret,
redirect_uri: my_redirect_uri,
code: my_authorization_code
})
我收到的错误消息是Failed to load resource: the server responded with a status of 400 ()
.
我发现了这个非常相关的问题,它建议我添加一个标头指定Content-Type: application/json
,所以我将我的 axios 命令更改为:
axios({
method: "POST",
url: "https://api.monzo.com/oauth2/token",
data: JSON.stringify({
grant_type: "authorization_code",
client_id: my_client_id,
client_secret: my_client_secret,
redirect_uri: my_redirect_uri,
code: my_authorization_code
}),
headers: {
'Content-Type': 'application/json'
}
})
不幸的是,这给出了完全相同的错误。
有人可以给我一些指示吗?我对网络很陌生...谢谢!
解决方案
正如这些事情通常发生的那样,我在发布问题后不久就找到了答案。显然,“Content-Type”需要以“application/xxx-form-urlencoded”的形式发送,并且数据要进行相应的转换,如下所示:
const queryString = require('query-string')
axios({
method: "POST",
url: "https://api.monzo.com/oauth2/token",
data: queryString.stringify({grant_type: ...}),
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
})
推荐阅读
- react-native - 停车支付逻辑
- vue.js - 自定义 v-data-table 中的列排序顺序
- python - 如何使用 pytest 中的 setUp 作为异步方法?
- ruby - 如何检查我的哈希是否有错误
- php - 如何修复“PHP 警告:PHP 启动:无法加载动态库 'mongodb'”
- apple-watch - 如何在 Apple Watch 上查看已安装的应用程序版本?
- javascript - Raspberry Pi 中 Google Chromium Print PDF Preview 的页脚部分出现空白 URL 框
- javascript - 为什么在输入更改后提交状态没有立即更新?
- amazon-web-services - 以毫秒为单位查询 100Gb 的 S3 数据
- python-3.x - 如何解决 Tensorflow 2.0 中的 RuntimeError?