title: Why AngularJS sends X-XSRF-TOKEN header as JSON string?
body: <p><a href="https://github.com/angular/angular.js/blob/master/src/ng/http.js#L663" rel="nofollow">Angular sets the <code>X-XSRF-TOKEN</code> header to the value of the <code>XSRF-TOKEN</code> cookie:</a></p>
  
  <pre><code>var xsrfValue = isSameDomain(config.url, $browser.url())
                  ? $browser.cookies()[config.xsrfCookieName || defaults.xsrfCookieName]
                  : undefined;
  if (xsrfValue) {
    headers[(config.xsrfHeaderName || defaults.xsrfHeaderName)] = xsrfValue;
  }
  </code></pre>
  
  <p>But, if one sets the <code>XSRF-TOKEN</code> cookie using <code>$cookieStore</code> (for Rails integration, for example):</p>
  
  <pre><code>$cookieStore.put("XSRF-TOKEN", "my_token"); 
  </code></pre>
  
  <p><a href="https://github.com/angular/angular.js/blob/master/src/ngCookies/cookies.js#L158" rel="nofollow">the cookie is stored as JSON string:</a></p>
  
  <pre><code>put: function(key, value) {
    $cookies[key] = angular.toJson(value);
  }
  </code></pre>
  
  <p>This means that the header will have the extra double quotes:</p>
  
  <pre><code>X-XSRF-TOKEN    "my_token"
  </code></pre>
  
  <p>Why Angular doesn't call <a href="http://docs-angularjs-org-dev.appspot.com/api/angular.fromJson" rel="nofollow"><code>fromJson()</code></a> when it sets the value of the header so that the header will look like this:</p>
  
  <pre><code>X-XSRF-TOKEN    my_token
  </code></pre>
  
  <p>? </p>
  
  <p>That would save us from removing the extra double quotes on the server side.</p>
  
  <p>Am I missing something obvious here?</p>
  
  <p><strong>Note:</strong> I'm not looking for workarounds. I'm trying to understand whether this behavior is the intended behavior, and if yes, what is the rationale?</p>