1

我正在尝试构建一个 Web 应用程序来总结有用的信息,而我想要添加的其中一件事是 Reddit 小部件。

我花了一整天的时间在 Axios 上苦苦挣扎,因为由于某种原因我的请求不起作用。我只想说我已经在 Kotlin 中使用 Reddit api 构建了一个应用程序,它运行良好,所以我了解 api 和 OAuth 是如何工作的,问题是(我认为)我对 Axios 的理解。

由于我不断收到 { error: 'invalid_grant' } 的事实,我认为问题来自 Axios 对我的请求正文进行编码,因此修改了我用来检索 access_token 的代码。

我有一个前端(Vue.js)和一个后端(Node、Express)。为了提出请求,我使用 Axios。

所以这里是代码逻辑:

  • 前端将客户端重定向到授权页面。
  • 一旦获得授权,我将处理重定向到“http://localhost:8081/oauth_callback”以获取临时代码。
  • 此代码被发送到我尝试检索访问令牌的后端。
  • 我们遇到问题

这是我用来获取访问令牌的函数:

async function getToken(uniqueCode) {
    let authString = `${client_id}:${client_secret}`;
    authString = Buffer.from(authString).toString('base64');

    let requestHeaders = {
        'Authorization': `Basic ${authString}`,
        'Content-Type': 'application/x-www-form-urlencoded'
    };

    const params = new URLSearchParams();
    params.append("grant_type", "authorization_code");
    params.append("code", uniqueCode);
    params.append("redirect_uri", "http://localhost:8081/oauth_callback");

    let res = await axios.post('https://www.reddit.com/api/v1/access_token', params, {headers: requestHeaders});

    return res.body.access_token
}

我尝试了相同的请求,使用相同的标头和参数,使用邮递员,它工作正常。

console.log(res) 转储了很多信息,包括:

headers: {
      Accept: 'application/json, text/plain, */*',
      'Content-Type': 'application/x-www-form-urlencoded',
      Authorization: 'Basic {removed by me}',
      'User-Agent': 'axios/0.24.0',
      'Content-Length': 129
    },
method: 'post',
url: 'https://www.reddit.com/api/v1/access_token',
data: 'grant_type=authorization_code&code=LiTC051x3nEKqXSbU0spuHgKHHaLGw%23_&redirect_uri=http%3A%2F%2Flocalhost%3A8081%2Foauth_callback'

显然,我在发布之前使用此代码将其撤消。

参数似乎与我遵循的文档一致:https ://github.com/reddit-archive/reddit/wiki/OAuth2#retrieving-the-access-token

对我来说,这里混乱的部分是代码的特殊字符被编码但我不确定因为格式是 application/x-www-form-urlencoded 所以也许它是正常的,也许不是,我不知道。

如果有人可以帮助我让我的代码正常工作,那就太好了。

谢谢

编辑:我解决了这个问题。重定向在 url 的末尾添加了“#_”,因此在代码的末尾...

4

0 回答 0