Client Side Localization

Question

I would like to do localization on the client side (e.g. embedding javascript files and resources). Everything worked fine until we had a js file and a resource file in the same project ("XXX.Web").

As part of the requirement, I had to move all resource files to the "XXX.LocalizedResources" project, while I still needed to do client-side localization for the js file.

I tried the following in AssemblyInfo.vb web project:

Before:

Assembly: System.Web.UI.WebResource ("XXX.Web.GlobalStrings.js", "Text / JavaScript")

Assembly: System.Web.UI.ScriptResource ("XXX.Web.GlobalStrings.js", "XXX.Web.Resources", "Resources")

After:

Assembly: System.Web.UI.WebResource ("XXX.Web.GlobalStrings.js", "Text / JavaScript")

Assembly: System.Web.UI.ScriptResource ("XXX.Web.GlobalStrings.js", "XXX.LocalizedResources.Resources", "Resources")

(Please ignore the syntax errors in the lines above) And now I get the following message:

Could not find resources suitable for the specified culture or neutral culture. Make sure that "XXX.LocalizedResources.Resources" was correctly built-in or connected to the assembly "XXX.Web" at compile time, or that all necessary satellite assemblies are downloadable and fully signed.

From a little research, I came across the fact that in "Assembly: System.Web.UI.ScriptResource (...)" you can only use projects on the Internet or web.extension.

I tried adding "Assembly: InternalsVisibleTo (" XXX.Web ") to AssemblyInfo from" XXX.LocalizedResources ", but this does not help open the resource file for" XXX.Web ". In addition, the resource files are already public, and the embed parameter is also set.

Any idea how I could embed an external resource file in javascript for localization on the client side?

Answer 1

Include this on your page:

<script> //declare string variable defaults here function UrlExists(url){ var http = new XMLHttpRequest(); try{http.open('HEAD', url, false); http.send(); return http.status!=404; }catch(e){return false;} } var lang=navigator.userLanguage || navigator.language.toLowerCase(); var langsrc = document.createElement("script"); langsrc.type = "text/javascript"; if(UrlExists(lang+".js")){ langsrc.src=lang+".js"; }else{ langsrc.src="en-us.js"; } document.body.appendChild(langsrc); //rest of code here: </script> 

then for each supported language, configure a file such as en-us.js

 //en-us.js localization for.... //set language specific variables here //define language specific functions 

This file is located in the same directory as your page, and can be shared by all pages in this directory (with changes it could make several directories or sites or just one file, but keeping it simple so that you can like it)

I would recommend using a JSON object for your variables, if possible, although you can share one server-side localization file (e.g. php). You may need to include a second file for any localized javascript functions, if you need any.