Multiple CORS origins not working due to square brackets in API Gateway mapping template

[THEANTsMAN]

Bug Report

Description

When using the CORS origins functionality, the mapping template created for the API-Gateway integration response mapping templates contain square brackets being placed around all . in the urls. This then results in the origins that are defined as they are not equivalent, i.e. "https://www.example.com" !== "https://www[.]example[.]com").

The issue is present in version 1.52.2 of serverless. I found using an older version specifically 1.41.1 resolves the issue such that the mapping templates work as expected.

It seems that the change that add in the logic is #6043. Specfically it adds this function

regexifyWildcards(orig) {
    return orig.map((str) => str.replace(/\./g, '[.]')
      .replace('*', '.*'));
}

which looks to hanlde support for wildcards in origins.

1. What did you do?
   In my serverless.yml I have the following CORS setup:

cors:
    origins:
      - https://example1.com
      - https://example2.com

Deployed a lambda function with a API-Gateway endpoint. When trying to call the endpoint using one of the defined origins, I get a CORS error,

1. What happened?
   Once deployed the API Gateway integration response mapping template becomes:

#set($origin = $input.params("Origin"))
#if($origin == "") #set($origin = $input.params("origin")) #end
#if($origin == "https://example1[.]com" || "https://example2[.]com") #set($context.responseOverride.header.Access-Control-Allow-Origin = $origin) #end

There are unexpected square brackets in the URL, which when calling the API Gateway endpoints from the origins declared in the

1. What should've happened?
   I was expecting the mapping template to be:

#set($origin = $input.params("Origin"))
#if($origin == "") #set($origin = $input.params("origin")) #end
#if($origin == "https://example1.com" || "https://example2.com") #set($context.responseOverride.header.Access-Control-Allow-Origin = $origin) #end

1. What's the content of your serverless.yml file?

Serverless Framework Config File

service: myService

plugins:
  - serverless-offline
  - serverless-domain-manager
  - serverless-plugin-warmup
  - serverless-plugin-include-dependencies
  - serverless-iam-roles-per-function

provider:
  name: aws
  runtime: nodejs10.x
  profile: ${self:custom.profiles.${self:custom.stage}}
  region: ${self:custom.regions.${self:custom.stage}}
  versionFunctions: ${self:custom.versionFunctions.${self:custom.stage}}

  inlcude:
    - node_modules/*

  stage: ${opt:stage, 'offline'}
  environment: ${file(env.yml):${self:custom.stage}}

  iamRoleStatements:
  - Effect: "Allow"
    Action:
      - "lambda:InvokeFunction"
    Resource:
      - ${self:custom.invokeResource.${self:custom.stage}}

package:
  individually: true

custom:
  stage: "${opt:stage, self:provider.stage}"

  warmup:
    prewarm: true
    enabled: true
    events:
      - schedule: rate(10 minutes)

  regions:
    offline: us-east-1

  profiles:
    offline: offline

  versionFunctions:
    offline: false

  invokeResource:
    offline: ''

  serverless-offline:
    babelOptions:
      presets: ["es2015"]

  customDomain:
    domainName: ${file(env.yml):${self:custom.stage}.SERVICE_DOMAIN}
    basePath: 'service'
    stage: ${self:custom.stage}
    createRoute53Record: false

  cors:
    origins:
      - https://example1.com
      - https://example2.com
    headers:
      - Authorization

functions:
  helloworld:
    handler: functions/helloworld/handler.handle
    events:
        - http:
            path: /helloworld
            method: get
            cors: ${self:custom.cors}

3. What's the output you get when you use the SLS_DEBUG=* environment variable (e.g. SLS_DEBUG=* serverless deploy)
   No

Similar or dependent issues:

• AWS API Gateway: Support for W3C conform multiple CORS origins #3745
• Support wild-cards in cors multiple origins #6012
• Provide multi origin cors values #5740

[medikoo]

Closing as I believe it was fixed, as I checked internally, the result template is as follows now:

#set($origin = $input.params(\"Origin\"))\n#if($origin == \"\") #set($origin = $input.params(\"origin\")) #end\n#if($origin.matches(\"https://example1[.]com\") || $origin.matches(\"https://example2[.]com\")) #set($context.responseOverride.header.Access-Control-Allow-Origin = $origin) #end"