javascript - Twitch API 不返回任何内容

Question

我想使用 Twitch API 来请求此处记录的当前热门流 'https://dev.twitch.tv/docs/api/reference#get-streams' 下面的代码是我目前所拥有的，我是否通过了不记名令牌错了？他们是另一种方式吗？当页面呈现时，它卡在“正在加载...” div 上，看起来它甚至没有调用 API。

import axios from "axios";
import { chakra, Box, Image, Flex, Icon, useColorModeValue, HStack, Grid, Wrap, WrapItem } from "@chakra-ui/react";
import { MdHeadset, MdEmail, MdLocationOn } from "react-icons/md";
import { BsFillBriefcaseFill } from "react-icons/bs";

const Streams = ({streams}) => {
    if(!streams){
       return <div>Loading...</div>
    }
    console.log(streams);
    return (
        <div>
          <h1>Test</h1>
        </div>
    )
}

Streams.getInitialProps = async (ctx) => {
    try {
      const res = await axios.get("https://api.twitch.tv/helix/streams", { 
        headers: {
          'Authorization' : 'Bearer abcdef',
          'Client-ID' : 'abcdef',
          'Access-Control-Allow-Origin' : true,
        }
      });
      const streams = res.data;
      console.log(streams)
      return { streams };
    } catch (error) {
      return { error };
    }
  };
  

  export default Streams;

标签： javascriptapiaxiosnext.jstwitch