Apollo 客户端发送 OPTIONS 而不是 GET HTTP 方法

Posted 2023-03-04

【中文标题】Apollo 客户端发送 OPTIONS 而不是 GET HTTP 方法

【英文标题】：Apollo Client sending OPTIONS instead of GET HTTP method

【发布时间】：2019-03-31 10:40:16

【问题描述】：

我无法理解 Apollo 客户端库，因为它无法按预期工作。它没有发送 GET HTTP 方法，而是发送 OPTIONS HTTP 方法，即使我已经使用 GET从 GraphQL 服务器检索数据。

const client = new ApolloClient(
    link: ApolloLink.from([
        new MeteorAccountsLink(),
        new HttpLink(
            uri: 'https://selo-comments.herokuapp.com/graphql',
            useGETForQueries: true
        )
    ]),
    cache: new InMemoryCache()
);

来自浏览器的控制台日志： OPTIONS https://selo-comments.herokuapp.com/graphql?query=%7B%0A%20%20comments(id%3A%20%22TFpQmhrDxQqHk2ryy%22)%20%7B%0A%20%20%20%20articleID%0A%20%20%20%20content%0A%20%20%20%20userId%0A%20%20%20%20createdAt%0A%20%20%20%20commentID%0A%20%20%20%20votes%0A%20%20%20%20blockedUsers%0A%20%20%20%20__typename%0A%20%20%7D%0A%7D%0A&variables=%7B%7D 405 (Method Not Allowed)

这显然意味着HTTP方法是不正确的，即使它的url中有查询参数。如果您使用 Postman 查询该 url，或者只是使用浏览器的地址栏导航到该 url，您将获得 GraphQL 数据。我必须使用https://cors-anywhere.herokuapp.com/ 才能成功执行查询。

我做错了什么？

【参考方案1】：

选项请求可能是preflight request 的CORS。

CORS 预检请求是检查 CORS 协议是否被理解的 CORS 请求。 这是一个 OPTIONS 请求，使用三个 HTTP 请求标头：Access-Control-Request-Method、Access-Control-Request-Headers 和 Origin 标头。

您可能需要配置您的服务器以允许跨源调用。

也许您可以在这里找到一些灵感来帮助您入门。 Allow CORS REST request to a Express/Node.js application on Heroku

【讨论】：

哇，这实际上解决了问题哈哈。我什至没有意识到这一点，谢谢！

我已经在服务器上安装了一个 CORS 模块，但它仍然让我在客户端感到头疼，但再次感谢。