2017-01-31 6 views
0

Я работаю над Symfony 3.2, и я пытаюсь использовать некоторые AJAX-запросы с AngularJS на некоторых страницах.AngularJS Http GET делает недействительным токен CSRF

У меня есть следующий HTML-код:

<div ng-app="timelineApp" ng-controller="timelineCtrl"> 
    <div id="timeline-container"> 
    <div ng-repeat="p in posts" class="w3-container w3-card-2 w3-white w3-round w3-margin"><br> 
     // ... 
    </div> 

    <div class="w3-card-2 w3-margin"> 
     <button ng-click="fetch()" id="fetch-button" class="w3-btn-block w3-btn w3-theme-d1 w3-round" type="button">Load 10 more posts.</button> 
    </div> 
    </div> 
</div> 

С JavaScript:

var app = angular.module('timelineApp', []).config(function($interpolateProvider){ 
     $interpolateProvider.startSymbol('{[{').endSymbol('}]}'); 
    }); 

    app.controller('timelineCtrl', function($scope, $http) { 
    $scope.offset = 0; 
    $scope.posts = []; 
    $scope.fetch = function() { 
     var uri = "/api/timeline/{{ app.user.id }}/" + $scope.offset; 
     $http 
     .get(uri) 
     .then(
      function(response) { 
      $scope.posts = $scope.posts.concat(response.data.posts); 
      $scope.offset += 1; 

      if(response.data.posts.length < 10) { 
       $('button#fetch-button').css('display', 'none'); 
      } 
      }, 
      function(response) { 
      console.log(response.status) 
      } 
     ) 
     ; 
    } 

    $scope.fetch(); 
    }); 

И в некоторых точках на странице, я также иметь Symfony формы, которые просто ставят там с {{ form(form_name) }}.

Если я не позволю выполнить какой-либо запрос AJAX (т. Е. Я удаляю $scope.fetch(); и никогда не нажимаю кнопку, которая также запускает запрос), мои формы работают нормально, и я могу отправить любой из них. Но как только выполняется один запрос ajax, любая форма, которую я публикую, отклоняется из-за недопустимого токена CSRF.

Я нашел несколько сообщений, но ни один из них не помог мне, как я могу предотвратить, чтобы мои запросы AJAX лишали формы? Позже я также буду делать запросы POST с угловым, я думаю, у меня будет такая же проблема.

ответ

0

Итак, после некоторых попыток и отладки я действительно понял, что, написав var uri = "/api/timeline/{{ app.user.id }}/" + $scope.offset;, запрос был сделан в производственную среду, в то время как в настоящее время я тестирую среду разработки в своем браузере. Отсюда и двусмысленность на сессиях.

Простым решением было изменить это на var uri = "/{% if app.environment == 'dev' %}app_dev.php/{% endif %}api/timeline/{{ app.user.id }}/" + $scope.offset;, так что при тестировании в среде dev запросы также отправляются в среду dev. Сейчас все работает хорошо.

Смежные вопросы