-
When I’m calling the Amazon connect instance from my local machine
I’m facing this
error – Amazon connect instance refused to connect
And in console it
showing this issue:ancestor violates. In ‘< URL >’ It is:https://< Amazon connect Instance name >.my.connect.aws/. -
When I’m running this on cloud environment it is showing enter image description here
This is the Code I’m running in index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="connect-streams-min.js"></script>
</head>
<!-- Add the call to init() as an onload so it will only run once the page is loaded -->
<body onload="init()">
<div id="container-div" style="width: 400px; height: 800px;"></div>
<script type="text/javascript">
var containerDiv = document.getElementById("container-div");
var instanceURL = "https://<Amazon connect instance>.my.connect.aws/ccp-v2/";
// initialize the streams api
function init() {
// initialize the ccp
connect.core.initCCP(containerDiv, {
ccpUrl: instanceURL,
loginPopup: true, // optional, defaults to `true`
loginPopupAutoClose: true, // optional, defaults to `false`
loginOptions: { // optional, if provided opens login in new window
autoClose: true, // optional, defaults to `false`
height: 600, // optional, defaults to 578
width: 400, // optional, defaults to 433
top: 0, // optional, defaults to 0
left: 0 // optional, defaults to 0
},
loginUrl: "https://<Amazon connect instance>.my.connect.aws/ccp-v2/",
region: "us-east-1", // REQUIRED for `CHAT`, optional otherwise
softphone: { // optional, defaults below apply if not provided
allowFramedSoftphone: true, // optional, defaults to false
disableRingtone: false, // optional, defaults to false
ringtoneUrl: "./ringtone.mp3" // optional, defaults to CCP’s default ringtone if a falsy value is set
},
pageOptions: { //optional
enableAudioDeviceSettings: false, //optional, defaults to 'false'
enablePhoneTypeSettings: true //optional, defaults to 'true'
},
shouldAddNamespaceToLogs: false, //optional, defaults to 'false'
ccpAckTimeout: 5000, //optional, defaults to 3000 (ms)
ccpSynTimeout: 3000, //optional, defaults to 1000 (ms)
ccpLoadTimeout: 10000 //optional, defaults to 5000 (ms)
});
}
</script>
<button onclick="location.href='https://<Amazon connect instance>.my.connect.aws/ccp-v2/'">agent login</button>
</body>
</html> [1]: https://i.stack.imgur.com/ZWjzX.png
[2]: https://i.stack.imgur.com/b4IPw.png`
[3]: https://i.stack.imgur.com/4V8uw.png
2
Answers
The site you’re trying to frame, or even a page framed by a page you’re framing, sets response headers restricting framing to sites on the same origin. "X-Frame-Options: sameorigin" and "Content-Security-Policy: frame-ancestors ‘self’" are pretty much the same thing, and modern browsers will disregard X-Frame-Options when Content-Security-Policy frame-ancestors is present.
This site doesn’t allow any other site to frame it. If you control it you can change the frame settings on that page. Otherwise you’ll have to do things in a different way as browsers simply won’t let you frame it.
Have you added the domain that this is running on to the Allowed Origins in your Connect instance on AWS? You need to do that.