CODEWITHSUNDEEP
javascriptphpangularjsxmlhttprequestcors
Dixit
Dixit

Reputation: 13046

Allow CORS in AngualrJS and PHP

I am using AngualrJS for one page app with some PHP (MAMP PRO as a dev env.)

In angular http get request I have 3rd party api provider which gives me json back on http request.

When I make request I get "No 'Access-Control-Allow-Origin' header is present on the requested resource".

Basically I am stuck in CORS for more than 8hr now! and not sure how to get browser (Chrome/FF) override CORS and send out http request.

here is get request in Controller.js:

In Angular js:

factory.fetchJson = function (filePath) {

        return $http.get(filePath)
            .success(function (data, status) {
                return data;
                console.log('Success Fetch JSON', status);
            }).error(function (data, status, headers, config) {
                console.log('Error Fetch JSON', status);
            });
 }

Setting to allow CORS in angualrjs Controller.js

myApp.config(['$httpProvider', function($httpProvider) {
    $httpProvider.defaults.useXDomain = true;
    $httpProvider.defaults.withCredentials = true;
    delete $httpProvider.defaults.headers.common["X-Requested-With"];
    $httpProvider.defaults.headers.common["Accept"] = "application/json";
    $httpProvider.defaults.headers.common["Content-Type"] = "application/json";

}
]);

Settings to allow CORS in index.php header:

    <html>

<?php

    // Allow from any origin
    if (isset($_SERVER['HTTP_ORIGIN'])) {
        header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}");
        header('Access-Control-Allow-Credentials: true');
        header('Access-Control-Max-Age: 86400');    // cache for 1 day
    }

    // Access-Control headers are received during OPTIONS requests
    if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {

        if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
            header("Access-Control-Allow-Methods: GET, POST, OPTIONS");

        if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
            header("Access-Control-Allow-Headers:        {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");

        exit(0);
    }

    echo "You have CORS!";

    ?>

I am not after JSOP or MIM Proxy.

Help!

Upvotes: 2

Views: 1737

Answers (1)

Dixit
Dixit

Reputation: 13046

Finally After all that in chrome just Installed: https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?hl=en-US and CORS Working fine.

Upvotes: 1

Related Questions