HTML5和神秘的charset

时间:2014-06-16 01:30:15

标签: php jquery html

这是我在SO的第一篇文章,所以要温柔。

我目前正在开发一个利用新HTML5 target.result的网络应用程序。这使我可以阅读文本文件的内容,而无需将任何内容上传到服务器。

我遇到的问题是关于charset。因此,通常通过页面本身生成Web内容作为博客文章,评论或符合该页面的charset和数据库配置的任何内容。但是,这个新的HTML5功能允许我们在不知道相关文档的原始字符集或格式的情况下获取文本文件内容。

在ajax发布之前对数据进行编码是有意义的,所以我尝试了许多不同的方法将文本转换为utf-8,也通过各种dataTypes。我已经完成了整个chartset之路,htaccess,meta,content-type。

毫不奇怪,很多人发现编码的整个过程,使用不同的字符集,ASCII,不同的语言和ajax数据类型解码URI这样的痛苦。

我认为社区可以从一个解决方案中受益,该解决方案可以从任何类型的文本文档中获取文本,无论字符串或格式如何,以任何语言显示,并通过原始形式的ajax请求响应显示,并附加了utf- 8。没有人可以阅读的怪异符号,最终结束那些钻石问号。

这是我现在所处位置的一个例子。

复制此新闻文章:News Article

...并将其粘贴到此处:swiss converter tool

无论我使用什么配置,我都无法在底部输出中正确显示撇号,似曾经有过任何人?

谷歌如何用谷歌翻译解决这个问题?

编辑: 同样值得注意的是,ABC新闻和瑞士工具转换器的字符集都是utf-8。你可以清楚地看到,从utf-8转换为utf-8也会产生奇怪的符号,即使它们是完全相同的字符集。

EDIST:2 好的,所以我设法加快了原型并将其上传到远程服务器。您可以在babblingo

访问它

这是通过ajax发布文本的javascript:

function handleFileSelect(evt) {

evt.stopPropagation();
evt.preventDefault();

var files = evt.dataTransfer.files;

for (var i = 0, f; f = files[i]; i++) {
    var reader = new FileReader();
    reader.onload = (function(theFile) {
        return function(e) {
            var insertText = e.target.result;
            var fields = 'text=' + insertText;
            $.ajax({
                type: "POST",
                url: "ajax.php?action=addfile",
                data: fields,
                dataType: "json",
                complete: function (data) {
                    if (data.responseJSON.message) {
                        $( "#modal-message h4" ).replaceWith( "<h4 class='modal-title text-center'>"+data.responseJSON.message+"</h4>" );
                    }
                    if (data.responseJSON.report) {
                        $( "#report_box" ).replaceWith( '<div id="report_box">'+data.responseJSON.report+'</div>' );
                    }
                    if (data.responseJSON.import) {
                        $('#output_box').replaceWith('<div id="output_box" class="hidden-print">'+data.responseJSON.import+'</div>');
                    }
                    $('#modal-message').modal('show');
                    setTimeout(function() {$('#modal-message').modal('hide');}, 3000);
                }
            });


        };
    })(f);

    reader.readAsText(f);
}
}

1 个答案:

答案 0 :(得分:1)

由于没有人回答过这个问题,我将根据我对已经无法理解utf-8但仍会生成html的遗留应用程序的即时翻译所做的类似工作进行回答。

它只涉及创建一个映射表,从有问题的字符代码到它的html实体等价物。 ñ=&gt; &安培; ntilde;例如。这是一些示例代码。

function createEntities(source) {
    var map = [
       { key:"á", value: "<b>&aacute;</b>"},
       { key:"ñ", value: "<b>&ntilde;</b>"},
        { key:"ó", value: "<b>&oacute;</b>" },
       { key:"'", value: "<b>&apos;</b>" }
    ];
    var target = source;
    for ( prop in map ) {
       var pair = map[prop];
       target = target.replace(pair.key,pair.value)
    }
    return target;
}

这是一个jsFiddle来证明这一点。当然,您需要设置适当的映射。