Visual Studio、Ripple 模拟器和 CORS/Cross 域 Ajax

Question

我在处理多设备混合应用程序时遇到 Visual Studio 问题。当我尝试对外部 Web 服务执行 ajax 调用时，出现了一些纹波错误。（跨域安全问题）。我的代码在部署到移动设备时工作正常。

通过研究我发现了以下内容：

Ripple 有自己的代理设置
- 在 Ripple 中，转到设置，然后在代理设置上选择本地、禁用或远程（取决于您的情况）。
- 这似乎对某些人有用，但我现在有一个不同的错误。（错误请求）
我发现更多信息表明 Chrome 可以在无网络安全模式下启动，当您运行时通过命令行开关。
- 这个问题是 Visual Studio 似乎硬编码了 Chrome 的路径，它用来打开涟漪。
- 因此我无法在无网络安全模式下启动 chrome...

Answer 1

我通过下载和安装 chrome 扩展解决了这个问题，它设置了网络安全设置 'on' 和 'off'。

Link 扩展名：https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?utm_source=chrome-app-launcher-info-dialog

Visual studio 似乎运行 Chrome 的 separate/second 副本。
您必须在 VS 在运行s Ripple 时打开的 Chrome 实例中安装扩展。如果您在普通 Chrome 浏览器中安装扩展程序，它在 VS 使用的实例中不可用。
然后我不得不将我的 ripple 代理设置设置为禁用。
如果我只是在 ripple 中调试，并且 CORS 设置已经打开，调用也会失败。每次我在 ripple 中调试时，我都必须物理地翻转开关，关闭，然后再打开，否则我会遇到跨域问题。

现在一切都很好，生活可以继续。

Answer 2

我遇到了与 Louis 完全相同的问题，但自从 Chrome 48 以来，所有 CORS 扩展似乎都已停止工作。我想出了一个我想分享的替代解决方案。

在您的 Chrome 安装目录中 - 可能是 C:\Program Files (x86)\Google\Chrome\Application - 创建 chrome.exe
右键单击此快捷方式和 select 属性
在“快捷方式”选项卡的“目标”字段中附加以下两个字段 --allow-file-access-from-files --disable-web-security 4.保存并将快捷方式重命名为 "Google Chrome - Debug with Ripple"
右键单击它并select固定到开始菜单

此快捷方式将允许您运行 Chrome 没有网络安全，这允许 Ripple 中的 CORS。通过使用快捷方式，这不会影响您正常使用 Chrome。现在为了使用 Ripple

在 Visual Studio 中调试您的应用程序，它将在其自己的 Chrome 实例中启动 Ripple
现在打开开始菜单并单击固定的 "Google Chrome - Debug with Ripple" 快捷方式
Chrome 的第二个实例将以 "You are using an unsupported command-line flag: -- disable-web-security. Stability and security will suffer."
将 Ripple 代理 URL 从 Visual Studio 实例复制到这个新实例，例如 http://localhost:4400/index.html?enableripple=cordova-3.0.0-NexusS
您的 CORS 请求现在可以在 Ripple 中工作。

请注意，Visual Studio 刚刚用于启动 Ripple。需要使用 Chrome 的开发人员工具进行调试。

另请注意，您可以通过浏览至 url chrome://version/

来仔细检查 Chrome 是否正在使用您的快捷方式标志

希望对您有所帮助！

Answer 3

作为在 Ripple 模拟器中禁用跨域代理的附加说明...

如果您正在调用 API，例如 Azure 移动应用程序 API，请不要忘记通过将 "Access-Control-Allow-Origin" 标志设置为 [来允许对 API 的外部调用=22=].

在我的场景中，我正在开发一个使用 Azure 移动应用程序作为后端的 Ionic v1 应用程序。

在web.config >>

<configuration>
 <system.webServer>
   <httpProtocol>
     <customHeaders>
       <add name="Access-Control-Allow-Origin" value="*" />
     </customHeaders>
   </httpProtocol>
 </system.webServer>

</configuration>

Visual Studio、Ripple 模拟器和 CORS/Cross 域 Ajax

Visual Studio, Ripple Emulator and CORS/Cross Domain Ajax

visual-studio

cordova

hybrid-mobile-app

ripple