mongodb-appeng / taskit

A simple todo application make use of MongoDB Stitch & GraphQL
Apache License 2.0
2 stars 0 forks source link

Getting null response errors #11

Closed QuintonC closed 4 years ago

QuintonC commented 4 years ago

I've tried to make this a more modular approach so we can control what is passed in. That way we just need one for updating many, getting many, etc. This is for a large application and I've been trying to figure out the issue.

In my Log in Stitch I see 200 requests. I've tried it a few different ways and continue to get a 200 status (OK), but receive nothing as a response. Additionally, the collection is not updating. Any help would be great.

Here is my implementation of performing updates.

async function performUpdate(
    query,
    variableQuery,
    updateInformation
) {
    const client = Stitch.defaultAppClient;
    const { accessToken } = client.auth.user.auth.activeUserAuthInfo;

    console.log(query);
    console.log(variableQuery);
    console.log(updateInformation);

    try {
        const resp = await axios({
            url:
                'https://stitch.mongodb.com/api/client/v2.0/app/<ID-REMOVED>/graphql',
            method: 'post',
            headers: {
                Authorization: `Bearer ${accessToken}`
            },
            data: {
                query,
                variables: {
                    query: variableQuery, //should be an object,
                    set: updateInformation //the information that we are updating to.
                }
            }
        });

        const responseData = resp.data;

        console.log(resp);

        if ('errors' in responseData) {
            console.log(responseData.errors[0].message);
        }

        return responseData.data;
    } catch (error) {
        console.log(error);
    }
}

Example call:

    saveChanges = async () => {
        this.showLoader();

        const query = `
            mutation($query:UserQueryInput, $set:UserUpdateInput!) {
                updateOneUser(query:$query, set:$set) {
                    _id,
                    stitch_id,
                    phone,
                    dob
                }
            }
        `;

        const variableQuery = {
            stitch_id: this.props.authInfo.id
        };

        const updateInformation = {
            phone: '+1 (000) 000-0000'
        };

        const response = await performUpdate(
            query,
            variableQuery,
            updateInformation
        );

        // conditionally check response here.

        this.hideLoader();
    };

Here are some log results: Screen Shot 2020-04-30 at 5 27 41 PM

I tried another approach to making the call, which looked like this (and as a result you see the top log entry).

async function performUpdate(query) {
    const client = Stitch.defaultAppClient;
    const { accessToken } = client.auth.user.auth.activeUserAuthInfo;

    console.log(query);

    try {
        const resp = await axios({
            url:
                'https://stitch.mongodb.com/api/client/v2.0/app/venueats-uvysi/graphql',
            method: 'post',
            headers: {
                Authorization: `Bearer ${accessToken}`
            },
            data: {
                query
            }
        });

        const responseData = resp.data;

        console.log(resp);

        if ('errors' in responseData) {
            console.log(responseData.errors[0].message);
        }

        return responseData.data;
    } catch (error) {
        console.log(error);
    }
}

EDIT: Forgot to include information that was being logged to the console. using the last method included:

[Thu Apr 30 2020 17:10:09.146]  LOG
            mutation {
                updateOneUser(
                    query: { stitch_id: "XXXXXX" }
                    set: { phone: "+1 (000) 000-0000" }
                ) {
                    _id,
                    stitch_id,
                    phone,
                    dob
                }
            }

[Thu Apr 30 2020 17:10:09.146]  LOG      {"stitch_id": "XXXXXX"}
[Thu Apr 30 2020 17:10:09.146]  LOG      {"phone": "+1 (000) 000-0000"}
[Thu Apr 30 2020 17:10:09.600]  LOG      {"config": {"adapter": [Function xhrAdapter], "data": "{\"query\":\"\\n            mutation {\\n                updateOneUser(\\n                    query: { stitch_id: \\\"phone: "+1 (000) 000-0000"\\\" }\\n                    set: { phone: \\\"+1 (000) 000-0000\\\" }\\n                ) {\\n                    _id,\\n                    stitch_id,\\n                    phone,\\n                    dob\\n                }\\n            }\\n        \"}", "headers": {"Accept": "application/json, text/plain, */*", "Authorization": "Bearer <BEARER OMITTED>", "Content-Type": "application/json;charset=utf-8"}, "maxContentLength": -1, "method": "post", "timeout": 0, "transformRequest": [[Function transformRequest]], "transformResponse": [[Function transformResponse]], "url": "https://stitch.mongodb.com/api/client/v2.0/app/venueats-uvysi/graphql", "validateStatus": [Function validateStatus], "xsrfCookieName": "XSRF-TOKEN", "xsrfHeaderName": "X-XSRF-TOKEN"}, "data": {"data": {"updateOneUser": null}}, "headers": {"content-encoding": "gzip", "content-length": "55", "content-type": "application/json", "date": "Thu, 30 Apr 2020 21:10:09 GMT", "vary": "Origin", "x-frame-options": "DENY"}, "request": {"DONE": 4, "HEADERS_RECEIVED": 2, "LOADING": 3, "OPENED": 1, "UNSENT": 0, "_aborted": false, "_cachedResponse": undefined, "_hasError": false, "_headers": {"accept": "application/json, text/plain, */*", "authorization": "Bearer BEARER OMITTED", "content-type": "application/json;charset=utf-8"}, "_incrementalEvents": false, "_lowerCaseResponseHeaders": {"content-encoding": "gzip", "content-length": "55", "content-type": "application/json", "date": "Thu, 30 Apr 2020 21:10:09 GMT", "vary": "Origin", "x-frame-options": "DENY"}, "_method": "POST", "_requestId": null, "_response": "{\"data\":{\"updateOneUser\":null}}", "_responseType": "", "_sent": true, "_subscriptions": [], "_timedOut": false, "_trackingName": "unknown", "_url": "https://stitch.mongodb.com/api/client/v2.0/app/venueats-uvysi/graphql", "readyState": 4, "responseHeaders": {"Content-Encoding": "gzip", "Content-Length": "55", "Content-Type": "application/json", "Date": "Thu, 30 Apr 2020 21:10:09 GMT", "Vary": "Origin", "x-frame-options": "DENY"}, "responseURL": "https://stitch.mongodb.com/api/client/v2.0/app/venueats-uvysi/graphql", "status": 200, "timeout": 0, "upload": {}, "withCredentials": true}, "status": 200, "statusText": undefined}
[Thu Apr 30 2020 17:10:09.600]  LOG      {"updateOneUser": null}
QuintonC commented 4 years ago

I managed to fix the issue.

I went with the simpler approach and pass the gql query via params to the function.

The main issue was that when loading the app I was authenticating anonymously to load some basic app data. I was not logging out that anonymous user, which was the problem.