Hey folks,
I’m new to Apollo Client and my Apollo Client version is 3.5.10 and I’m having difficulties with client mutation with the api:
(https://api.graphql.jobs/c/unrealists/full-stack-javascript-developer/)
When I call the api using POSTMAN its work fine but when I try to use and call it from react app it through error code:
In Network Analyzer of dev tool
1. {operationName: "subscribe", variables: {},…}
1. operationName: "subscribe"
2. query: "mutation subscribe($email: String!, $name: String!) {\n subscribe(input: {email: $email, name: $name}) {\n id\n name\n __typename\n }\n}"
3. variables: {}
Request URL: https://api.graphql.jobs/
Request Method: POST
Status Code: 400
Remote Address: 104.21.64.140:443
Referrer Policy: strict-origin-when-cross-origin
But I have properly provided the name and email
Here is the Mutation Query:
export const SUBSCRIBE_MUTATION = gql`
mutation subscribe(
$email: String!,
$name: String!,
){
subscribe(
email: $email,
name: $name,
){
id
name
}
}
`;
Here is code in app.js
import { ApolloClient, ApolloProvider, InMemoryCache} from '@apollo/client';
const client = new ApolloClient({
cache: new InMemoryCache(),
uri: 'https://api.graphql.jobs',
});
<div className="App">
<ApolloProvider client={client}>
<SimpleForm />
</ApolloProvider>
</div>
Here is the code from where I send the form data:
function SimpleForm() {
const [name, setName] = React.useState('');
const [email, setEmail] = React.useState('');
const [subscribe, { error }] = useMutation(SUBSCRIBE_MUTATION);
const sub = () => {
subscribe({variables: {email,name}});
console.log("Subscribing");
}
return (
<div>
<form>
<input type="text" name='name' value={name} placeholder='Name' onChange={(e) => setName(e.target.value)} />
<input type="text" name='email' value={email} placeholder='Email' onChange={(e) => setEmail(e.target.value)} />
<button type='button' onClick={() => sub()}>Submit</button>
</form>
</div>
)
Here is my complete code
(https://github.com/onlynavid1/job-posting-site)
I have try documentation, stackoverflow but still facing the same issue
Thanks in Advance