How to use the apollo-client.createNetworkInterface function in apollo-client

To help you get started, we’ve selected a few apollo-client examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github prisma-archive / freecom-tutorial / freecom-04-final / frontend / src / index.js View on Github external
import App from './components/App'
import './index.css'
import ApolloClient, { createNetworkInterface } from 'apollo-client'
import { ApolloProvider } from 'react-apollo'
import { SubscriptionClient, addGraphQLSubscriptions } from 'subscriptions-transport-ws'
import { FREECOM_AUTH_TOKEN_KEY } from './constants'

// Create WebSocket client
const wsClient = new SubscriptionClient(`wss://subscriptions.graph.cool/v1/cizf8g3fr1sp90139ikdjayb7`, {
  reconnect: true,
  connectionParams: {
    authToken: localStorage.getItem(FREECOM_AUTH_TOKEN_KEY),
  },
})

const networkInterface = createNetworkInterface({ uri: 'https://api.graph.cool/simple/v1/cizf8g3fr1sp90139ikdjayb7' })

// Add Authorization header
networkInterface.use([{
  applyMiddleware(request, next) {
    if (!request.options.headers) {
      request.options.headers = {}
    }

    // get the authentication token from local storage if it exists
    const token = localStorage.getItem(FREECOM_AUTH_TOKEN_KEY)
    request.options.headers.authorization = token ? `Bearer ${token}` : null
    next()
  }
}])

// Extend the network interface with the WebSocket
github katopz / react-apollo-graphql-github-example / src / App.js View on Github external
// Apollo
import { ApolloProvider } from 'react-apollo'
import ApolloClient, { createNetworkInterface } from 'apollo-client'

// Auth
import { login } from './githubLogin'
import { username, password } from './config'

// App.Components
import Repository from './repository'

// Global.Auth
let TOKEN = null

// Global.Apollo
const networkInterface = createNetworkInterface('https://api.github.com/graphql')

networkInterface.use([
  {
    applyMiddleware (req, next) {
      if (!req.options.headers) {
        req.options.headers = {} // Create the header object if needed.
      }

      // Send the login token in the Authorization header
      req.options.headers.authorization = `Bearer ${TOKEN}`
      next()
    }
  }
])

const client = new ApolloClient({
github PierBover / vuex-apollo-example-project / apollo.js View on Github external
import ApolloClient, { createNetworkInterface } from 'apollo-client';
import { SubscriptionClient, addGraphQLSubscriptions } from 'subscriptions-transport-ws'

// YOUR_GRAPH_QL_ENDPOINT_HERE

const wsClient = new SubscriptionClient('wss://subscriptions.graph.cool/v1/cj3xgn6d2idze0104n3mpq4le', {
	reconnect: true,
});

const networkInterface = createNetworkInterface({
	uri: 'https://api.graph.cool/simple/v1/cj3xgn6d2idze0104n3mpq4le'
});

const networkInterfaceWithSubscriptions = addGraphQLSubscriptions(
	networkInterface,
	wsClient
)

const client = new ApolloClient({
	networkInterface: networkInterfaceWithSubscriptions,
	dataIdFromObject: o => o.id
});

export default client;
github TheBrainFamily / TheBrain2.0 / mobileClient / store.js View on Github external
import { applyMiddleware, combineReducers, createStore, compose } from 'redux'
import { routerMiddleware, routerReducer } from 'react-router-redux'
import createHistory from 'history/createMemoryHistory'
import { ApolloClient, createNetworkInterface } from 'apollo-client'
import reducers from './reducers'
import devTools from 'remote-redux-devtools'

// import config from './.config-dev'
// let graphqlUri = ""
// if (__DEV__) {
//   const graphqlUri = 'http://10.0.0.4:8080/graphql'
// } else {
const graphqlUri = 'https://api.thebrain.pro/graphql'
// }

const networkInterface = createNetworkInterface({
  uri: graphqlUri,
  opts: {
    credentials: 'include'
  }
})

const client = new ApolloClient({
  networkInterface
})

const history = createHistory()

const store = createStore(
  combineReducers({
    ...reducers,
    router: routerReducer,
github prisma-archive / freecom-tutorial / freecom-04 / frontend / src / index.js View on Github external
import React from 'react'
import ReactDOM from 'react-dom'
import App from './components/App'
import './index.css'
import ApolloClient, { createNetworkInterface } from 'apollo-client'
import { ApolloProvider } from 'react-apollo'
import { SubscriptionClient, addGraphQLSubscriptions } from 'subscriptions-transport-ws'
import { FREECOM_AUTH_TOKEN_KEY } from './constants'

// Create WebSocket client
const wsClient = new SubscriptionClient(`wss://subscriptions.graph.cool/v1/__PROJECT_ID__`, {
  reconnect: true,
})

const networkInterface = createNetworkInterface({ uri: 'https://api.graph.cool/simple/v1/__PROJECT_ID__' })

// Extend the network interface with the WebSocket
const networkInterfaceWithSubscriptions = addGraphQLSubscriptions(
  networkInterface,
  wsClient
)

const client = new ApolloClient({
  networkInterface: networkInterfaceWithSubscriptions,
  dataIdFromObject: o => o.id,
})

const freecom = {
  render,
  companyName: 'Graphcool',
  companyLogoURL: 'http://imgur.com/qPjLkW0.png',
github marmelab / aor-simple-graphql-client / src / buildApolloClient.js View on Github external
export const getClient = ({ client, clientOptions }) => {
    if (client) return client;

    if (clientOptions) {
        const { networkInterface, uri, ...options } = clientOptions;

        if (networkInterface) {
            if (networkInterface && uri) {
                console.error('Warning: You specified a networkInterface and an uri option. uri will be ignored.');
            }
            return new ApolloClient({ ...options, networkInterface });
        }

        if (!networkInterface && uri) {
            options.networkInterface = createNetworkInterface({ uri });
        }

        return new ApolloClient(options);
    }

    return new ApolloClient();
};
github sonnylazuardi / reactriot2017-dotamania / index.js View on Github external
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var axios = require('axios');
var swig  = require('swig');
var gql = require('graphql-tag');
var ApolloClient = require('apollo-client').default;
var createNetworkInterface = require('apollo-client').createNetworkInterface;
var networkInterface = createNetworkInterface({ uri: 'https://api.graph.cool/simple/v1/cj4i1ifeamv640130f4nkogb0' });
var client = new ApolloClient({ networkInterface: networkInterface });
require('es6-promise').polyfill();
require('isomorphic-fetch');

app.set('port', (process.env.PORT || 5000))

app.engine('html', swig.renderFile);
app.set('view engine', 'html');
app.set('views', __dirname + '/build');

app.use(bodyParser.json());

app.get(['/', '/scrape/:key'], function(req, res) {
  const key = req.params.key;
  console.log('KEY', key);
github aio-libs / aiohttp-demos / demos / graphql-demo / ui / src / client / index.js View on Github external
import ApolloClient, { createNetworkInterface } from 'apollo-client';
import {
  SubscriptionClient,
  addGraphQLSubscriptions
} from 'subscriptions-transport-ws';

const wsClient = new SubscriptionClient('ws://localhost:8080/subscriptions');
const baseNetworkInterface = createNetworkInterface({
  uri: '/graphql',
});
const subscriptionNetworkInterface = addGraphQLSubscriptions(
  baseNetworkInterface,
  wsClient,
  );


export default new ApolloClient({
  networkInterface: subscriptionNetworkInterface,
  connectToDevTools: true,
});
github learnapollo / pokedex-react / branch-exercise-04-solution / src / index.js View on Github external
import React from 'react'
import ReactDOM from 'react-dom'
import Pokedex from './components/Pokedex'
import PokemonPage from './components/PokemonPage'
import { Router, Route, browserHistory } from 'react-router'
import ApolloClient, { createNetworkInterface } from 'apollo-client'
import { ApolloProvider } from 'react-apollo'
import 'tachyons'
import './index.css'

const client = new ApolloClient({
  networkInterface: createNetworkInterface({ uri: 'https://api.graph.cool/simple/v1/__PROJECT_ID__'}),
})

ReactDOM.render((
  
    
      
      
    
  
  ),
  document.getElementById('root')
)
github StephenGrider / GraphQLCasts / auth-graphql-starter / client / index.js View on Github external
import React from 'react';
import ReactDOM from 'react-dom';
import ApolloClient, { createNetworkInterface } from 'apollo-client';
import { ApolloProvider } from 'react-apollo';
import { Router, hashHistory, Route, IndexRoute } from 'react-router';

import App from './components/app';
import LoginForm from './components/LoginForm';
import SignupForm from './components/SignupForm';

const networkInterface = createNetworkInterface({
  uri: '/graphql',
  opts: {
    credentials: 'same-origin'
  }
});

const client = new ApolloClient({
  networkInterface,
  dataIdFromObject: o => o.id
});

const Root = () => {
  return (