阿波罗& Graphcool:“这个突变的权限不足” - 如何最好地设置connectionParams?

时间:2017-05-28 09:19:44

标签: reactjs apollo graphcool

因此,在将我的Graphcool评论模式的删除权限设置为Authenticated后(见图片),我在尝试删除帖子评论时收到上述错误(见图片)。

用户在登录后收到令牌,如下所示:



const Login = React.createClass({
  
  signinUser: function(emailID, passwordID) {

    const email = emailID;
    const password = passwordID;

    this.props.client.mutate({
      mutation: signinUser_Mutation,
      variables: {
        email,
        password,
      },
      options: {
        cachePolicy: 'offline-critical', 
        fetchPolicy: 'cache-first',
      },
    })
    .then(this.updateStateLoginDetails)
    .catch(this.handleSubmitError);
  },

  updateStateLoginDetails: function({data}) {
    localForage.setItem('graphcoolToken', data.signinUser.token);
  },

  handleSubmitError: function(err) {
    console.error(err.message);
  },

  handleSubmit: function(e) {
    e.preventDefault();
    this.signinUser(this.refs.email.value, this.refs.password.value);
    this.refs.loginForm.reset();
    this.refs.email.focus();
  },
  render: function() {

    return (
      <div className="comments">

        <form onSubmit={this.handleSubmit} ref="loginForm" className="comment-form">
          <input type="text" ref="email" placeholder="email"/>
          <input type="text" ref="password" placeholder="password"/>
          <input type="submit" hidden/>
        </form>
      </div>
    );
  }
});

Login.propTypes = {
  client: React.PropTypes.instanceOf(ApolloClient).isRequired,
}
const LoginWithApollo = withApollo(Login);

export default LoginWithApollo;
&#13;
&#13;
&#13;

然后在我的ApolloClient.js中设置授权标头,如下所示:

&#13;
&#13;
const logErrors = {
  applyAfterware({ response }, next) {
    if (!response.ok) {
      response.clone().text().then((bodyText) => {
        console.log('...', `Network Error: ${response.status} (${response.statusText}) - ${bodyText}`);
        next();
      });
    } else {
      response.clone().json().then(({ errors }) => {
        if (errors) {
          console.log('...', 'GraphQL Errors:', errors.map(e => e.message));
        }
        next();
      });
    }
  },
};

// Create WebSocket client
const wsClient = new SubscriptionClient(SubscriptionClient_URL, {
  reconnect: true,
  connectionParams: {
    Authorization: Best way to read in graphcoolToken here?
  }
});

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

networkInterface.use([{
  async applyMiddleware(req, next) {
    if (!req.options.headers) {
      req.options.headers = {};  // Create the header object if needed.
    }
    
    // get the authentication token from local storage if it exists
    localForage.getItem('graphcoolToken', function (err, value) {
      req.options.headers.Authorization = value ? `Bearer ${value}` : null;

      // This is where next should have been placed
      next();
    });
  
    // next was incorrectly placed here
    next()
  },
}]);

if (process.env.NODE_ENV !== 'production') {
  networkInterface.useAfter([logErrors]);
}

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

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

export default client;
&#13;
&#13;
&#13;

删除评论的突变是:

&#13;
&#13;
export const Remove_Comment_MutationOLD = gql`
  mutation removeComment ($id: ID!, $cid: ID!) {
    removeFromPostsOnComments (postsPostsId: $id, commentsCommentsId: $cid) {
      postsPosts {
        __typename
        id
        comments {
          __typename
          id
          text
          user
          deleted
          posts {
            __typename
            id
          }
        }
      }
    }

    deleteComments(id: $cid) {
      id
    }
  }
`;
&#13;
&#13;
&#13;

所以我的问题是,在设置req.options.headers.authorization标题后,在connectionParams中设置授权的最佳方法是什么,如下文所述:https://www.graph.cool/forum/t/authentication-issues-with-subscriptions/45/2

enter image description here

enter image description here

enter image description here

0 个答案:

没有答案