reactjs - 使用 Youtube Data API v3 时请求缺少有效的 API key

Question

我正在尝试获取 key 并在控制台上显示结果，但它不起作用。我正在使用 React.js 来实现此目的。

import axios from "axios";

const KEY = "MY_Key Here";

export default axios.create({
 baseURL: "https://www.googleapis.com/youtube/v3",
  params: {
   part: "snippet",
   maxResults: 5,
   key: KEY,
  },
});

App.js 包含这个

onTermSubmit = async (term) => {
  const response = await youtube.get("/search", {
    params: {
      q: term
    },
  });
  console.log(response);
};

每次我执行此操作时，都会显示“请求缺少有效的 api key ”domain="Global"reason-"forbidden"和 status="Denied"。

Answer 1

确保添加所有这些 参数:{ 部分:“片段”， 最大结果: 5, key : key ， }

在您的 App.js 中并将其从 youtube.js 中删除 参数:{ 问:术语 },

这里，

App.js 的最终代码看起来像

参数:{ 部分:“片段”， 最大结果: 5, key : key ， 问:术语 }

这是因为在你来自 youtube.js 的 baseURl 之后，它直接去你的 App.js 参数，它只包含一个东西，即 {q}，所以 pgm 永远没有机会真正读取 key