我有一个主要用PHP编写的应用程序.翻译是使用gettext()完成的.
有一个小的JavaScript部分,它还包含要翻译的字符串.
我使用XMLHttpRequest编写了这个简单但有效的方法:
function gettext(string_to_translate) {
var filename = get_PHP_script_folder() + 'gettext.PHP?string_to_translate=' + string_to_translate;
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", filename, false);
xmlhttp.send();
if (xmlhttp.status === 200) {
var translated_string = xmlhttp.responseText;
return translated_string;
} else {
console.log("Error while translating " + string_to_translate + " Status " + xmlhttp.status);
return string_to_translate; //Just give the original string.
}
}
require_once '../../default.PHP'; //configures gettext, session management, etc.
//Todo: support for ngettext might be added.
$string_to_translate = filter_input(INPUT_GET, 'string_to_translate', FILTER_SANITIZE_STRING);
$translated_string = gettext($string_to_translate);
echo $translated_string;
在我刚刚调用的JavaScript中:
var input_Box_form_default_reason = gettext("Vacation");
document.getElementById('input_Box_form_reason').value = input_Box_form_default_reason;
如果我同步调用此函数[xmlhttp.open(“GET”,filename,false);] Firefox / Chrome警告我:
[Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
因此,虽然这种方法有效,但它可能随时停止使用.
但是如果我运行代码async [xmlhttp.open(“GET”,filename,true);],那么下一行将在结果出现之前执行.该值将是未定义的.
在这种情况下使异步XMLHttpRequest工作是否可行?我应该坚持同步获取值,直到写入一些聪明的API?
我应该用PHP编写我的JS文件吗? (我希望不是.)
PS:
>我不使用像jQuery这样的任何框架.这是一个“宗教”的事情.我希望自己完全理解并维护整个代码库.
>我读了以下问题,但没有回答我的问题:
> Translation in JavaScript like gettext in PHP?
> PHP Gettext in JavaScript, not working in extern JS file
> Extract javascript gettext in Poedit?
> How do I feed terms from a gettext dictionary into JavaScript?
> javascript i18n with gettext and .po files(断链)
解决方法:
是的,你需要一个回调!
function gettext(string_to_translate, obj, callback)
... //your original xmlhttprequest
xmlhttp.callback = callback;, add a callback to the xmlhttp
//set the readystate event that listens to changes in the ajax call
xmlhttp.onreadystatechange = function()
{
//target found and request complete
if (this.status === 200 && this.readyState == 4) {
//send result to the callback function
this.callback(obj, this.responseText);
} else {
console.log("Error while translating " + string_to_translate + " Status " + xmlhttp.status);
this.callback(obj, string_to_translate);
}
}
//callback function specific for this case.
function setValue(obj, value)
{
obj.value = value;
}
称之为:
gettext("Vacation", document.getElementById('input_Box_form_reason'), setValue);
具有回调的扩展ajax函数
function ajax(url, method, json, callBack)
{
//it supports get and post
//returns parsed JSON, when json is set to true. | json accessible via this.JSON in the callBack
//a callback can be attached where the this refers to the xmlHTTP
//supply an url like you would in a get request: http://www.example.com/page.PHP?query=1
//start the request with xmlDoc.fire.
var xmlDoc = new XMLHttpRequest
xmlDoc.JSON = json ? true : false;
xmlDoc.error = true;
xmlDoc.errorMessage = "";
xmlDoc.errorObj = {"error" : xmlDoc.error, "object" : "XMLHttpRequest", "message" : xmlDoc.errorMessage, "url" : url, "sync" : true, "method" : (method ? "POST" : "GET")};
xmlDoc.url = url
xmlDoc.method = method ? "post" : "get";
xmlDoc.preserveWhiteSpace = true;
if (method == "post")
{
xmlDoc.pUrl = url;
xmlDoc.pArg = "";
if (url.match(/\?/)) //we need to filter out the arguments since the are send seperately.
{
var splitted = url.split(/\?/);
xmlDoc.pUrl = splitted[0];
xmlDoc.pArg = "";
for (var i = 1; i < splitted.length; i++)
{
xmlDoc.pArg += splitted[i]; //prevent additional questionmarks from being splitted.
}
}
xmlDoc.open.apply(xmlDoc, ["post", xmlDoc.pUrl , true]); //set up the connection
xmlDoc.setRequestHeader("Content-type", "application/x-www-form-urlencoded ; charset=UTF-8");
}
else
{
//get request, no special action need, just pass the url
this.xmlDoc.open("get", url, true); //true for async
}
xmlDoc.onreadystatechange = readyStateXML.bind(xmlDoc, callBack);
xmlDoc.setRequestHeader("Pragma", "no-cache");
xmlDoc.setRequestHeader("Cache-Control", "no-cache, must-revalidate");
xmlDoc.fire = fireXmlRequest; //set up fire function.
return xmlDoc;
}
function fireXmlRequest()
{
if (this.method == "post")
{
this.send(this.pArg); //post
}
else
{
this.send(null); //get
}
}
function readyStateXML(callBack)
{
if (this.readyState == 4)
{
//request completed, Now check the returned data
//We always assume that a request fails.
if (this.errorMessage == "XML Not loaded." || this.errorMessage == "")
{
this.error = false; //set error to false, request succeeded.
this.errorObj.error = false;
if (!this.responseXML && !this.JSON)
{
this.error = true;
this.errorMessage = "invalid XML.";
this.errorObj.error = this.error;
this.errorObj.message = this.errorMessage;
}
if (this.error == false)
{
this.xmlData = this.responseXML;
if (this.JSON)
{
try
{
this.JSON = JSON.parse(this.responseText);
}
catch(err)
{
//JSON Couldn't be parsed
this.error = true;
this.errorMessage = err.message + "<br />" + this.responseText;
this.errorObj.error = this.error;
this.errorObj.message = this.errorMessage;
}
}
}
//404 or 400, not found error
if (this.status == "400" || this.status == "404" || this.status == 400 || this.status == 404)
{
this.error = true;
this.errorMessage = "404: The requested page isn't found.";
this.errorObj.error = this.error;
this.errorObj.message = this.errorMessage;
}
else if(this.status == "500")
{
this.error = true;
this.errorMessage = "500: Internal server error.";
this.errorObj.error = this.error;
this.errorObj.message = this.errorMessage;
}
if (typeof(callBack) != "undefined")
{
callBack.call(this); //pass the xmlDoc object to the callBack
}
}
else
{
alert("Error \n" + this.errorMessage);
if (typeof(callBack) != "undefined")
{
callBack.call(this);
}
}
}
else
{
this.error = true;
this.errorMessage = "XML Not loaded.";
this.errorObj.error = this.error;
this.errorObj.message = this.errorMessage;
}
}
//to use
ajx = ajax("index.PHP?query=1", "post", true, false, function(){/*callback*/});
console.log(ajx);
ajx.fire();
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。