Angularjs 将atatus添加到ionic项目时的CORS问题

我正试图增加我的爱奥尼亚项目。我按照说明加入了脚本

第一次尝试

因此，我的

index.html

包含如下脚本：

<script src="https://dmc1acwvwny3.cloudfront.net/atatus.js" crossorigin="anonymous" type="application/javascript" />
<script type="text/javascript"> atatus.config('MY_API_KEY').install(); </script>

第二次尝试

然后，我试图通过在

ionic.project

文件中添加代理来解决CORS问题，该文件是根据ionic提供的。因此，我的

ionic.project

文件包含：

{
  "name": "my-amazing-app",
  "app_id": "345gfsd3trf",
  "gulpStartupTasks": [
    "build:env",
    "build:index",
    "build:sass",
    "build:template",
    "build:js",
    "concat:index",
    "watch"
  ],
  "proxies": [
    {
      "path": "/atatus.js",
      "proxyUrl": "https://dmc1acwvwny3.cloudfront.net/atatus.js"
    }
  ]
}

因此，我更改了

index.html

以使用此代理：

<script src="http://localhost:8100/atatus.js" crossorigin="anonymous" type="application/javascript" />
<script type="text/javascript"> atatus.config('MY_API_KEY').install(); </script>

但不幸的是，我在控制台中收到一个被拒绝的连接：

GEThttp://localhost:8100/atatus.js 网络：：错误连接被拒绝

第三次尝试

我想这可能是因为使用了

localhost

而不是我的内部IP

192.168.178.59

。因此，我将

localhost

的所有用法都改为

192.168.178.59

，但后来我得到了一个

403禁止的

第四次尝试

我做的最后一个测试是通过bower在本地添加

atatus

库：

bower install atatus-js

还相应地更改了

index.html

：

<script src="lib/atatus-js/atatus.min.js" crossorigin="anonymous" type="application/javascript" />
<script type="text/javascript"> atatus.config('MY_API_KEY').install(); </script>

我不明白。为什么它会抱怨

http://192.168.178.59:3001/socket.io/socket.io.js

。这是我的本地运行的

socket.io

服务器，它运行正确，配置了CORS。如果不添加atatus，整个项目将使用这些套接字完美运行

第五次尝试

我第四次尝试将该项目部署到DigitalOcean服务器上。因此，

atatus

库在本地加载（bower）。没有出现CORS问题，但在控制台中添加通知时，我收到以下错误：

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.
Uncaught TypeError: Cannot read property 'test' of undefined(…)

解决方案

我必须更改两个设置，分别是：

• 设置下一个：

  $.ajaxPrefilter（函数（options，originalOptions，jqXHR）{options.async=true；}）

• 将https://*.atatus.com添加到

  内容安全策略的
  元标题的
  默认src

---

感谢@MarkVeenstra

---

由于

Cordova 5.x

，您需要指定

内容安全策略

元头。在

默认src

的这个标题中，您必须添加

https://*.atatus.com

。然后一切正常。
您当地的atatus（第五次尝试）的版本号是多少？（您可以在atatus.js文件的顶部看到它）。仅供参考，我们没有使用XMLHttpRequest向服务器发送有效负载。我们只是使用图像脚本标记发送有效负载。这是第五次尝试中通过

bower

安装的

AtatusJs.min.js

中的版本信息：`AtatusJs-v2.2.5-2015-09-01`I尝试过：（。但我无法重现该问题。您可以尝试

$.ajaxPrefilter（函数（选项，原始选项，jqr））{options.async=true；}）

同步XMLHttpRequest消息已消失，但

未捕获类型错误：无法读取未定义的属性“test”仍然出错。很好。是否可以添加debugMode选项以查看发送到atatus服务器的任何有效负载？
atatus.config（'MY_API_KEY'，{debugMode:true}）。install（）
当您调用
atatus.notify（新错误（'Test atatus Setup'））；
时，它应该打印发送负载，您也可以在网络面板中看到请求。
<script src="lib/atatus-js/atatus.min.js" crossorigin="anonymous" type="application/javascript" />
<script type="text/javascript"> atatus.config('MY_API_KEY').install(); </script>

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.
XMLHttpRequest cannot load http://192.168.178.59:3001/socket.io/socket.io.js. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://192.168.178.59:8100' is therefore not allowed access.
Uncaught TypeError: Cannot read property 'test' of undefined(…)

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.
Uncaught TypeError: Cannot read property 'test' of undefined(…)