AWS Connect API CORS issue

Question

I am new to AWS and been struggling to find a solution for my problem. I am trying to create a custom chat widget for our website using Amazon Connect and I am using this API to start a chat contact.

I am following this article to create a custom chat widget for our website.

The problem I am facing is the CORS error when I try to start a chat session. I am following this documentation from AWS.

This is what I have so far

<script type="text/javascript">

    AWS.config.credentials = new AWS.Credentials({
      accessKeyId: "keyId",
      secretAccessKey: "secret"
    });

    AWS.config.region = "us-east-1";

    var connect = new AWS.Connect({
        apiVersion: '2017-08-08',
        region: 'us-east-1',

    });

    new AWS.Connect(options = {});

    var params = {
        ContactFlowId: '67324a76-5b54-48a3c1-a0da-c64e26700af9', /* required */
        InstanceId: '54b0f2c2-dd64-4ce3a4-973f3f-c3fea84f12c1E', /* required */
        ParticipantDetails: { /* required */
            DisplayName: 'test_customer' /* required */
        },
        ClientToken: '',
        InitialMessage: {
            Content: 'test', /* required */
            ContentType: 'string' /* required */
        }
        
    };

    connect.startChatContact(params, function(err, data) {
        if (err) console.log(err, err.stack); // an error occurred
        else     console.log(data);           // successful response
    });

</script>

and this is the error that I get

I really don't have any idea if what I am doing is correct. Please help.

Answer 1

Try going to the AWS Connect in AWS (The actual AWS console not the Connect console).

The click on "Application Integrations" and then "+add origin" and add the url to your custom chat widget.