Ionic 应用程序的跨源资源共享问题答案

【问题标题】：Cross origin resource sharing issue with Ionic appIonic 应用程序的跨源资源共享问题
【发布时间】：2015-07-19 08:24:05
【问题描述】：

所以我试图从我的 ionic 应用程序向运行在 tomcat apache 服务上的另一个应用程序进行 http 调用，但是我认为由于 CORS 问题，调用没有成功。我按照这个网站上的说明http://blog.ionic.io/handling-cors-issues-in-ionic/ 没有运气。我在http://localhost/platform/ 上运行tomcat apache 应用程序，在localhost:8100 上运行离子应用程序我将它添加到我的ionic.project 中：

{
  "name": "mobile",
  "app_id": "",
  "proxies": [
    {
      "path": "/platform",
      "proxyUrl": "http://localhost/platform/",
    }
  ]
}

将此也添加到我的 gulpfile.js 中：

gulp.task('install', ['git-check'], function() {
  return bower.commands.install()
    .on('log', function(data) {
      gutil.log('bower', gutil.colors.cyan(data.id), data.message);
    });
});

gulp.task('git-check', function(done) {
  if (!sh.which('git')) {
    console.log(
      '  ' + gutil.colors.red('Git is not installed.'),
      '\n  Git, the version control system, is required to download Ionic.',
      '\n  Download git here:', gutil.colors.cyan('http://git-scm.com/downloads') + '.',
      '\n  Once git is installed, run \'' + gutil.colors.cyan('gulp install') + '\' again.'
    );
    process.exit(1);
  }
  done();
});

我还在 app.js 中添加了这一行：

.constant('appBaseUrl', 'http://localhost:8100/platform')

这是我的 http 调用：

$http({
                method: 'post',
                url: appBaseUrl + '/j_spring_security_check',
                params: {
                    'j_username': credentails.username,
                    'j_password': credentails.password
                }
            })

但是，控制台无法获取 loginsuccess.json，它是对在 tomcat 上的后端服务器进行成功身份验证的响应。这是控制台上的回复http://s16.postimg.org/m2ua3kqc5/console.png

我花了一整天的时间试图完成这项工作，但没有运气。顺便说一句，http://localhost/platform/ 的代理和代理密码的规范在 apache 文件夹中的 httpd.conf 文件中定义。

【问题讨论】：

你可以试试把 127.0.0.1 换成 localhost 吗？
我应该在哪里尝试？对于所有本地主机？还是 appBaseUrl？还是用于 proxyUrl？
随处试一试。
有什么理由说明这应该有效吗？
您是否尝试过使用chrome.google.com/webstore/detail/allow-control-allow-origi/… chrome 插件。为我工作

标签： angularjs apache tomcat ionic-framework

【解决方案1】：

这可能是您的端口号差异，我敢打赌这会因浏览器而异。您正在测试的当前浏览器可能会将 localhost:80 和 localhost:9000 视为关于 CORS 的两个不同域。尝试按上下文区分应用程序。这样浏览器就可以确定所有请求都来自同一个父上下文。

父上下文

http://localhost/platform/

子上下文（离子）

http://localhost/platform/ionic

【讨论】：