How to encode/decode UTF-8 in HTTP headers in Rails?

Question

I am using the "insert Rails flash messages into HTTP headers to show Ajax response errors" pattern, like this:

Controller:

 def flash_as_header
   return unless request.xhr?
   [:error, :warning, :notice].each do |type|
    if flash[type]
     response.headers["X-Ajax-#{type.to_s.humanize}"] = flash[type]
    end
   end
 end

JQuery:

 $(document).ajaxComplete(function(response, status, xhr) {
    var types = ["Error", "Notice", "Warning"];
    for (i = 0, l = types.length; i < l; ++i) {
        msg = status.getResponseHeader("X-Ajax-" + types[i]);
        if(msg) {
            break;
        }
    }
    if(msg) {
        $('.flash-error').text(msg).removeClass('is-hidden');
    }
 });

This works, but I am running into character encoding issues. The flash messages contain UTF-8 special characters, and the destination HTML document is UTF-8.

Here is a sample string, as it should appear:

Användare

This is how it in the HTTP response (correct: %C3%A4 is ä):

X-Ajax-Error:Anv%C3%A4ndare

And this is how that outputs in the HTML document:

AnvÃ¤ndare

That is consistent with this table (http://www.i18nqa.com/debug/utf8-debug.html) which says that "the problem is being caused by UTF-8 bytes being interpreted as Windows-1252 (or ISO 8859-1) bytes."

I am unsure how & where to fix this- in the JQuery function, in the Rails Controller, or in the HTML template?

Ali H · Accepted Answer · 2015-05-15 11:26:45Z

5

A combination of escaping & decoding in the Javascript has worked:

I changed this:

 $('.flash-error').text(msg).removeClass('is-hidden');

to this:

$('.flash-error').text(decodeURIComponent(escape(msg))).removeClass('is-hidden');

The output is now correct.

answered May 15, 2015 at 11:26

Ali H

8992 gold badges10 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to encode/decode UTF-8 in HTTP headers in Rails?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related