Dive into secure and efficient coding practices with our curated list of the top 10 examples showcasing 'apollo-link-rest' in functional components in JavaScript. Our advanced machine learning engine meticulously scans each line of code, cross-referencing millions of open source libraries to ensure your implementation is not just functional, but also robust and secure. Elevate your React applications to new heights by mastering the art of handling side effects, API calls, and asynchronous operations with confidence and precision.
// instantiated errorLink
// const httpLink = createHttpLink({ uri: proxy + endpoint });
const headersOptions = {
'Content-Type': 'application/json'
// 'Access-Control-Allow-Origin': '*',
};
if (apiKey !== '' && headersKey !== '') {
// console.log('apiKey: ', apiKey);
// console.log('headersKey: ', headersKey);
headersOptions[headersKey] = apiKey;
// console.log('headersOptions ', headersOptions);
}
const restLink = new RestLink({
// might be able to use custom fetch here for error checking?
uri: proxy + endpoint,
fetchOptions: {
mode: 'no-cors'
},
headers: headersOptions,
// onError: ({ networkError, graphQLErrors }) => {
// console.log('graphQLErrors', graphQLErrors);
// console.log('networkError', networkError);
// },
customFetch: (uri, fetchOptions) =>
// console.log('in custom fetch. fetchOptions: ', fetchOptions);
new Promise((resolve, reject) => {
fetch(uri, fetchOptions)
.then(res => {
// const clone = res.clone();
}
},
onCancel: () => {
if (Platform.OS === 'ios') {
networkActivity.onFinish += 1;
if (networkActivity.onFinish === networkActivity.onRequest) {
StatusBar.setNetworkActivityIndicatorVisible(false);
}
}
},
},
});
const stateLink = withClientState({ resolvers, cache, defaults, typeDefs });
const restLink = new RestLink({
uri: 'https://democracy-deutschland.de/api.php', // ?call=donation_status
});
client = new ApolloClient({
cache,
link: ApolloLink.from([
loadingIndicator,
networkStatusNotifierLink,
authLinkMiddleware,
authLinkAfterware,
stateLink,
restLink,
new HttpLink({ uri: Configuration.GRAPHQL_URL }),
]),
});
export default client;
return null;
}
return {
...data.racks[key],
__typename: 'Rack',
stopCode: data.racks[key].stopCode || null,
};
});
// eslint-disable-next-line no-param-reassign
data.racks = racksArr.filter(Boolean);
return data;
},
};
const restLink = new RestLink({
uri: 'https://data.foli.fi/',
typePatcher,
fieldNameNormalizer: key => camelCase(key),
});
const client = new ApolloClient({
link: restLink,
cache: new InMemoryCache(),
});
const App = () => (
);
if (bearerToken) {
authHeader = `Bearer ${bearerToken}`;
}
return {
headers: {
authorization: authHeader || null
// TODO: Figure out if we should include a nonce header for graphcool
}
};
});
// Create a RestLink for the REST API
// If you are using multiple link types, restLink should go before httpLink,
// as httpLink will swallow any calls that should be routed through rest!
const restLink = new RestLink({
endpoints: {
github: 'https://api.github.com/'
},
credentials: 'omit',
headers: {
'Content-Type': 'application/json'
}
});
export default function createApolloClient() {
return new ApolloClient({
link: ApolloLink.from([restLink, middlewareLink, httpLink]),
cache: new InMemoryCache(),
connectToDevTools: devMode
});
}
uri: process.env.REACT_APP_SERVER_URL + process.env.REACT_APP_GRAPHQL_ENDPOINT
});
const authLink = setContext((_, { headers }) => {
// get the authentication token from local storage if it exists
const token = localStorage.getItem("token");
// return the headers to the context so httpLink can read them
return {
headers: {
...headers,
authorization: token ? `Token ${localStorage.getItem("token")}` : ""
}
};
});
const restLink = new RestLink({
uri: process.env.REACT_APP_SERVER_URL
});
const apolloClient = new ApolloClient({
link: ApolloLink.from([restLink, stateLink, authLink.concat(httpLink)]),
cache,
resolvers
});
export default apolloClient;
definition.kind === "OperationDefinition" &&
definition.operation === "subscription"
);
},
wsLink,
httpLinkAuth
);
// Aggregate all links
const links = [];
if (process.env.NODE_ENV === "development") {
links.push(errorLink);
}
if (process.env.CLEANING_SCRIPTS_URI) {
links.push(
new RestLink({
uri: process.env.CLEANING_SCRIPTS_URI + "/",
headers: {
"Content-Type": "application/json"
}
})
);
}
links.push(coreLink);
// Client
export const client = new ApolloClient({
cache: new InMemoryCache(),
connectToDevTools: true,
link: ApolloLink.from(links)
});
if (window.env.ENVIRONMENT === "development") {
newGraphqlEndpoint = graphqlEndpoint;
} else {
newGraphqlEndpoint = window.location.origin + graphqlEndpoint;
}
const httpLink = createHttpLink({
uri: newGraphqlEndpoint,
fetch: fetcher ? fetcher : fetch,
});
if (fetcher) {
global.Headers = fetcher.Headers;
}
const restLink = new RestLink({
uri: `${restEndpoint}/v1`,
endpoints: {
"v1": `${restEndpoint}/v1`,
},
customFetch: fetcher ? fetcher : undefined,
});
const authLink = setContext(async (_, { headers }) => {
return {
headers: {
...headers,
authorization: await tokenFunction(),
},
};
});
import React from 'react';
import { hot } from 'react-hot-loader';
import { ApolloClient } from 'apollo-client';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { ApolloProvider } from 'react-apollo';
import { RestLink } from 'apollo-link-rest';
import Routes from './Routes';
import './style.css';
const restLink = new RestLink({
uri: 'http://jsonplaceholder.typicode.com',
});
const client = new ApolloClient({
link: restLink,
cache: new InMemoryCache(),
});
const App: React.SFC<{}> = () => (
);
export default hot(module)(App);
import React, { Component } from 'react';
import { ApolloClient } from 'apollo-client';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { ApolloProvider } from 'react-apollo';
import { RestLink } from 'apollo-link-rest';
import Person from './Person';
import './App.css';
const restLink = new RestLink({
uri: 'https://swapi.co/api/',
});
const client = new ApolloClient({
link: restLink,
cache: new InMemoryCache(),
});
class App extends Component {
render() {
return (
<div>
<header>
<h1>Welcome to Apollo Rest Link Example</h1>
</header>
</div>
import React, { Component } from 'react';
import { ApolloClient } from 'apollo-client';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { ApolloProvider } from 'react-apollo';
import { RestLink } from 'apollo-link-rest';
import SearchShow from './SearchShow';
import './App.css';
const restLink = new RestLink({
uri: 'https://api.tvmaze.com/',
});
const client = new ApolloClient({
link: restLink,
cache: new InMemoryCache(),
});
class App extends Component {
render() {
return (
<div>
<header>
<h1>Welcome to Apollo Rest Link Example</h1>
</header>
</div>