I am having problems displaying UTF-8 string in Safari and Firefox for sending flash messages in rails via X-Message headers for ajax requests like this:
class ApplicationController < ActionController::Base
def flash_to_headers
return unless request.xhr?
message = flash_message
message = "#{message.join("','")}" if message.is_a?(Array)
response.headers['X-Message'] = message
response.headers["X-Message-Type"] = flash_type.to_s
flash.discard # don't want the flash to appear when you reload page
end
def flash_message
[:red, :warning, :notice, :success, nil].each do |type|
return "" if type.nil?
return flash[type] unless flash[type].blank?
end
end
def flash_type
[:red, :warning, :notice, :success, nil].each do |type|
return "" if type.nil?
return type unless flash[type].blank?
end
end
Javascript to handle the header:
var fade_flash = function() {
$(".flash_alert").fadeIn("fast");
$(".flash_alert").delay(10000).fadeOut("slow");
};
var show_ajax_message = function(msg, type) {
$(".flash_message").html('<div class="flash_alert hidden flash_'+type+'">'+msg+'</div>');
fade_flash();
};
$( document ).ajaxComplete(function(event, request) {
var msg = request.getResponseHeader('X-Message');
var type = request.getResponseHeader('X-Message-Type');
if (msg) {
show_ajax_message(msg, type);
}
});
This was working great until I added l18n locale with Chinese support. In Chrome it still works, but in Safari and Firefox, the flash message is no longer displayed properly.
For example:
a Message like this:"投注金额” 比你的余额多" will show up in Chrome fine, but in Safari and Firefox would show up like: "âæ注éé¢â æ¯ä½ çä½é¢å¤".
You can see a live demo of this bug at https://ice-dice.com
Just click roll under Chinese locale and you can see the flash message is incorrect unless using chrome. Even quotes are not showing up properly in the english locale.
Thanks in advance for your help!