我在AngularJS上建立的SPA中有一个文本输入框,供用户向打印输出中添加标题。输入框的声明如下:
<input class="chart-title" type="text" ng-model="chartTitle" ng-change="titleChanged()"/>
文本框中填充了服务器提供的默认标题。用户可以将标题更改为适合他们的名称。更改标题后,服务器将更新并在响应的标题中发送回新标题,然后替换框中的标题。这非常适合标准ASCII类型的字符。
但是,对于unicode字符(例如àßéçøö),它不起作用。文本已正确发送,在服务器上正确更新并正确返回到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: à Ãéçøö
$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
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:
web.config
<globalization requestEncoding="utf-8" responseEncoding="utf-8"/>
TL; DR
在文本框中,我想显示“ Instrumentàßéçøö”,而我看到的是“ Instrument:ÃÃéçøö¶”
这是您解决的问题。
根据这个来源,
UTF-8字符调试及其编码和解码
您得到的响应是已编码的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("à Ãéçøö")) => "àßéçøö"
定义:
因此,这是您的方法。
if (status == 200) { var original = headers("charttitle"); var chartTitle = decodeURIComponent(escape(original)); console.log(chartTitle); var printoutInformation = {'chartTitle' : chartTitle, 'pdfData' : data}; deferred.resolve(printoutInformation); }
现在,您将获得与发送时相同的标题。