按照AWS教程搭建的自定义CCP无法连接Amazon Connect控制台求助

问题背景 #

按照AWS Skill Builder的《Amazon Connect Build a Custom Call Control Panel》教程完成所有步骤后，从S3桶打开ccp.html仅能显示自定义CCP界面，无法关联Amazon Connect控制台。已添加S3公共读取策略（如下），排查过ccpcourse.js及网络日志，问题仍未解决。

已配置的S3桶策略 #

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::<bucket-name>/*"
        }
    ]
}

（注：曾尝试同时添加"Resource":"arn:aws:s3:::<bucket-name>"，问题依旧）

核心排查与修复步骤 #

• 校验Connect实例参数：打开ccpcourse.js，确认connect.init()方法中的instanceUrl是你的Connect实例完整域名（格式如https://[你的实例名称].awsapps.com/connect），实例ID、区域参数也必须与实际实例匹配。
• 配置S3桶CORS规则：S3桶的CORS配置需允许Connect实例的跨域请求，添加以下规则到S3桶的CORS设置中：

  <CORSConfiguration>
    <CORSRule>
      <AllowedOrigin>https://[你的Connect实例域名].awsapps.com</AllowedOrigin>
      <AllowedMethod>GET</AllowedMethod>
      <AllowedMethod>POST</AllowedMethod>
      <AllowedHeader>*</AllowedHeader>
    </CORSRule>
    <CORSRule>
      <AllowedOrigin>*</AllowedOrigin>
      <AllowedMethod>GET</AllowedMethod>
      <AllowedHeader>*</AllowedHeader>
    </CORSRule>
  </CORSConfiguration>
  

• 检查身份验证流程：查看ccpcourse.js中的登录逻辑，确保使用的凭证（临时AWS凭证或Connect用户凭证）拥有访问Connect CCP API的权限。通过浏览器开发者工具的Network标签，筛选/connect/ccp-v2/开头的请求，检查是否返回401（未授权）或403（禁止访问）错误。
• 排查浏览器控制台报错：打开F12开发者工具的Console标签，查看是否存在JavaScript执行错误，比如connect对象未加载、跨域请求被拦截等，这类错误会直接指向问题根源。
• 确认S3静态网站托管配置：确保S3桶已开启静态网站托管功能，索引文档设置为ccp.html，且访问的是S3提供的静态网站域名（而非S3对象的直接URL）。
• 检查Connect实例CCP权限：在Amazon Connect控制台的「电话设置」>「呼叫控制面板」中，确认已启用自定义CCP，且未设置IP访问限制或用户权限拦截。

内容的提问来源于stack exchange，提问作者jaideep singh