apollo icon indicating copy to clipboard operation
apollo copied to clipboard

Automatic Persisted Queries Link

Open brightchip opened this issue 5 years ago • 5 comments

How do add Automatic Persisted Queries Link

https://www.apollographql.com/docs/apollo-server/performance/apq/

brightchip avatar Oct 05 '20 12:10 brightchip

Based on the contents of plugin.ts it seems not to be possible. Thats sad since I need this feature.

Maybe I get a PR done if the maintainer would like to get one.

artem-schander avatar Feb 09 '23 10:02 artem-schander

@kieusonlam / @dohomi Are you guys interested in a PR regarding APQ?

artem-schander avatar Feb 09 '23 10:02 artem-schander

I think i got a solution, or at least a solid starting point.. https://github.com/Artem-Schander/nuxt-apollo/commit/9312d50be80ef900c28f1d5f4d0dd452403710e7

let persistedQueryLink
if (process.client && clientConfig.persisting) {
  let persistingOptions
  if (typeof clientConfig.persisting === 'object' && clientConfig.persisting !== null) {
    persistingOptions = clientConfig.persisting
  }
  if (persistingOptions.sha256 === undefined && persistingOptions.generateHash === undefined) {
    persistingOptions.sha256 = sha256
  }
  persistedQueryLink = createPersistedQueryLink(persistingOptions)
}

let links: any = []
links.push(errorLink)
if (persistedQueryLink) links.push(persistedQueryLink)
links.push(...(!wsLink
  ? [httpLink]
  : [
    ...(clientConfig?.websocketsOnly
      ? [wsLink]
      : [
        split(({ query }) => {
          const definition = getMainDefinition(query)
          return (definition.kind === 'OperationDefinition' && definition.operation === 'subscription')
        },
          wsLink,
          httpLink)
      ])
  ]))

const link = ApolloLink.from(links)

I'm not happy with the let links: any array, but I have no idea how to solve it properly in ts.

artem-schander avatar Feb 09 '23 14:02 artem-schander

I'm interested in a solution like this as well. What is required to move this forward?

westende avatar Mar 14 '23 18:03 westende

I was able to achieve this by using the setLink method on the client:

// plugins/apollo-persisted-queries-link.ts

import { createPersistedQueryLink } from '@apollo/client/link/persisted-queries'
import { sha256 } from 'crypto-hash'

export default defineNuxtPlugin(nuxtApp => {
  const { clients } = useApollo()
  const persistedQueriesLink = createPersistedQueryLink({ sha256, useGETForHashedQueries: true })
  const httpLink = clients.default.link

  // create the new link
  const newLink = persistedQueriesLink.concat(httpLink)

  // set the new link
  clients.default.setLink(newLink)
})

Note that theWebCrypto API is restricted to secure origins, so local testing may not work. To get around this, you can set the unsafely-treat-insecure-origin-as-secure flag in chrome to include your docker hostname (chrome://flags/#unsafely-treat-insecure-origin-as-secure). Solution reference.

stephiescastle avatar Sep 15 '23 14:09 stephiescastle