Google maps autocomplete with JSF error with ÄÖÜ - jsf

Question

we're using google maps autocomplete in our JSF application, but when we choose a name with öäü the backingBean gets eg. Ã as value. We have set our meta info of the site to utf-8, but this didn't help in this case.
we added it like this:
<script type="text/javascript"
src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places&key=AIzaSyChQPYNPhodC79W6-oGzlVgQJEwfFMG_bs" />
<script type="text/javascript" charset="utf-8">
function addGMapAutoComplete(componentId) {
var component = document.getElementById('createRequest:' + componentId);
if (component) {
new google.maps.places.Autocomplete(component);
}
}
</script>
and used as
<p:inputText id="pickupLocation"
value="#{createRequest.pickupLocation}" required="true"
onfocus="addGMapAutoComplete('location')"
style="width:350px" />
can anyone help with this issue?

Answer 1

This is a known issue with PrimeFaces. It's incorrectly using server's default encoding (which is often ISO-8859-1) for decoding POST request data of ajax requests, even though JSF/Facelets by itself already by default uses UTF-8 through all layers.
To overcome this, you need to manually set the POST request body encoding to UTF-8 by calling ServletRequest#setCharacterEncoding() with a value of "UTF-8" as early as possible in the request processing (before the parameters are ever parsed out of the POST request body). Most straightforward way would be using a servlet filter for this:
#WebFilter("/*")
public class CharacterEncodingFilter implements Filter {
#Override
public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
chain.doFilter(request, response);
}
// ...
}
Or, if you happen to use JSF utility library OmniFaces already, then just use its ready-to-use CharacterEncodingFilter by adding the following entries to your webapp's web.xml:
<filter>
<filter-name>characterEncodingFilter</filter-name>
<filter-class>org.omnifaces.filter.CharacterEncodingFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>characterEncodingFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>