阅读背景:

ReactJS - NodeJS - 在AWS Lambda上连接到Graphql的问题

来源:互联网 

I have a nodejs lambda function deployed on aws which exposes a lambda endpoint via API Gateway. The endpoint is here and allows you to access the graphiql endpoint.

我在aws上部署了一个nodejs lambda函数,它通过API网关公开了一个lambda端点。端点在此处,允许您访问graphiql端点。

I have been trying to call this from my react code but I am getting the following error response

我一直试图从我的反应代码中调用它,但我得到以下错误响应

{"message":"Missing Authentication Token"}

And the following console warning

以及控制台警告

Failed to load https://z8zch5bp3m.execute-api.us-east-1.amazonaws.com/test: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://localhost:3000' is therefore not allowed access. The response had HTTP status code 403. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

I have enabled cors in the API gateway but still getting this error.

我在API网关中启用了cors但仍然出现此错误。

My simple react code is as follows

我的简单反应代码如下

import React, { Component } from 'react';
import { gql } from 'apollo-boost';
import { Query } from 'react-apollo';

const ADD_NUMBERS = gql`
  query {
      addNumbers(number1:1, number2:55) {
        add
      }    
  }
`


const App = () => (
  <Query query={ADD_NUMBERS}>
    {({ loading, error, data }) => {
      if (loading) return <div>Loading...</div>;
      if (error) return <div>Error :(</div>;

      return (
        <div>Data: {data}</div>
      )
    }}
  </Query>
)

export default App;

The nodejs code for my lambda function is located here

我的lambda函数的nodejs代码位于此处

Please let me know if I need to do anything to get this lambda call working.

如果我需要做任何事情来让这个lambda呼叫正常工作,请告诉我。

2 个解决方案

#1


1  

Looking into your code did not tell me much. I would advise you to take a look into those topics:

查看你的代码并没有告诉我太多。我建议你看一下这些话题:

  1. Missing Authentication Token is also returned when you make an HTTP call with the wrong method (say you want to POST, but you PUT);
  2. 当您使用错误的方法进行HTTP调用时,也会返回缺少身份验证令牌(假设您要POST,但是您要PUT);
  3. Look into Lambda Proxy Integration. When using Lambda Proxy Integration you can specify headers in your response. There you can make sure to allow Cross-Origin-Resource-Sharing.
  4. 研究Lambda代理集成。使用Lambda代理集成时,您可以在响应中指定标头。在那里,您可以确保允许跨源资源共享。

Hope this helps.

希望这可以帮助。

#2


1  

Got this working by recreating my api gateway endpoints with cors enabled from the start and it worked as expected

通过从一开始就启用cors重新创建我的api网关端点并按预期工作,从而实现了这一功能


分享到: