Hygraph CMS请求受限及节流配置TypeError报错求助

问题根源 #

你调用pThrottle时参数顺序完全错误。p-throttle的正确参数逻辑是：

• 先传入limit（单位时间内允许的最大请求数，必须为有限数字）和interval（时间窗口，单位毫秒），得到一个节流器函数
• 再用这个节流器包装你要限制的目标方法（比如fetch）

你的代码把fetch包装函数放在了第一个参数位置，导致p-throttle把函数当成了limit参数，自然抛出类型错误。另外你代码里写的延迟是5000毫秒（5秒），和Hygraph要求的0.5秒（500毫秒）不符，也需要修正。

修正后的代码 #

import React from 'react';
import ReactDOM from 'react-dom';
import { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client';
import { createHttpLink } from "apollo-link-http";
import pThrottle from "p-throttle";
import App from './app.js';

// 初始化节流器：1个单位时间请求数，间隔500毫秒
const throttle = pThrottle(1, 500);
// 用节流器包装fetch函数
const throttledFetch = throttle((...args) => {
  return fetch(...args);
});

// 注意：替换为Hygraph提供的实际GraphQL API地址
const link = createHttpLink({
  uri: 'YOUR_HYGRAPH_GRAPHQL_ENDPOINT',
  fetch: throttledFetch,
});

const client = new ApolloClient({
  link,
  cache: new InMemoryCache(),
});

ReactDOM.render(
  <React.StrictMode>
    <ApolloProvider client={client}>
      <App />
    </ApolloProvider>
  </React.StrictMode>,
  document.getElementById('root')
);

额外注意事项 #

• 必须将uri替换为Hygraph控制台提供的专属GraphQL端点地址，否则请求会指向本地服务器的/graphql路径，无法正确获取Hygraph数据。
• 当前配置已满足Hygraph支持团队要求的「最大1个并发请求、最小延迟0.5秒」限制，无需额外调整。

内容的提问来源于stack exchange，提问作者Perceptor Dev