能否为urql设置自定义请求头？适配Github GraphQL v4 Schema Previews

当然可以！urql完全支持设置自定义请求头，而且正如你留意到的，这个功能已经合并到代码库中了——只是暂时还没同步到官方文档里。

要给urql客户端配置自定义Accept请求头（用来启用GitHub GraphQL的Schema Previews特性），你只需要在创建客户端时通过fetchOptions参数传入对应的headers配置即可。这里给你举个具体的示例：

import { createClient } from 'urql';

// 创建urql客户端
const client = createClient({
  url: 'https://api.github.com/graphql',
  // 配置请求选项，这里设置自定义headers
  fetchOptions: () => ({
    headers: {
      // 别忘了GitHub GraphQL需要的授权头
      'Authorization': 'Bearer YOUR_GITHUB_PERSONAL_ACCESS_TOKEN',
      // 替换成你需要启用的Schema Preview对应的Accept值
      'Accept': 'application/vnd.github.starfox-preview+json'
    },
  }),
});

如果你的场景需要动态调整请求头（比如根据不同的GraphQL操作设置不同的Preview头），fetchOptions还可以是一个函数，它会接收当前的operation作为参数，你可以根据operation的内容返回对应的headers配置：

const client = createClient({
  url: 'https://api.github.com/graphql',
  fetchOptions: (operation) => {
    // 这里可以根据operation的名称或字段动态设置headers
    const previewHeader = operation.context?.previewHeader || 'application/vnd.github.starfox-preview+json';
    
    return {
      headers: {
        'Authorization': 'Bearer YOUR_GITHUB_PERSONAL_ACCESS_TOKEN',
        'Accept': previewHeader
      },
    };
  },
});

你提到的相关代码变更已经被合并，所以只要你使用的是较新版本的urql，这个功能就能直接正常工作，放心用就好。

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