Failed to execute 'setRequestHeader' on 'XMLHttpRequest' when form fields have a new line/certain UTF-8 chars

[Vixxd]

Hi there,

I am trying to submit a form with a multi-line text area, using my service as follows: baseSites.customPUT(site, site.name);

I am using a Request Interceptor for token authorisation as follows:

 function AuthInterceptor(API, AuthService, $state) {
    return {
      request: function (headers, params, element, httpConfig) {
        headers = headers || {};
        var token = AuthService.GetToken();
        var config = httpConfig.indexOf(API) === 0;

        if (config && token) {
          headers['Authorization'] = 'JWT ' + token;
          //console.log("Headers current are", headers);
        }
        return {
          headers: headers
        }
      },

At the line "Headers currently are," the following is printed:

Authorization:"JWT ... etc."
description:"Li Europan lingues es membres del s↵↵am familie.Lor separat existentie es un Li Europan lingues es membres del sam familie.Lor separat existentie"
id:103
... etc.

The form is submitted with no issue when there are no line returns. When there are line returns (↵↵), or certain (?) UTF-8 chars for that matter, I get the following error:

angular.js:12783 Error: Failed to execute 'setRequestHeader' on 'XMLHttpRequest':

'Li Europan lingues es membres del s

am familie.Lor separat existentie es un Li Europan lingues es membres del sam familie.Lor separat existentie' 

is not a valid HTTP header field value.

From searching I see other people who get this error are often using non-English or other UTF-8 characters, but:

• they are not using Restangular
• they fix this by removing these fields from their headers directly (http://stackoverflow.com/questions/24326885/failed-to-execute-setrequestheader-on-xmlhttprequest-is-not-a-valid-ht)

I am not sure how to do this with Restangular, or if that will actually help.

Also setting the headers to have any variant of the following does not appear to help:

Content-type: application/json; charset=utf-8

Accept: application/json Accept-Charset: utf-8

Accept: application/json;charset=utf-8

Any help would be appreciated, thanks.

Versions:

"angular": "^1.4.0",
"restangular": "^1.5.2",
"resolutions": {
    "angular": "^1.0.8",
    ...
},

Chome Version 49.0.2623.87 m

[Vixxd]

EDIT: After MORE further research, the same problem happens in IE:

SyntaxError The string did not match the expected pattern. (Legacy code value: 12 and legacy constant name: SYNTAX_ERR)

I am going to just try to parse the form data into a JSON-friendly format without UTF-8 characters. If there is still a way to use restangular to handle UTF-8 chars nicely via HTTP POST headerse please let me know

Original Post: Urg, from doing more searching it would appear Chrome throws up this error when submitting Unicode values greater than (U+00FF) (ÿ): https://bugs.chromium.org/p/chromium/issues/detail?id=319694#c12 but the unicode char in question: http://www.fileformat.info/info/unicode/char/21B5/index.htm (U+21B5) (↵).

Alternatively, is there any way to use Restangular to still POST but without having the data explicitly in the HTTP header for server-side parsing? Or would wrapping my form fields in a 'data' object still cause the same problem?

As submitting form data with line breaks should be so seemingly common, is there a way to do this with \n rather than ↵? Or will that again cause the same issue as that seems to be why this SO post (also referenced above) was made in the first place?

[daviesgeek]

Were you able to fix this problem? It seems like you were going to try a workaround. Did that work?