Question

我正在开发一个简单的Angular应用程序，我希望从我在Laravel中创建的API中获取后端数据。 API正在发回数据。但由于我正在单独开发我的Angular应用程序，当我在Angular中使用服务来获取我的资源时出错。

错误

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:8001/airports. This can be fixed by moving the resource to the same domain or enabling CORS.

所以现在我已经在Laravel中安装了一个应该解决问题的软件包，但我不知道如何使用它。该软件包的cofig文件如下所示：

'defaults' => array(
        'supportsCredentials' => false,
        'allowedOrigins' => array(),
        'allowedHeaders' => array(),
        'allowedMethods' => array(),
        'exposedHeaders' => array(),
        'maxAge' => 0,
        'hosts' => array(),
    ),

    'paths' => array(
        'api/*' => array(
            'allowedOrigins' => array('*'),
            'allowedHeaders' => array('*'),
            'allowedMethods' => array('*'),
            'maxAge' => 3600,
        ),
        '*' => array(
            'allowedOrigins' => array('*'),
            'allowedHeaders' => array('Content-Type'),
            'allowedMethods' => array('POST', 'PUT', 'GET', 'DELETE'),
            'maxAge' => 3600,
            'hosts' => array('api.*'),
        ),
    ),

我仍然遇到同样的错误。现在为了允许CORS，我有什么不同呢？

注意：我安装了WAMP。我正在同一个本地服务器上开发我的Angular应用程序和Laravel API。

Answer 1

我遇到了与EmberJS类似的东西，而不是Angular。 Laravel设置看起来正确，但我认为您需要在Angular中启用CORS支持。

来自Chrome开发人员教程：

关于内容安全政策的一句话

与许多其他JS MVC框架不同，   Angular v1.1.0 + 不需要在严格的CSP中进行调整。它   只是工作，开箱即用！

但是，如果您在v1.0.1之间使用较旧版本的Angular   和v1.1.0，你需要告诉Angular在内容安全性中运行   模式＆＃34 ;.这是通过在ngApp：
旁边加入 ngCsp 指令来完成的
<html data-ng-app data-ng-csp>

您可以找到整篇文章here。

使用barryvdh / laravel-cors包在laravel中启用CORS？

1 个答案: