aws-amplify / amplify-js

A declarative JavaScript library for application development using cloud services.
https://docs.amplify.aws/lib/q/platform/js
Apache License 2.0
9.44k stars 2.13k forks source link

[API] Null result from API.post() or (put) #5971

Closed shide1989 closed 4 years ago

shide1989 commented 4 years ago

Describe the bug I'm using aws-amplify API to call the Rest API I've setup using Amplify, but the return value is always null

It used to work fine using the Lambda Hello World template, but switching to the lambda express template made this happen.

Inspecting the request shows that the result returned from the API is a correct JSON value , but once received the Amplify SDK seems to mess things up and remove the data.

The same happens for the .put() method

I suspect that deploying the new Lambda, some headers might be missing or some parameters might be missing, that makes the data decoding impossible

Capture d’écran 2020-06-02 à 15 42 29

To Reproduce Steps to reproduce the behavior:

  1. Create a Amplify Rest API
  2. Create a Cognito UserPool Authentication
  3. Create a Lambda based on the express-lambda template
  4. Add an API Rest endpoint that triggers the Lambda you created and authorises authenticated users only
  5. Use the API from the aws-amplify package, and make a request
  6. The result is null

Expected behavior We should be able to see the data returned from the request.

Code Snippet

import { API } from 'aws-amplify'

const myFunction = async () => {
  const result = await API.post('esportsverify', '/conversations', {
      body: { username: other }
    })
// result is null -_-
}

Screenshots

Capture d’écran 2020-06-02 à 15 17 36

Capture d’écran 2020-06-02 à 15 17 59

Capture d’écran 2020-06-02 à 15 17 48

What is Configured? If applicable, please provide what is configured for Amplify CLI:

Environment ``` npx envinfo --system --binaries --browsers --npmPackages --npmGlobalPackages System: OS: macOS Mojave 10.14.6 CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz Memory: 353.45 MB / 16.00 GB Shell: 5.3 - /bin/zsh Binaries: Node: 12.16.1 - ~/.nvm/versions/node/v12.16.1/bin/node npm: 6.14.4 - ~/.nvm/versions/node/v12.16.1/bin/npm Browsers: Chrome: 80.0.3987.149 Firefox Developer Edition: 77.0 Safari: 13.1 npmPackages: @aws-amplify/auth: ^3.2.4 => 3.2.4 @reach/router: ^1.3.3 => 1.3.3 aws-amplify: ^3.0.13 => 3.0.13 aws-amplify-react: ^3.1.1 => 3.1.9 bootstrap: ^4.4.1 => 4.4.1 clipboard: ^2.0.4 => 2.0.4 eslint-config-react-app: ^5.1.0 => 5.1.0 gatsby: 2.20.36 => 2.20.36 gatsby-image: ^2.2.36 => 2.2.36 gatsby-plugin-exclude: ^1.0.2 => 1.0.2 gatsby-plugin-google-analytics: ^2.3.1 => 2.3.1 gatsby-plugin-manifest: ^2.3.3 => 2.3.3 gatsby-plugin-offline: ^3.0.29 => 3.0.29 gatsby-plugin-react-helmet: ^3.1.18 => 3.1.18 gatsby-plugin-react-svg: ^3.0.0 => 3.0.0 gatsby-plugin-resolve-src: ^2.0.0 => 2.0.0 gatsby-plugin-sass: ^2.1.26 => 2.1.26 gatsby-plugin-sharp: ^2.5.3 => 2.5.3 gatsby-source-filesystem: ^2.1.42 => 2.1.42 gatsby-source-graphql: ^2.1.28 => 2.1.28 gatsby-transformer-sharp: ^2.4.3 => 2.4.3 husky: ^3.1.0 => 3.1.0 moment: ^2.24.0 => 2.24.0 node-sass: ^4.13.1 => 4.13.1 prettier: ^1.19.1 => 1.19.1 prop-types: ^15.7.2 => 15.7.2 react: ^16.12.0 => 16.12.0 react-bootstrap: ^1.0.0-beta.16 => 1.0.0 react-device-detect: ^1.11.14 => 1.11.14 react-dom: ^16.12.0 => 16.12.0 react-helmet: ^5.2.1 => 5.2.1 react-infinite-scroll-component: ^5.0.4 => 5.0.4 slug: ^2.1.0 => 2.1.0 talkjs: ^0.14.1 => 0.14.1 use-deep-compare-effect: ^1.3.0 => 1.3.0 npmGlobalPackages: @aws-amplify/cli: 4.19.0 @ionic/cli: 6.8.0 @types/express: 4.17.6 @types/googlemaps: 3.39.3 @types/node: 13.13.4 @types/places: 1.16.0 @types/react: 16.9.34 @types/request: 2.48.4 @vue/cli: 4.3.1 amplify: 0.0.11 aws-amplify: 3.0.10 aws-cli: 0.0.2 aws-sdk: 2.666.0 cordova-res: 0.14.0 eslint: 6.8.0 lumber-cli: 3.5.6 npm-check-updates: 6.0.1 npm: 6.14.4 pm2: 4.4.0 spaceship-zsh-theme: 2.11.0 typings: 2.1.1 ```

_You can turn on the debug mode to provide more info for us by setting window.LOGLEVEL = 'DEBUG'; in your app. -> Done but it doesn't show anything

shide1989 commented 4 years ago

One of my guesses, is that it's linked to this issue : https://github.com/awslabs/aws-serverless-express/issues/99

shide1989 commented 4 years ago

I think it's definitively linked to this issue, since the body returned by the API is encoded in base64. It seems to me that Axios or the RestClient class (used by amplify) is unable to decode the base64 string

cedricgrothues commented 4 years ago

Hey @shide1989, I tried to recreate your issue, but unfortunately, I wasn't able to reproduce it using the default aws-serverless-express lambda template.

I added important parts of my project below. Please let me know if there anything I am missing.

// aws-exports.js

const awsmobile = {
    "aws_project_region": "eu-central-1",
    "aws_cognito_identity_pool_id": "eu-central-1:xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
    "aws_cognito_region": "eu-central-1",
    "aws_user_pools_id": "eu-central-1_xxxxxxxxx",
    "aws_user_pools_web_client_id": "xxxxxxxxxxxxxxxxxxxxxxxxxxxx",
    "oauth": {},
    "aws_cloud_logic_custom": [
        {
            "name": "apid6e5a88b",
            "endpoint": "https://xxxxxxxxxx.execute-api.eu-central-1.amazonaws.com/dev",
            "region": "eu-central-1"
        }
    ]
};
API.post('apid6e5a88b', '/conversations', {
    body: { username: 'other' },
})
.then(r => console.log({ response: r }));

// console.log output
{
    response: {
        body: {
            username: "other"
        },
        success: "post call succeed!",
        url: "/conversations"
    }
}
// lambda function: index.js
const awsServerlessExpress = require('aws-serverless-express');
const app = require('./app');

const server = awsServerlessExpress.createServer(app);

exports.handler = (event, context) => {
  console.log(`EVENT: ${JSON.stringify(event)}`);
  return awsServerlessExpress.proxy(server, event, context, 'PROMISE').promise;
};

// lambda function: app.js
var express = require('express')
var bodyParser = require('body-parser')
var awsServerlessExpressMiddleware = require('aws-serverless-express/middleware')

var app = express()
app.use(bodyParser.json())
app.use(awsServerlessExpressMiddleware.eventContext())

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*")
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept")
  next()
});

// ...

app.post('/conversations', function(req, res) {
  res.json({success: 'post call succeed!', url: req.url, body: req.body})
});

// ...

app.put('/conversations', function(req, res) {
  res.json({success: 'put call succeed!', url: req.url, body: req.body})
});

// ...

app.listen(3000, function() {
    console.log("App started")
});

module.exports = app
stale[bot] commented 4 years ago

This issue has been automatically closed because of inactivity. Please open a new issue if are still encountering problems.

github-actions[bot] commented 3 years ago

This issue has been automatically locked since there hasn't been any recent activity after it was closed. Please open a new issue for related bugs.

Looking for a help forum? We recommend joining the Amplify Community Discord server *-help channels or Discussions for those types of questions.