diff --git a/README.md b/README.md index 2c04441..c4b36d5 100644 --- a/README.md +++ b/README.md @@ -57,7 +57,7 @@ It will additionally remove the `@cache` directive and forward only the pure que There are no changes on your implementation required. ```js -import { proxyCacheMiddleware, InMemoryCache } from 'apollo-proxy-cache' +import { createProxyCacheMiddleware, InMemoryCache } from 'apollo-proxy-cache' import express from 'express' const queryCache = new InMemoryCache() import bodyParser from 'body-parser' @@ -66,11 +66,14 @@ const proxyMiddlewareFactory = proxyCacheMiddleware(queryCache) const app = express() app.use(bodyParser.json()) // setup body-parser before (or anything else that populates request.body). -proxyMiddlewareFactory( - app, - '/graphql', /* the endpoint (will be proxied from localhost/graphql to target)*/ +const { directiveMiddleware, proxyMiddleware } = proxyMiddlewareFactory( { target: "http://graphql-server.com", changeOrigin: true } /* configuration object for http-proxy-middleware */ ) +// directive middleware to remove directives and handle caching +app.use( '/graphql', directiveMiddleware) + +// the proxy itself +app.use( '/graphql', proxyMiddleware) ``` diff --git a/src/proxyCacheMiddleware.ts b/src/createProxyCacheMiddleware.ts similarity index 86% rename from src/proxyCacheMiddleware.ts rename to src/createProxyCacheMiddleware.ts index 4f4a525..461014e 100644 --- a/src/proxyCacheMiddleware.ts +++ b/src/createProxyCacheMiddleware.ts @@ -2,7 +2,7 @@ import { createProxyMiddleware, Options } from 'http-proxy-middleware' import { parse } from 'graphql' import { print } from 'graphql/language/printer' import { hasDirectives } from 'apollo-utilities' -import type { Application, Request } from 'express' +import type { Request, Response, NextFunction } from 'express' import { decode } from './utils' import type { Cache } from './caches/types' import { @@ -17,11 +17,12 @@ const CACHE_HEADER = 'X-Proxy-Cached' type RequestWithCache = Request & { _hasCache: { id: string; timeout: number } } -export const proxyCacheMiddleware = >( +export const createProxyCacheMiddleware = >( queryCache: T, cacheKeyModifier?: CacheKeyModifier -) => (app: Application, endpoint: string, proxyConfig: Options) => { - app.use(endpoint, async (req, response, next) => { +) => (proxyConfig: Options) => { + + const directiveMiddleware = async (req: RequestWithCache, response: Response, next: NextFunction) => { if (!req.body) { console.warn( '[skip] proxy-cache-middleware, request.body is not populated. Please add "body-parser" middleware (or similar).' @@ -53,14 +54,14 @@ export const proxyCacheMiddleware = >( errorOnGet(e) } // eslint-disable-next-line @typescript-eslint/no-extra-semi - ;(req as RequestWithCache)._hasCache = { id, timeout } + req._hasCache = { id, timeout } // could this be piped here (with req.pipe) req.body = { ...req.body, query: print(nextQuery) } } next() - }) + } - const proxyInstance = createProxyMiddleware({ + const proxyMiddleware = createProxyMiddleware({ ...proxyConfig, onProxyReq: (proxyReq, req, res) => { let data @@ -96,6 +97,5 @@ export const proxyCacheMiddleware = >( }, }) - app.use(endpoint, proxyInstance) - return proxyInstance + return { proxyMiddleware, directiveMiddleware } } diff --git a/src/index.ts b/src/index.ts index d471827..5f7ed10 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,5 @@ export { proxyCacheLink } from './proxyCacheLink' -export { proxyCacheMiddleware } from './proxyCacheMiddleware' +export { createProxyCacheMiddleware } from './createProxyCacheMiddleware' export { DIRECTIVE, removeCacheDirective } from './utils-browser-only' export { InMemoryCache } from './caches/inmemory'