角JS $ HTTP POST与laravel

问题

当我尝试发布的数据，我得到的错误。当然，我做错了什么，也是即时新的角度。当我做得很好，但我不知道如何做POST。

控制器

myApp.controller('createListController', ['$scope', '$log', '$http', 
    function($scope, $log, $http){ 
     $http({ 
      method: 'POST', 
      url: 'http://localhost:8888/lists', 
      data: $scope.name 
     }) 
    }]);

HTML

<form method="post" action="" > 
    <label>List name</label> 
    <input type="text" ng-model="name" name="name" class="form-control" placeholder="Type list name" /> 
    <button type="submit" ng-model="submit" name="submit" class="btn btn-primary form-control">Add list</button> 
</form>

Laravel rout.php

Route::group(['middleware' => 'cors'], function() { 
    Route::get('lists', '[email protected]'); 
    Route::post('lists', '[email protected]'); 
});

Laravel中间件

class Cors 
{ 
    public function handle($request, Closure $next) 
    { 
     $response = $next($request); 
     $response->headers->set('Access-Control-Allow-Origin', '*'); 
     $response->headers->set(
      'Access-Control-Allow-Headers', 
      'Authorization, Content-Type, If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since' 
     ); 
     $response->headers->set('Access-Control-Allow-Credentials', 'true'); 
     $response->headers->set('Access-Control-Allow-Methods', '*'); 
     return $response; 
    } 
}

Laravel kernel.php

protected $routeMiddleware = [ 
     'cors' => \App\Http\Middleware\Cors::class, 
    ]; 
}

尝试与

myApp.controller('createListController', ['$scope', '$log', '$http', 
    function($scope, $log, $http){ 
     if ($scope.submit == true){ 

     $http({ 
      method: 'POST', 
      url: 'http://localhost:8888/lists', 
      data: {name: 'text'} 
     }) 

     .success(function() { 
      console.log('true'); 

     }) 
     .error(function(){ 
      console.log('false'); 
     }) 
     } 

    }]);

解决，但它不工作了。我不知道我做错了，如何发布数据的权利..

错误消息从控制台

错误：XMLHttpRequest的无法加载本地主机：8888 /列表。请求的资源上没有“Access-Control-Allow-Origin”标题。 Origin'localhost';因此不被允许访问。

问题

如何解决这个错误，并得到角JS $ HTTP POST与laravel？

我的意见

我觉得有什么不对的角度控制器，它不能从形式或类似的东西，也许数据。

来源

2015-09-06 rincuuk

你得到的错误是什么？ –

只是说，你应该把你的实际http请求放在服务/工厂中，然后在你的控制器中调用它 –

控制台出错： XMLHttpRequest无法加载http：// localhost：8888/lists。请求的资源上没有“Access-Control-Allow-Origin”标题。因此不允许Origin'http：// localhost'访问。 false – rincuuk

解决方案

我用我自己得到了解决。在第一次使我的角度控制器正常工作：

myApp.controller('createListController', ['$scope', '$log', '$http', 
    function($scope, $log, $http){ 

      $scope.addList = function() { 
      var list = { 
       name: $scope.listname 
      }; 

     $http({ 
      method: 'POST', 
      url: 'http://localhost/anydocopy/public/lists', 
      data: list 
     }) 

      .success(function() { 
       console.log('true'); 
      }) 
      .error(function(){ 
       console.log('false'); 
      }) 
    } 

    }]);

在第二个我设置NG-模型参数输入文字和NG单击参数按钮：

<label>List name</label> 
<input type="text" ng-model="listname" class="form-control" placeholder="Type list name" /> 
<button type="submit" ng-click="addList()" name="submit" class="btn btn-primary form-control">Add list</button>

在与POST方法域3不能是不同的（至少在角度），所以我不使用本地主机：8888，但使用完整路径本地主机/文件夹/ ..它为我工作。现在我可以将数据从前端发布到后端。

来源

2015-09-06 15:24:37 rincuuk

我从来没有使用Laravel，但是您需要向您的rout.php添加OPTIONS请求，而不仅仅是GET和POST。

因为您说GET有效，但不是POST，所以我认为这是简单的和预先请求的问题。 POST原来是飞行前请求，因为Angular默认使用application/json作为数据类型。关于飞行前请求的MDN：

它使用GET，HEAD或POST以外的方法。另外，如果POST用于发送具有除application/x-www-form-urlencoded，multipart/form-data或text/plain之外的Content-Type的请求数据，如果POST请求使用application/xml或text/xml向服务器发送XML有效内容，则会请求该请求。

因此，要么将您的POST数据转换为urlencoded，要么让服务器响应OPTIONS请求。哪种方法更好，因为您可能需要以某种原因进行预先飞行。

来源

2015-09-06 11:50:33 nomve

角JS $ HTTP POST与laravel

回答

相关问题