# Subscription スキーマ定義
type Subscription {
  # 新しいメッセージの購読
  messageAdded(channelId: ID!): Message!
 
  # 注文ステータスの変更
  orderStatusChanged(orderId: ID!): Order!
 
  # ユーザーのオンライン状態
  userPresenceChanged: UserPresence!
 
  # 通知のリアルタイム配信
  notificationReceived(userId: ID!): Notification!
 
  # ダッシュボードメトリクスの更新
  metricsUpdated(dashboardId: ID!): DashboardMetrics!
 
  # タイピングインジケーター
  userTyping(channelId: ID!): TypingIndicator!
}
 
type Message {
  id: ID!
  content: String!
  author: User!
  channel: Channel!
  attachments: [Attachment!]!
  reactions: [Reaction!]!
  createdAt: DateTime!
  editedAt: DateTime
}
 
type UserPresence {
  user: User!
  isOnline: Boolean!
  lastSeen: DateTime!
  status: PresenceStatus!
}
 
enum PresenceStatus {
  ONLINE
  AWAY
  DO_NOT_DISTURB
  OFFLINE
}
 
type Notification {
  id: ID!
  type: NotificationType!
  title: String!
  body: String!
  actionUrl: String
  isRead: Boolean!
  createdAt: DateTime!
}
 
enum NotificationType {
  MESSAGE
  MENTION
  ORDER_UPDATE
  SYSTEM
  PROMOTION
}
 
type TypingIndicator {
  user: User!
  channelId: ID!
  isTyping: Boolean!
}
 
type DashboardMetrics {
  activeUsers: Int!
  requestsPerSecond: Float!
  errorRate: Float!
  averageResponseTime: Float!
  timestamp: DateTime!
}

// サーバー側（Apollo Server + WebSocket）
import { createServer } from 'http';
import { WebSocketServer } from 'ws';
import { useServer } from 'graphql-ws/lib/use/ws';
import { ApolloServer } from '@apollo/server';
import { expressMiddleware } from '@apollo/server/express4';
import { ApolloServerPluginDrainHttpServer } from '@apollo/server/plugin/drainHttpServer';
import { makeExecutableSchema } from '@graphql-tools/schema';
import { PubSub, withFilter } from 'graphql-subscriptions';
import express from 'express';
 
const pubsub = new PubSub();
 
// イベント名の定数定義
const EVENTS = {
  MESSAGE_ADDED: 'MESSAGE_ADDED',
  ORDER_STATUS_CHANGED: 'ORDER_STATUS_CHANGED',
  USER_PRESENCE_CHANGED: 'USER_PRESENCE_CHANGED',
  NOTIFICATION_RECEIVED: 'NOTIFICATION_RECEIVED',
  METRICS_UPDATED: 'METRICS_UPDATED',
  USER_TYPING: 'USER_TYPING',
};
 
const resolvers = {
  Subscription: {
    // withFilterでチャンネルIDによるフィルタリング
    messageAdded: {
      subscribe: withFilter(
        () => pubsub.asyncIterator(EVENTS.MESSAGE_ADDED),
        (payload, variables) => {
          // 指定されたチャンネルのメッセージのみ配信
          return payload.messageAdded.channel.id === variables.channelId;
        }
      ),
    },
 
    orderStatusChanged: {
      subscribe: withFilter(
        () => pubsub.asyncIterator(EVENTS.ORDER_STATUS_CHANGED),
        (payload, variables) => {
          return payload.orderStatusChanged.id === variables.orderId;
        }
      ),
    },
 
    userPresenceChanged: {
      subscribe: () => pubsub.asyncIterator(EVENTS.USER_PRESENCE_CHANGED),
    },
 
    notificationReceived: {
      subscribe: withFilter(
        () => pubsub.asyncIterator(EVENTS.NOTIFICATION_RECEIVED),
        (payload, variables, context) => {
          // 認証済みユーザー自身の通知のみ配信
          return payload.notificationReceived.userId === variables.userId
            && context.user.id === variables.userId;
        }
      ),
    },
 
    userTyping: {
      subscribe: withFilter(
        () => pubsub.asyncIterator(EVENTS.USER_TYPING),
        (payload, variables) => {
          return payload.userTyping.channelId === variables.channelId;
        }
      ),
    },
 
    metricsUpdated: {
      subscribe: withFilter(
        () => pubsub.asyncIterator(EVENTS.METRICS_UPDATED),
        (payload, variables, context) => {
          // 管理者のみメトリクスを購読可能
          if (!context.user?.roles?.includes('ADMIN')) {
            throw new Error('Not authorized to subscribe to metrics');
          }
          return payload.metricsUpdated.dashboardId === variables.dashboardId;
        }
      ),
    },
  },
 
  Mutation: {
    sendMessage: async (_, { input }, context) => {
      // 認証チェック
      if (!context.user) {
        throw new GraphQLError('Not authenticated', {
          extensions: { code: 'UNAUTHENTICATED' },
        });
      }
 
      const message = await context.dataSources.messageAPI.create({
        ...input,
        authorId: context.user.id,
      });
 
      // Subscriptionに通知
      pubsub.publish(EVENTS.MESSAGE_ADDED, {
        messageAdded: message,
      });
 
      return { message, errors: [] };
    },
 
    updateOrderStatus: async (_, { orderId, status }, context) => {
      const order = await context.dataSources.orderAPI.updateStatus(
        orderId,
        status
      );
 
      // 注文ステータス変更を通知
      pubsub.publish(EVENTS.ORDER_STATUS_CHANGED, {
        orderStatusChanged: order,
      });
 
      // 顧客への通知も同時に発行
      pubsub.publish(EVENTS.NOTIFICATION_RECEIVED, {
        notificationReceived: {
          userId: order.customerId,
          type: 'ORDER_UPDATE',
          title: '注文ステータスが更新されました',
          body: `注文 #${orderId} のステータスが「${status}」に変更されました`,
          createdAt: new Date().toISOString(),
        },
      });
 
      return order;
    },
 
    setTypingStatus: async (_, { channelId, isTyping }, context) => {
      pubsub.publish(EVENTS.USER_TYPING, {
        userTyping: {
          user: context.user,
          channelId,
          isTyping,
        },
      });
      return true;
    },
  },
};
 
// Express + Apollo Server + WebSocket のセットアップ
const app = express();
const httpServer = createServer(app);
 
const schema = makeExecutableSchema({ typeDefs, resolvers });
 
// WebSocketサーバーのセットアップ
const wsServer = new WebSocketServer({
  server: httpServer,
  path: '/graphql',
});
 
const serverCleanup = useServer(
  {
    schema,
    context: async (ctx, msg, args) => {
      // WebSocket接続時の認証
      const token = ctx.connectionParams?.authorization;
      if (!token) {
        throw new Error('Missing authentication token');
      }
 
      const user = await authenticateUser(token);
      if (!user) {
        throw new Error('Invalid authentication token');
      }
 
      return { user };
    },
    onConnect: async (ctx) => {
      console.log('Client connected:', ctx.connectionParams);
      // 接続時のバリデーション
      const token = ctx.connectionParams?.authorization;
      if (!token) {
        return false; // 接続を拒否
      }
      return true;
    },
    onDisconnect: async (ctx, code, reason) => {
      console.log('Client disconnected:', code, reason);
      // ユーザーのオフライン状態を通知
      if (ctx.extra?.user) {
        pubsub.publish(EVENTS.USER_PRESENCE_CHANGED, {
          userPresenceChanged: {
            user: ctx.extra.user,
            isOnline: false,
            lastSeen: new Date().toISOString(),
            status: 'OFFLINE',
          },
        });
      }
    },
    onSubscribe: (ctx, msg) => {
      console.log('Subscription started:', msg.payload.query);
    },
    onNext: (ctx, msg, args, result) => {
      // 各メッセージ送信時のフック
      console.log('Sending subscription data');
    },
    onError: (ctx, msg, errors) => {
      console.error('Subscription error:', errors);
    },
    onComplete: (ctx, msg) => {
      console.log('Subscription completed');
    },
  },
  wsServer
);
 
// Apollo Server のセットアップ
const server = new ApolloServer({
  schema,
  plugins: [
    // HTTPサーバーの適切なシャットダウン
    ApolloServerPluginDrainHttpServer({ httpServer }),
    // WebSocketサーバーの適切なシャットダウン
    {
      async serverWillStart() {
        return {
          async drainServer() {
            await serverCleanup.dispose();
          },
        };
      },
    },
  ],
});
 
await server.start();
 
app.use(
  '/graphql',
  express.json(),
  expressMiddleware(server, {
    context: async ({ req }) => ({
      user: await authenticateUser(req.headers.authorization),
      dataSources: createDataSources(),
    }),
  })
);
 
httpServer.listen(4000, () => {
  console.log('Server running on http://localhost:4000/graphql');
  console.log('WebSocket running on ws://localhost:4000/graphql');
});

// プロダクション環境ではインメモリPubSubの代わりにRedis PubSubを使用
import { RedisPubSub } from 'graphql-redis-subscriptions';
import Redis from 'ioredis';
 
// Redis接続の設定
const redisOptions = {
  host: process.env.REDIS_HOST || 'localhost',
  port: parseInt(process.env.REDIS_PORT || '6379'),
  password: process.env.REDIS_PASSWORD,
  retryStrategy: (times) => {
    return Math.min(times * 50, 2000);
  },
  maxRetriesPerRequest: 3,
};
 
// PubSub用に別々のRedis接続を作成（推奨）
const pubsub = new RedisPubSub({
  publisher: new Redis(redisOptions),
  subscriber: new Redis(redisOptions),
  // メッセージのシリアライゼーション
  serializer: (data) => JSON.stringify(data),
  deserializer: (message) => JSON.parse(message),
  // 接続エラーハンドリング
  connectionListener: (err) => {
    if (err) {
      console.error('Redis connection error:', err);
    }
  },
});
 
// 複数サーバーインスタンスでの利用
// Server A で publish → Redis → Server B の subscriber に配信
// → 水平スケーリングが可能
 
// Kafka を使ったPubSub（大規模システム向け）
import { KafkaPubSub } from 'graphql-kafka-subscriptions';
 
const kafkaPubSub = await KafkaPubSub.create({
  topic: 'graphql-subscriptions',
  host: process.env.KAFKA_HOST || 'localhost',
  port: process.env.KAFKA_PORT || '9092',
  groupIdPrefix: 'graphql-server',
  globalConfig: {
    'client.id': 'graphql-subscriptions-client',
  },
});

// Apollo Client のWebSocket設定
import { ApolloClient, InMemoryCache, split, HttpLink } from '@apollo/client';
import { GraphQLWsLink } from '@apollo/client/link/subscriptions';
import { createClient } from 'graphql-ws';
import { getMainDefinition } from '@apollo/client/utilities';
 
// HTTP リンク（Query, Mutation用）
const httpLink = new HttpLink({
  uri: 'https://api.example.com/graphql',
  headers: {
    authorization: `Bearer ${getToken()}`,
  },
});
 
// WebSocket リンク（Subscription用）
const wsLink = new GraphQLWsLink(
  createClient({
    url: 'wss://api.example.com/graphql',
    connectionParams: () => ({
      authorization: `Bearer ${getToken()}`,
    }),
    // 再接続設定
    retryAttempts: 5,
    shouldRetry: () => true,
    retryWait: async (retryCount) => {
      // 指数バックオフ
      const delay = Math.min(1000 * Math.pow(2, retryCount), 30000);
      await new Promise((resolve) => setTimeout(resolve, delay));
    },
    on: {
      connected: () => console.log('WebSocket connected'),
      closed: (event) => console.log('WebSocket closed:', event),
      error: (error) => console.error('WebSocket error:', error),
    },
    // KeepAlive設定
    keepAlive: 10000, // 10秒ごとにping
  })
);
 
// 操作タイプに応じてリンクを振り分け
const splitLink = split(
  ({ query }) => {
    const definition = getMainDefinition(query);
    return (
      definition.kind === 'OperationDefinition' &&
      definition.operation === 'subscription'
    );
  },
  wsLink,   // Subscription → WebSocket
  httpLink  // Query, Mutation → HTTP
);
 
const client = new ApolloClient({
  link: splitLink,
  cache: new InMemoryCache(),
});

// React コンポーネントでの利用
import { useSubscription, useQuery, gql } from '@apollo/client';
import { useCallback, useEffect, useState } from 'react';
 
const MESSAGE_SUBSCRIPTION = gql`
  subscription OnMessageAdded($channelId: ID!) {
    messageAdded(channelId: $channelId) {
      id
      content
      author {
        id
        name
        avatar
      }
      createdAt
    }
  }
`;
 
const GET_MESSAGES = gql`
  query GetMessages($channelId: ID!, $first: Int!, $after: String) {
    messages(channelId: $channelId, first: $first, after: $after) {
      edges {
        node {
          id
          content
          author {
            id
            name
            avatar
          }
          createdAt
        }
        cursor
      }
      pageInfo {
        hasNextPage
        endCursor
      }
    }
  }
`;
 
function ChatMessages({ channelId }) {
  // 既存メッセージの取得
  const { data, loading, fetchMore, subscribeToMore } = useQuery(
    GET_MESSAGES,
    {
      variables: { channelId, first: 50 },
    }
  );
 
  // subscribeToMore で既存クエリに新しいメッセージを追加
  useEffect(() => {
    const unsubscribe = subscribeToMore({
      document: MESSAGE_SUBSCRIPTION,
      variables: { channelId },
      updateQuery: (prev, { subscriptionData }) => {
        if (!subscriptionData.data) return prev;
 
        const newMessage = subscriptionData.data.messageAdded;
 
        // 重複チェック
        const exists = prev.messages.edges.some(
          (edge) => edge.node.id === newMessage.id
        );
        if (exists) return prev;
 
        return {
          ...prev,
          messages: {
            ...prev.messages,
            edges: [
              {
                __typename: 'MessageEdge',
                node: newMessage,
                cursor: newMessage.id,
              },
              ...prev.messages.edges,
            ],
          },
        };
      },
    });
 
    return () => unsubscribe();
  }, [channelId, subscribeToMore]);
 
  if (loading) return <div>Loading...</div>;
 
  return (
    <div className="chat-messages">
      {data?.messages.edges.map(({ node: message }) => (
        <div key={message.id} className="message">
          <img src={message.author.avatar} alt={message.author.name} />
          <div>
            <strong>{message.author.name}</strong>
            <p>{message.content}</p>
            <small>{new Date(message.createdAt).toLocaleString()}</small>
          </div>
        </div>
      ))}
    </div>
  );
}
 
// タイピングインジケーターの実装
const TYPING_SUBSCRIPTION = gql`
  subscription OnUserTyping($channelId: ID!) {
    userTyping(channelId: $channelId) {
      user {
        id
        name
      }
      isTyping
    }
  }
`;
 
function TypingIndicator({ channelId }) {
  const [typingUsers, setTypingUsers] = useState(new Map());
 
  const { data } = useSubscription(TYPING_SUBSCRIPTION, {
    variables: { channelId },
    onData: ({ data: { data } }) => {
      if (!data) return;
 
      const { user, isTyping } = data.userTyping;
 
      setTypingUsers((prev) => {
        const next = new Map(prev);
        if (isTyping) {
          next.set(user.id, { name: user.name, timestamp: Date.now() });
        } else {
          next.delete(user.id);
        }
        return next;
      });
    },
  });
 
  // 5秒後にタイピング状態を自動クリア
  useEffect(() => {
    const interval = setInterval(() => {
      setTypingUsers((prev) => {
        const now = Date.now();
        const next = new Map();
        prev.forEach((value, key) => {
          if (now - value.timestamp < 5000) {
            next.set(key, value);
          }
        });
        return next;
      });
    }, 1000);
 
    return () => clearInterval(interval);
  }, []);
 
  if (typingUsers.size === 0) return null;
 
  const names = Array.from(typingUsers.values()).map((u) => u.name);
 
  return (
    <div className="typing-indicator">
      {names.length === 1
        ? `${names[0]} is typing...`
        : names.length === 2
          ? `${names[0]} and ${names[1]} are typing...`
          : `${names.length} people are typing...`}
    </div>
  );
}

// DataLoader による解決
import DataLoader from 'dataloader';
 
// === バッチ関数の基本パターン ===
 
// パターン1: 1対1（ユーザーIDからユーザーを取得）
const userLoader = new DataLoader(async (userIds) => {
  console.log(`Batch loading users: [${userIds.join(', ')}]`);
 
  // 1回のクエリで全ユーザーを取得
  const users = await db.query(
    'SELECT * FROM users WHERE id = ANY($1)',
    [userIds]
  );
 
  // 入力IDの順序を保持してマッピング
  const userMap = new Map(users.map(u => [u.id, u]));
  return userIds.map(id => userMap.get(id) || null);
});
 
// パターン2: 1対多（ユーザーIDから注文一覧を取得）
const ordersByUserLoader = new DataLoader(async (userIds) => {
  console.log(`Batch loading orders for users: [${userIds.join(', ')}]`);
 
  const orders = await db.query(
    'SELECT * FROM orders WHERE user_id = ANY($1) ORDER BY created_at DESC',
    [userIds]
  );
 
  // userIdでグループ化して返す
  const orderMap = new Map();
  orders.forEach(order => {
    if (!orderMap.has(order.userId)) {
      orderMap.set(order.userId, []);
    }
    orderMap.get(order.userId).push(order);
  });
 
  return userIds.map(id => orderMap.get(id) || []);
});
 
// パターン3: 条件付きローダー（ステータスでフィルタ）
const activeOrdersByUserLoader = new DataLoader(async (keys) => {
  // keysは { userId, status } のオブジェクト配列
  const userIds = [...new Set(keys.map(k => k.userId))];
  const statuses = [...new Set(keys.map(k => k.status))];
 
  const orders = await db.query(
    'SELECT * FROM orders WHERE user_id = ANY($1) AND status = ANY($2)',
    [userIds, statuses]
  );
 
  return keys.map(key =>
    orders.filter(o => o.userId === key.userId && o.status === key.status)
  );
}, {
  // カスタムキャッシュキー（オブジェクトをキーにする場合に必要）
  cacheKeyFn: (key) => `${key.userId}:${key.status}`,
});
 
// リゾルバーでDataLoaderを使用
const resolvers = {
  User: {
    orders: (user, _, context) => context.loaders.ordersByUserLoader.load(user.id),
    activeOrders: (user, _, context) =>
      context.loaders.activeOrdersByUserLoader.load({
        userId: user.id,
        status: 'ACTIVE',
      }),
    // 集計もDataLoaderで効率化
    orderCount: async (user, _, context) => {
      const orders = await context.loaders.ordersByUserLoader.load(user.id);
      return orders.length;
    },
  },
  Order: {
    customer: (order, _, context) => context.loaders.userLoader.load(order.userId),
    items: (order, _, context) => context.loaders.orderItemsLoader.load(order.id),
  },
  OrderItem: {
    product: (item, _, context) => context.loaders.productLoader.load(item.productId),
  },
};
 
// 実行されるSQL（DataLoader使用後）:
//   SELECT * FROM users LIMIT 10;                          -- 1回
//   SELECT * FROM orders WHERE user_id = ANY([1,2,...10]); -- 1回
//   SELECT * FROM products WHERE id = ANY([...]);          -- 1回
// -> 合計3クエリ（N+1が解消）

// DataLoaderのコンテキスト設定
// 重要: DataLoaderはリクエストごとに新しいインスタンスを作る
// → キャッシュの不整合を防ぐため
 
function createLoaders(db) {
  return {
    // ユーザーローダー
    userLoader: new DataLoader(async (ids) => {
      const users = await db.query(
        'SELECT * FROM users WHERE id = ANY($1)', [ids]
      );
      const userMap = new Map(users.map(u => [u.id, u]));
      return ids.map(id => userMap.get(id) || null);
    }, {
      // オプション設定
      batch: true,          // バッチ処理を有効化（デフォルト: true）
      maxBatchSize: 100,    // 1バッチの最大サイズ
      cache: true,          // キャッシュを有効化（デフォルト: true）
      batchScheduleFn: (callback) => setTimeout(callback, 10),
      // 10ms待ってからバッチ実行（より多くのリクエストをまとめる）
    }),
 
    // 注文ローダー
    ordersByUserLoader: new DataLoader(async (userIds) => {
      const orders = await db.query(
        'SELECT * FROM orders WHERE user_id = ANY($1) ORDER BY created_at DESC',
        [userIds]
      );
      const map = new Map();
      orders.forEach(o => {
        if (!map.has(o.userId)) map.set(o.userId, []);
        map.get(o.userId).push(o);
      });
      return userIds.map(id => map.get(id) || []);
    }),
 
    // 商品ローダー
    productLoader: new DataLoader(async (ids) => {
      const products = await db.query(
        'SELECT * FROM products WHERE id = ANY($1)', [ids]
      );
      const map = new Map(products.map(p => [p.id, p]));
      return ids.map(id => map.get(id) || null);
    }),
 
    // 注文アイテムローダー
    orderItemsLoader: new DataLoader(async (orderIds) => {
      const items = await db.query(
        `SELECT oi.*, p.name as product_name, p.price
         FROM order_items oi
         JOIN products p ON oi.product_id = p.id
         WHERE oi.order_id = ANY($1)`,
        [orderIds]
      );
      const map = new Map();
      items.forEach(item => {
        if (!map.has(item.orderId)) map.set(item.orderId, []);
        map.get(item.orderId).push(item);
      });
      return orderIds.map(id => map.get(id) || []);
    }),
 
    // カテゴリ別商品ローダー
    productsByCategoryLoader: new DataLoader(async (categoryIds) => {
      const products = await db.query(
        'SELECT * FROM products WHERE category_id = ANY($1) ORDER BY name',
        [categoryIds]
      );
      const map = new Map();
      products.forEach(p => {
        if (!map.has(p.categoryId)) map.set(p.categoryId, []);
        map.get(p.categoryId).push(p);
      });
      return categoryIds.map(id => map.get(id) || []);
    }),
  };
}
 
// Apollo Server のコンテキスト
const server = new ApolloServer({
  typeDefs,
  resolvers,
});
 
const { url } = await startStandaloneServer(server, {
  context: async ({ req }) => ({
    user: await authenticateUser(req),
    loaders: createLoaders(db), // リクエストごとに新規作成
    dataSources: createDataSources(),
  }),
});

// DataLoaderの高度な利用パターン
 
// 1. プライミング（事前にキャッシュをセット）
const resolvers = {
  Mutation: {
    createUser: async (_, { input }, { loaders }) => {
      const user = await db.query(
        'INSERT INTO users (name, email) VALUES ($1, $2) RETURNING *',
        [input.name, input.email]
      );
 
      // 作成したユーザーをDataLoaderのキャッシュに事前登録
      // → 後続のリゾルバーでDBクエリを回避
      loaders.userLoader.prime(user.id, user);
 
      return { user, errors: [] };
    },
  },
};
 
// 2. キャッシュのクリア
async function updateUser(id, input, loaders) {
  const user = await db.query(
    'UPDATE users SET name = $2 WHERE id = $1 RETURNING *',
    [id, input.name]
  );
 
  // 古いキャッシュをクリアして新しいデータをセット
  loaders.userLoader.clear(id);
  loaders.userLoader.prime(id, user);
 
  return user;
}
 
// 3. 全キャッシュのクリア
function clearAllLoaderCaches(loaders) {
  Object.values(loaders).forEach(loader => {
    if (loader instanceof DataLoader) {
      loader.clearAll();
    }
  });
}
 
// 4. エラーハンドリング付きバッチ関数
const robustUserLoader = new DataLoader(async (ids) => {
  try {
    const users = await db.query(
      'SELECT * FROM users WHERE id = ANY($1)', [ids]
    );
    const userMap = new Map(users.map(u => [u.id, u]));
 
    return ids.map(id => {
      const user = userMap.get(id);
      if (!user) {
        // 個別のエラーを返す（バッチ全体を失敗させない）
        return new Error(`User not found: ${id}`);
      }
      return user;
    });
  } catch (error) {
    // DBエラーの場合は全IDに対してエラーを返す
    return ids.map(() => new Error(`Database error: ${error.message}`));
  }
});

// Apollo Client の正規化キャッシュ
import { InMemoryCache, makeVar } from '@apollo/client';
 
const cache = new InMemoryCache({
  typePolicies: {
    // ユーザー型のキャッシュ設定
    User: {
      keyFields: ['id'], // idフィールドでキャッシュのキーを生成
      fields: {
        // フルネームの計算フィールド
        fullName: {
          read(_, { readField }) {
            const firstName = readField('firstName');
            const lastName = readField('lastName');
            return `${firstName} ${lastName}`;
          },
        },
      },
    },
 
    // 商品型のキャッシュ設定
    Product: {
      keyFields: ['sku'], // SKUをキーとして使用（idの代わり）
      fields: {
        // 価格の表示フォーマット
        formattedPrice: {
          read(_, { readField }) {
            const price = readField('price');
            return `¥${price.toLocaleString()}`;
          },
        },
      },
    },
 
    // クエリフィールドのキャッシュ設定
    Query: {
      fields: {
        // usersクエリのキャッシュとページネーション
        users: {
          keyArgs: ['filter', 'sort'], // これらの引数でキャッシュを分ける
          merge(existing, incoming, { args }) {
            // ページネーションのマージ
            if (!existing) return incoming;
            if (args?.after) {
              // 追加読み込み（infinite scroll）
              return {
                ...incoming,
                edges: [...existing.edges, ...incoming.edges],
              };
            }
            // 新規取得（フィルタ変更等）
            return incoming;
          },
          read(existing, { args }) {
            // キャッシュからの読み取り
            return existing;
          },
        },
 
        // 単一ユーザーのキャッシュ参照
        user: {
          read(_, { args, toReference }) {
            // キャッシュに既にあるユーザーを参照
            return toReference({
              __typename: 'User',
              id: args.id,
            });
          },
        },
 
        // 検索結果のキャッシュ
        search: {
          keyArgs: ['query', 'type'],
          merge(existing = { results: [] }, incoming) {
            return {
              ...incoming,
              results: [...existing.results, ...incoming.results],
            };
          },
        },
      },
    },
 
    // ページネーション接続のキャッシュ設定
    UserConnection: {
      fields: {
        edges: {
          merge(existing = [], incoming) {
            return [...existing, ...incoming];
          },
        },
      },
    },
  },
 
  // 可能なタイプの定義（Union/Interfaceの解決用）
  possibleTypes: {
    SearchResult: ['User', 'Product', 'Order'],
    Node: ['User', 'Product', 'Order', 'Category'],
  },
});
 
// === キャッシュの手動操作 ===
 
// 1. キャッシュの直接更新
client.cache.modify({
  id: client.cache.identify({ __typename: 'User', id: '123' }),
  fields: {
    name: () => 'Updated Name',
    email: (prevEmail) => prevEmail, // 変更しない
    orderCount: (prevCount) => prevCount + 1,
  },
});
 
// 2. キャッシュへの書き込み
client.cache.writeQuery({
  query: GET_USER,
  variables: { id: '123' },
  data: {
    user: {
      __typename: 'User',
      id: '123',
      name: 'New User',
      email: 'new@example.com',
    },
  },
});
 
// 3. キャッシュからの読み取り
const cachedUser = client.cache.readQuery({
  query: GET_USER,
  variables: { id: '123' },
});
 
// 4. キャッシュからの削除（evict）
client.cache.evict({
  id: client.cache.identify({ __typename: 'User', id: '123' }),
});
// ガベージコレクション（参照されなくなったオブジェクトを削除）
client.cache.gc();
 
// 5. Reactive Variables（ローカルステート管理）
const isLoggedInVar = makeVar(false);
const cartItemsVar = makeVar([]);
 
const cache2 = new InMemoryCache({
  typePolicies: {
    Query: {
      fields: {
        isLoggedIn: {
          read() {
            return isLoggedInVar();
          },
        },
        cartItems: {
          read() {
            return cartItemsVar();
          },
        },
      },
    },
  },
});
 
// Reactive Variableの更新（自動的にUIが再レンダリングされる）
isLoggedInVar(true);
cartItemsVar([...cartItemsVar(), { productId: '123', quantity: 1 }]);

// Automatic Persisted Queries (APQ)
// → クエリ文字列をSHA256ハッシュに変換してGETリクエストに
 
import { createPersistedQueryLink } from '@apollo/client/link/persisted-queries';
import { sha256 } from 'crypto-hash';
 
const persistedQueryLink = createPersistedQueryLink({
  sha256,
  useGETForHashedQueries: true, // GETリクエストを使用 → CDNキャッシュ可能
});
 
const client = new ApolloClient({
  link: persistedQueryLink.concat(httpLink),
  cache: new InMemoryCache(),
});
 
// APQの動作フロー:
// 1. 初回: GET /graphql?extensions={"persistedQuery":{"sha256Hash":"abc..."}}
// 2. サーバー: "PersistedQueryNotFound" を返す
// 3. クライアント: POST /graphql でフルクエリを送信
// 4. サーバー: クエリをハッシュと紐付けて保存
// 5. 次回以降: GET /graphql?extensions={"persistedQuery":{"sha256Hash":"abc..."}}
//    → CDNでキャッシュ可能！
 
// サーバー側の設定（Apollo Server）
const server = new ApolloServer({
  typeDefs,
  resolvers,
  persistedQueries: {
    // Redisキャッシュで永続化
    cache: new KeyValueCache({
      url: process.env.REDIS_URL,
      ttl: 86400, // 24時間
    }),
  },
});

// @cacheControl ディレクティブによるキャッシュ制御
const typeDefs = gql`
  # ディレクティブ定義
  enum CacheControlScope {
    PUBLIC
    PRIVATE
  }
 
  directive @cacheControl(
    maxAge: Int
    scope: CacheControlScope
    inheritMaxAge: Boolean
  ) on FIELD_DEFINITION | OBJECT | INTERFACE | UNION
 
  # 型レベルのキャッシュ設定
  type Product @cacheControl(maxAge: 3600) {
    id: ID!
    name: String!
    description: String!
    price: Float! @cacheControl(maxAge: 300)  # 価格は5分
    inventory: Int! @cacheControl(maxAge: 30) # 在庫は30秒
  }
 
  type User @cacheControl(maxAge: 0, scope: PRIVATE) {
    id: ID!
    name: String!
    email: String!
    orders: [Order!]! @cacheControl(maxAge: 60, scope: PRIVATE)
  }
 
  type Query {
    products(category: String): [Product!]! @cacheControl(maxAge: 600)
    product(id: ID!): Product @cacheControl(maxAge: 3600)
    me: User @cacheControl(maxAge: 0, scope: PRIVATE)
  }
`;
 
// Redisを使ったリゾルバーレベルのキャッシュ
import Redis from 'ioredis';
 
const redis = new Redis(process.env.REDIS_URL);
 
function withCache(resolver, options = {}) {
  const { ttl = 300, keyPrefix = 'gql' } = options;
 
  return async (parent, args, context, info) => {
    const cacheKey = `${keyPrefix}:${info.fieldName}:${JSON.stringify(args)}`;
 
    // キャッシュチェック
    const cached = await redis.get(cacheKey);
    if (cached) {
      return JSON.parse(cached);
    }
 
    // リゾルバー実行
    const result = await resolver(parent, args, context, info);
 
    // キャッシュに保存
    await redis.setex(cacheKey, ttl, JSON.stringify(result));
 
    return result;
  };
}
 
// 利用例
const resolvers = {
  Query: {
    products: withCache(
      async (_, { category }, { dataSources }) => {
        return dataSources.productAPI.getProducts({ category });
      },
      { ttl: 600, keyPrefix: 'products' }
    ),
 
    product: withCache(
      async (_, { id }, { dataSources }) => {
        return dataSources.productAPI.getProduct(id);
      },
      { ttl: 3600, keyPrefix: 'product' }
    ),
  },
};
 
// キャッシュの無効化
async function invalidateProductCache(productId) {
  // 個別商品のキャッシュを削除
  await redis.del(`product:product:{"id":"${productId}"}`);
 
  // 商品一覧のキャッシュを全て削除
  const keys = await redis.keys('products:products:*');
  if (keys.length > 0) {
    await redis.del(...keys);
  }
}

# GraphQLの2つのエラーパターン
 
# (1) トップレベルエラー（GraphQL仕様のerrors配列）
# -> 認証エラー、構文エラー、サーバーエラー
# -> クライアントが予期できないエラー
{
  "data": null,
  "errors": [
    {
      "message": "Not authenticated",
      "locations": [{ "line": 2, "column": 3 }],
      "path": ["user"],
      "extensions": {
        "code": "UNAUTHENTICATED",
        "http": { "status": 401 }
      }
    }
  ]
}
 
# (2) ビジネスロジックエラー（Payload内のerrors）
# -> バリデーション、ビジネスルール違反
# -> クライアントが処理すべきエラー
{
  "data": {
    "createUser": {
      "user": null,
      "errors": [
        {
          "field": "email",
          "message": "Already exists",
          "code": "ALREADY_EXISTS"
        }
      ]
    }
  }
}
 
# (3) 部分成功パターン
# -> 一部のフィールドはnull、他は正常に返る
{
  "data": {
    "user": {
      "name": "Alice",
      "orders": null,
      "profile": {
        "bio": "Developer"
      }
    }
  },
  "errors": [
    {
      "message": "Failed to fetch orders",
      "path": ["user", "orders"],
      "extensions": { "code": "INTERNAL_SERVER_ERROR" }
    }
  ]
}

# Result型パターン: Union型でエラーを型安全に表現
# → GraphQLの型システムを活用した最も堅牢な方法
 
# エラー型の定義
interface UserError {
  message: String!
  path: [String!]
}
 
type ValidationError implements UserError {
  message: String!
  path: [String!]
  field: String!
  constraint: String!
}
 
type NotFoundError implements UserError {
  message: String!
  path: [String!]
  resourceType: String!
  resourceId: ID!
}
 
type AuthorizationError implements UserError {
  message: String!
  path: [String!]
  requiredPermission: String!
}
 
type BusinessRuleError implements UserError {
  message: String!
  path: [String!]
  code: String!
  details: JSON
}
 
# Mutation結果のUnion型
union CreateUserResult = CreateUserSuccess | ValidationError | AuthorizationError
 
type CreateUserSuccess {
  user: User!
}
 
union UpdateOrderResult =
  | UpdateOrderSuccess
  | NotFoundError
  | AuthorizationError
  | BusinessRuleError
 
type UpdateOrderSuccess {
  order: Order!
}
 
type Mutation {
  createUser(input: CreateUserInput!): CreateUserResult!
  updateOrder(id: ID!, input: UpdateOrderInput!): UpdateOrderResult!
}
 
# クライアント側のクエリ
mutation CreateUser($input: CreateUserInput!) {
  createUser(input: $input) {
    ... on CreateUserSuccess {
      user {
        id
        name
        email
      }
    }
    ... on ValidationError {
      message
      field
      constraint
    }
    ... on AuthorizationError {
      message
      requiredPermission
    }
  }
}

// サーバー側のエラーハンドリング
import { GraphQLError } from 'graphql';
 
// カスタムエラークラスの定義
class AppError extends GraphQLError {
  constructor(message, code, extensions = {}) {
    super(message, {
      extensions: {
        code,
        ...extensions,
      },
    });
  }
}
 
class AuthenticationError extends AppError {
  constructor(message = 'Not authenticated') {
    super(message, 'UNAUTHENTICATED', { http: { status: 401 } });
  }
}
 
class ForbiddenError extends AppError {
  constructor(message = 'Not authorized') {
    super(message, 'FORBIDDEN', { http: { status: 403 } });
  }
}
 
class NotFoundError extends AppError {
  constructor(resource, id) {
    super(`${resource} not found: ${id}`, 'NOT_FOUND', {
      http: { status: 404 },
      resource,
      resourceId: id,
    });
  }
}
 
class ValidationError extends AppError {
  constructor(errors) {
    super('Validation failed', 'VALIDATION_ERROR', {
      http: { status: 400 },
      validationErrors: errors,
    });
  }
}
 
class RateLimitError extends AppError {
  constructor(retryAfter) {
    super('Rate limit exceeded', 'RATE_LIMITED', {
      http: { status: 429 },
      retryAfter,
    });
  }
}
 
// リゾルバーでの使用
const resolvers = {
  Query: {
    user: async (_, { id }, context) => {
      // 認証チェック
      if (!context.user) {
        throw new AuthenticationError();
      }
 
      // 権限チェック
      if (!context.user.canViewUser(id)) {
        throw new ForbiddenError('You do not have permission to view this user');
      }
 
      const user = await context.dataSources.userAPI.getUser(id);
      if (!user) {
        throw new NotFoundError('User', id);
      }
 
      return user;
    },
  },
 
  Mutation: {
    createUser: async (_, { input }, context) => {
      // バリデーション
      const validationErrors = validateCreateUserInput(input);
      if (validationErrors.length > 0) {
        // Result型パターンの場合
        return {
          __typename: 'ValidationError',
          message: 'Validation failed',
          field: validationErrors[0].field,
          constraint: validationErrors[0].constraint,
          path: ['createUser'],
        };
      }
 
      try {
        const user = await context.dataSources.userAPI.create(input);
        return {
          __typename: 'CreateUserSuccess',
          user,
        };
      } catch (error) {
        if (error.code === 'UNIQUE_VIOLATION') {
          return {
            __typename: 'ValidationError',
            message: 'Email already exists',
            field: 'email',
            constraint: 'unique',
            path: ['createUser', 'input', 'email'],
          };
        }
        throw error; // 予期しないエラーはトップレベルに
      }
    },
 
    updateOrder: async (_, { id, input }, context) => {
      if (!context.user) {
        return {
          __typename: 'AuthorizationError',
          message: 'Authentication required',
          requiredPermission: 'orders:write',
          path: ['updateOrder'],
        };
      }
 
      const order = await context.dataSources.orderAPI.getOrder(id);
      if (!order) {
        return {
          __typename: 'NotFoundError',
          message: `Order not found: ${id}`,
          resourceType: 'Order',
          resourceId: id,
          path: ['updateOrder'],
        };
      }
 
      // ビジネスルールチェック
      if (order.status === 'SHIPPED' && input.status === 'CANCELLED') {
        return {
          __typename: 'BusinessRuleError',
          message: 'Cannot cancel a shipped order',
          code: 'ORDER_ALREADY_SHIPPED',
          details: { currentStatus: order.status, requestedStatus: input.status },
          path: ['updateOrder'],
        };
      }
 
      const updated = await context.dataSources.orderAPI.update(id, input);
      return {
        __typename: 'UpdateOrderSuccess',
        order: updated,
      };
    },
  },
};
 
// グローバルエラーフォーマッター
const server = new ApolloServer({
  typeDefs,
  resolvers,
  formatError: (formattedError, error) => {
    // 内部エラーの詳細をログに記録
    console.error('GraphQL Error:', {
      message: formattedError.message,
      code: formattedError.extensions?.code,
      path: formattedError.path,
      originalError: error,
    });
 
    // プロダクション環境では内部エラーの詳細を隠す
    if (process.env.NODE_ENV === 'production') {
      if (formattedError.extensions?.code === 'INTERNAL_SERVER_ERROR') {
        return {
          ...formattedError,
          message: 'An internal error occurred',
          extensions: {
            code: 'INTERNAL_SERVER_ERROR',
          },
        };
      }
    }
 
    // スタックトレースを削除
    delete formattedError.extensions?.stacktrace;
 
    return formattedError;
  },
});

// クライアント側のエラーハンドリング（React + Apollo Client）
import { ApolloError, useQuery, useMutation } from '@apollo/client';
 
// エラーリンクの設定
import { onError } from '@apollo/client/link/error';
 
const errorLink = onError(({ graphQLErrors, networkError, operation, forward }) => {
  if (graphQLErrors) {
    for (const error of graphQLErrors) {
      switch (error.extensions?.code) {
        case 'UNAUTHENTICATED':
          // トークンリフレッシュを試みる
          const oldHeaders = operation.getContext().headers;
          return fromPromise(
            refreshToken().then((newToken) => {
              operation.setContext({
                headers: {
                  ...oldHeaders,
                  authorization: `Bearer ${newToken}`,
                },
              });
              return forward(operation);
            })
          ).flatMap((result) => result);
 
        case 'FORBIDDEN':
          // 権限エラーページへリダイレクト
          window.location.href = '/forbidden';
          break;
 
        case 'RATE_LIMITED':
          // リトライ
          const retryAfter = error.extensions?.retryAfter || 60;
          console.warn(`Rate limited. Retrying after ${retryAfter}s`);
          break;
 
        default:
          console.error('GraphQL Error:', error.message);
      }
    }
  }
 
  if (networkError) {
    console.error('Network Error:', networkError);
 
    if ('statusCode' in networkError) {
      switch (networkError.statusCode) {
        case 503:
          // サービス一時停止
          showMaintenanceNotification();
          break;
        case 502:
        case 504:
          // ゲートウェイエラー → リトライ
          return forward(operation);
      }
    }
  }
});
 
// React コンポーネントでのエラーハンドリング
function UserProfile({ userId }: { userId: string }) {
  const { data, loading, error } = useQuery(GET_USER, {
    variables: { id: userId },
    errorPolicy: 'all', // エラーがあっても部分データを受け取る
  });
 
  if (loading) return <LoadingSpinner />;
 
  if (error) {
    // ネットワークエラー
    if (error.networkError) {
      return <NetworkErrorMessage onRetry={() => window.location.reload()} />;
    }
 
    // GraphQLエラー
    const authError = error.graphQLErrors?.find(
      (e) => e.extensions?.code === 'UNAUTHENTICATED'
    );
    if (authError) {
      return <LoginPrompt />;
    }
 
    const notFoundError = error.graphQLErrors?.find(
      (e) => e.extensions?.code === 'NOT_FOUND'
    );
    if (notFoundError) {
      return <NotFoundPage resource="User" />;
    }
 
    return <GenericErrorMessage error={error} />;
  }
 
  // 部分データの表示（errorsがあってもdataは利用可能）
  return (
    <div>
      <h1>{data.user.name}</h1>
      {data.user.orders ? (
        <OrderList orders={data.user.orders} />
      ) : (
        <p>注文データの取得に失敗しました</p>
      )}
    </div>
  );
}
 
// Mutation のエラーハンドリング（Result型パターン）
function CreateUserForm() {
  const [createUser, { loading }] = useMutation(CREATE_USER);
 
  const handleSubmit = async (input: CreateUserInput) => {
    try {
      const { data } = await createUser({ variables: { input } });
 
      const result = data.createUser;
 
      switch (result.__typename) {
        case 'CreateUserSuccess':
          toast.success('ユーザーが作成されました');
          navigate(`/users/${result.user.id}`);
          break;
 
        case 'ValidationError':
          toast.error(`${result.field}: ${result.message}`);
          break;
 
        case 'AuthorizationError':
          toast.error('権限がありません');
          break;
      }
    } catch (error) {
      // ネットワークエラー等の予期しないエラー
      if (error instanceof ApolloError) {
        toast.error('通信エラーが発生しました。再度お試しください。');
      }
    }
  };
 
  return <UserForm onSubmit={handleSubmit} loading={loading} />;
}

// セキュリティ対策の実装
 
// (1) クエリ深さ制限
import depthLimit from 'graphql-depth-limit';
 
// (2) クエリコスト分析
import {
  createComplexityRule,
  simpleEstimator,
  fieldExtensionsEstimator,
} from 'graphql-query-complexity';
 
// (3) クエリ数制限（エイリアス攻撃対策）
import { createComplexityLimitRule } from 'graphql-validation-complexity';
 
const server = new ApolloServer({
  typeDefs,
  resolvers,
  validationRules: [
    // 最大7階層のネスト
    depthLimit(7, { ignore: ['__schema'] }),
 
    // クエリコスト制限
    createComplexityRule({
      maximumComplexity: 1000,
      estimators: [
        fieldExtensionsEstimator(),
        simpleEstimator({ defaultComplexity: 1 }),
      ],
      onComplete: (complexity) => {
        console.log('Query Complexity:', complexity);
        // メトリクス記録
        metrics.recordComplexity(complexity);
      },
    }),
  ],
 
  // イントロスペクションの無効化（本番環境）
  introspection: process.env.NODE_ENV !== 'production',
 
  // フィールドサジェスションの無効化
  includeStacktraceInErrorResponses: false,
 
  plugins: [
    // CSRF対策
    {
      async requestDidStart() {
        return {
          async didResolveOperation(requestContext) {
            // Content-Type チェック
            const contentType = requestContext.request.http?.headers.get('content-type');
            if (!contentType?.includes('application/json')) {
              throw new GraphQLError('Content-Type must be application/json');
            }
          },
        };
      },
    },
 
    // ロギングプラグイン
    {
      async requestDidStart(requestContext) {
        const start = Date.now();
        return {
          async willSendResponse(requestContext) {
            const duration = Date.now() - start;
            console.log({
              operation: requestContext.request.operationName,
              duration,
              errors: requestContext.errors?.length || 0,
            });
          },
        };
      },
    },
  ],
});
 
// (4) レート制限（フィールドレベル）
import { mapSchema, getDirective, MapperKind } from '@graphql-tools/utils';
 
const rateLimitDirectiveTypeDefs = `
  directive @rateLimit(
    max: Int!
    window: String!
    message: String
  ) on FIELD_DEFINITION
`;
 
function rateLimitDirective(directiveName = 'rateLimit') {
  return {
    rateLimitDirectiveTypeDefs,
    rateLimitDirectiveTransformer: (schema) =>
      mapSchema(schema, {
        [MapperKind.OBJECT_FIELD]: (fieldConfig) => {
          const directive = getDirective(schema, fieldConfig, directiveName)?.[0];
          if (!directive) return fieldConfig;
 
          const { max, window: windowStr, message } = directive;
          const originalResolve = fieldConfig.resolve;
 
          fieldConfig.resolve = async (source, args, context, info) => {
            const key = `rateLimit:${context.user?.id || context.ip}:${info.fieldName}`;
            const current = await redis.incr(key);
 
            if (current === 1) {
              await redis.expire(key, parseWindow(windowStr));
            }
 
            if (current > max) {
              throw new GraphQLError(
                message || `Rate limit exceeded for ${info.fieldName}`,
                { extensions: { code: 'RATE_LIMITED' } }
              );
            }
 
            return originalResolve(source, args, context, info);
          };
 
          return fieldConfig;
        },
      }),
  };
}
 
// スキーマでの使用
const typeDefs = gql`
  ${rateLimitDirectiveTypeDefs}
 
  type Query {
    login(email: String!, password: String!): AuthPayload!
      @rateLimit(max: 5, window: "15m", message: "Too many login attempts")
 
    search(query: String!): [SearchResult!]!
      @rateLimit(max: 30, window: "1m")
 
    sendPasswordReset(email: String!): Boolean!
      @rateLimit(max: 3, window: "1h")
  }
`;