Строка UTF-8 не декодирована правильно в AngularJS

у меня есть текстовое поле ввода, в СПА, построенном на AngularJS, для пользователей, чтобы добавить заголовок к распечатке. Поле ввода объявляется следующим образом:

<input class="chart-title" type="text" ng-model="chartTitle" ng-change="titleChanged()"/>

текстовое поле заполняется по умолчанию название сервера. Пользователь может изменить название на то, что ему подходит. При изменении заголовка сервер обновляется и отправляет обратно новый заголовок в заголовке ответа, который затем заменяет заголовок в поле. Это отлично работает для стандартного типа ASCII письмена.

однако для символов Юникода (например, àßéçøö) это не работает. Текст отправляется правильно, обновляется на сервере правильно и возвращается в SPA правильно. Заголовки запроса / ответа находятся здесь:

Request URL:http://blahblahblah/api/.....&chartTitle=Instrument:%20%C3%A0%C3%9F%C3%A9%C3%A7%C3%B8%C3%B6

Заголовки Ответа:

chartTitle: Instrument: %C3%A0%C3%9F%C3%A9%C3%A7%C3%B8%C3%B6

запрос выполняется с помощью AngularJS $http(). Как вы можете видеть, значения совпадают (пространство в запросах кодируется как %20 по понятным причинам). Однако, когда я получить заголовок, используя headers("charttitle") значение я получаю Instrument: àÃéçøö

пакет javascript объявлен в индексе с кодировкой utf-8:

<script src="/js/bundle.js" type="text/javascript" charset="UTF-8"></script>

кроме того, html объявлен с правильной кодировкой, мне кажется в двух местах в объявлении head:

<meta http-equiv="Content-Type" content="text/html charset=UTF-8" />
<meta charset="utf-8" />

согласно этому вебсайту (http://www.i18nqa.com/debug/utf8-debug.html) похоже, что я получаю кодировку символов Windows1252. Это не никакого смысла. Я мог бы, если это абсолютно необходимо, написать ужасный Хак, преобразующий строку utf-8 в символы Windows1252, но это кажется мне немного экстремальным и довольно подверженным ошибкам.

эффект тот же, будь то в Chrome, Firefox или IE11. Полные заголовки запросов находятся здесь:

Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate, sdch, br
Accept-Language:en-GB,en-US;q=0.8,en;q=0.6
Connection:keep-alive
Host:blahblahblah
Origin:http://blahblahblah
Referer:http://blahblahblah/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36

есть ли что-нибудь, что я пропустил? Что-нибудь забытое?

редактировать

полные заголовки ответов как запрошенный.

Access-Control-Allow-Origin:*
Access-Control-Expose-Headers:chartTitle
Cache-Control:private
chartTitle:Instrument: %C3%A0%C3%9F%C3%A9%C3%A7%C3%B8%C3%B6
Content-Disposition:attachment; filename=PrintData.pdf
Content-Length:1391643
Content-Type:application/octet-stream
Date:Fri, 20 Jan 2017 11:19:07 GMT
Server:Microsoft-IIS/10.0
X-AspNet-Version:4.0.30319
X-Powered-By:ASP.NET
X-SourceFiles:=?UTF-8?B?QzpcR2l0XEVPU1xSZXZpZXdlci5XZWJcYXBpXFByaW50XGQyOTNkNjA4NWVlYzlhNTEwYjQ5YThmZGQxNjNhMjAwMWZhYTFjMGY5YzhiMzUxYzE5ZjYxYWMwYTY1OWVhMDM=?=

код headers

$http({
    method: 'GET',
    url: filePath,
    params: {
        fileName: fileName
    },
    responseType: 'arraybuffer',
    headers: {'Content-Type' : 'application/json; charset=UTF-8'}
}).success(function (data, status, headers) {
    ready();
    if (status == 200) {
        var chartTitle = headers("charttitle");
        var printoutInformation = {'chartTitle' : chartTitle, 'pdfData' : data};
        deferred.resolve(printoutInformation);
    }
    else {
        deferred.resolve(null);
    }
    }).error(function (data) {
        ready();
        console.log(data);
    });
    return deferred.promise;

редактировать

на web.config для api также указывает utf-8:

    <globalization requestEncoding="utf-8" responseEncoding="utf-8"/>

TL; DR

в текстовом поле я хочу отобразить "Instrument àßéçøö", а вместо этого я вижу "Instrument: à ÃéçÃö"

12
angularjs character-encoding javascript string utf-8

2 ответов

вот ваша проблема решена.

основываясь на этом источнике,

отладка символов UTF-8 и его кодирование и декодирование

ответ, который вы получаете, является фактическим charecter кодированной строки utf-8

Итак, вам нужно декодировать этот порядок, чтобы получить результат.

вот код, чтобы сделать это.

    decoded =  decodeURIComponent('%C3%A0%C3%9F%C3%A9%C3%A7%C3%B8%C3%B6')

    console.log(decoded);

   The result is => "àßéçøö"

мы должны сделать это, чтобы получить фактическое строку вместо UTF-8

Итак, из вашего ответа у тебя,à Ãéçøö

decodeURIComponent(escape("à Ãéçøö")) => "àßéçøö"

определение:

decodeURIComponent():

  • новая строка, представляющая декодированную версию заданного закодированного компонента Uniform Resource Identifier (URI).

Итак , вот ваш метод.

if (status == 200) {
    var original = headers("charttitle");
    var chartTitle = decodeURIComponent(escape(original));
    console.log(chartTitle);
    var printoutInformation = {'chartTitle' : chartTitle, 'pdfData' : data};
    deferred.resolve(printoutInformation);
}

теперь вы получите заголовки так же, как вы отправляете.

10

попробуйте ниже для кодирования

myAngApp1=document.getElementById("ItemSearch"); var uri = myAngApp1.value; var place = encodeURIComponent(uri)

1