search

jdesrosiers / silex-cors-provider

A silex service provider that adds CORS services to silex
MIT License
78 stars 25 forks source link

Not working with php build in server #17

Closed localgod closed 9 years ago

localgod commented 9 years ago

If I start my skeleton app like this:

php -S localhost:8000

Serving this file:

<?php
require_once __DIR__ . '/../vendor/autoload.php';

$app = new Silex\Application();
$app->register(new JDesrosiers\Silex\Provider\CorsServiceProvider(), array());
$app->after($app["cors"]);

$app->get('/', function () use($app) {
    $data = array(
        'title' => 'Hello world'
    );
    return $app->json($data);
});

$app->run();

When I access the server from my angularjs app running on 127.0.0.1:10000 I get the following error in my browser:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://127.0.0.1:8000/. (Reason: CORS request failed).

Any hints?

jdesrosiers commented 9 years ago

There is nothing wrong with the code you have provided. I created a simple static HTML page that makes a cross-origin request to the code you provided using jQuery. Everything worked as expected. Therefore, I suspect that the problem is in your angularjs app. I'm not familiar enough with angularjs to setup my own test using angularjs.

jdesrosiers commented 9 years ago

I found a jsfiddle that I was able to modify to setup a test with angularjs. Everything still seems to be working as expected. Here is the code I used.

<html>
  <head>
    <title>Test CORS</title>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.16/angular.js"></script>
    <script>
      angular
        .module('Test', [])
        .controller('corsCtrl', function ($scope, $http) {
          $scope.useHttp = function() {
            $http
              .get('http://localhost:8000')
              .success(function(data) {
                alert(data.title);
              });
          };
        });
    </script>
  </head>
  <body>
    <div ng-app="Test">
      <div ng-controller="corsCtrl">
        <button ng-click="useHttp()">$http.get request</button>
      </div>
    </div>
  </body>
</html>
localgod commented 9 years ago

Hmmm. Your example dos not work on my setup (osx, firefox 38 and safari 8). Any idea?

Update: Ok I got you example working.... now to figure out why my angular example dos not:

angular.module('exampleApp')
  .controller('MainCtrl', function ($scope, $http) {
      $scope.myData = {};
      $scope.myData.doClick = function(item, event) {

          var responsePromise = $http.get("http://127.0.0.1:8000");

          responsePromise.success(function(data, status, headers, config) {
              $scope.myData.fromBackend = data.title;
          });
          responsePromise.error(function(data, status, headers, config) {
              alert("AJAX failed!");
          });
      }
  });
localgod commented 9 years ago

Turns out you can not use 127.0.0.1 but localhost works. Strange but what can you do...