Simple POST request works in Postman but not in browser

Question

I am experiencing an issue where a POST endpoint is returning a response when run in Postman but not when running it in the browser.

I have setup an API endpoint on AWS via serverless. Here is the .yml config for that:

service: tableau-export-rest

provider:
  name: aws
  runtime: nodejs10.x
  region: eu-west-1
  stage: ${opt:stage, 'dev'}
  timeout: 900
  memorySize: 3008

functions:
  storeExportFiters:
    handler: index.storeExportFiters  
    events:
      - http: 
          path: /store-export-filters
          method: post
          cors: true

The endpoint resolver storeExportFiters (which is a lambda) for now just returns a success message:

module.exports = (event, ctx, cb) => {
  return cb(null, {
    statusCode: 200,
    body: JSON.stringify({
      worked: true
    })
  });
}

When I deploy this to AWS and try hitting the endpoint from Postman via a POST request with no body or anything it sends me the response fine. When I try do it in the browser however I get a cors error:

Access to XMLHttpRequest at 'https://myapi.com/store-export-filters' from origin 'http://localhost:9003' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Here is the browser code used to try get a response from the endpoint. I am using Axios for the http request:

  axios.post('https://myapi.com/store-export-filters')
    .then(function (response) {
      console.log(response);
    })
    .catch(function (error) {
      console.log(error);
    });

I can't see why I would be getting a CORS error here especially as it works in Postman on my machine.

score 5 · Accepted Answer · answered Apr 17 '20 at 13:26

5

Your API is not configured for cross origin requests. You need to configure your server to allow these requests.

Access-Control-Allow-Origin: *

This will allow your API to receive requests from any origin, however can be a major security issue.

Configuring your API to accept requests only from specific origins fixes this issue.

Access-Control-Allow-Origin: hostname:port

answered Apr 17 '20 at 13:26

DanC12

294
2
4
19

6

Why does it work in Postman then? Also I enabled cors in serverless so wouldn't that do it? I'm using lambda for the resolvers so there is no server – red house 87 Apr 17 '20 at 14:02
but the rejection is coming from the API, not the client - no? – red house 87 Apr 17 '20 at 14:21
No. The browser is blocking the request because it only allows requests from the same origin for security reasons. – DanC12 Apr 17 '20 at 14:28
ok, and Postman gets around this because it does not have an origin? – red house 87 Apr 17 '20 at 14:35
@redhouse87 did you get a basic understanding about that so far? i also reached the same conclusion as yours and curious about the same question which is whether a postman request gets around this. – Nostromo Sep 19 '20 at 13:25
2

@Nostromo It "gets around it", because postman is not a web browser, and does not care about CORS. Here is a good StackOverflow post about it https://stackoverflow.com/a/36486188/7800355 – DanC12 Sep 20 '20 at 15:15

Simple POST request works in Postman but not in browser

1 Answers1