如何在客户端浏览器中读取服务器文件

How to read a server file in the client browser

本文关键字：读取 服务器 文件 浏览器 客户端      更新时间：2023-09-26

团队，我希望浏览器从服务器读取属性文件。所以我关注Jquery/AJaX，如下所示。

<script>
var properties = null;
$(document).ready(function(){
    $.ajax({url:"demo_test.txt",success:function(result){
    properties = result;
    //properties = $('#result').val()
    //jQuery.globalEval("var newVar = result;")
    document.write("inside " + properties);
}});
});
document.write("outside " + properties );
</script>

这里的"内部"是正确打印文件字符。但是"outside"正在为属性打印null。

  1. 为什么
  2. 我能够在页面上看到"外部"输出；只有当我评论"内部"行？为什么会这样
  3. 如何获取jquery结果以便对数据进行进一步处理
  4. 我可以在服务器中有一个属性文件(key=value(吗？jquery/ajax是否提供了类似于java.util.properties:：getValue("key"(的功能？如果以上不可能；我可以将属性文件保存为JSON或XML文件以及Ajax提供的任何实用程序来获取密钥的值吗

更新：

我已经做了一些研究，并更新了第四季度的答案
我不知道如何读取属性文件，但我给出了读取xml/json文件的解决方案。

更改同步Ajax调用后，如下面的

var properties = null;
   $.ajax({
   url : "demo_test.txt",
   async : false,
   success : function(result)
   {
       properties = result;
       document.write("inside " + properties);
    }
});

如果服务器端有一个XML文件，下面是解析的方法：

 <?xml version="1.0"?>
 <server>
    <name>velu</name>
 </server> 
if (window.DOMParser)
{
    parser=new DOMParser();
    xmlDoc=parser.parseFromString(property,"text/xml");
}
else // Internet Explorer
{
    xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
    xmlDoc.async=false;
    xmlDoc.loadXML(property); 
} 
alert(xmlDoc.getElementsByTagName("name")[0].childNodes[0].nodeValue);


如果你在服务器端有json内容，那么

{
"name":velu
}
var obj = JSON.parse(property);
alert(obj.name);



用于访问文件的Javascript样式(异步(

var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{// listener
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    property = xmlhttp.responseText;
    }
}
xmlhttp.open("GET","demo_test.txt",true);
xmlhttp.send();
while (property != null) {
    alert(property); 
    break;
}

您使用的是以异步方式运行的两位Javascript功能：onready和AJAX。这意味着您对它们进行了设置，设置后的其余代码将继续运行，直到满足触发事件的必要条件。单个请求可能需要相当长的时间才能完成，在发出返回之前，可以运行数千行或更多的代码。

下面是你的脚本中发生的事情：

第一条线路被调用并完成，

var properties = null;

接下来，您告诉您的文档在准备好并完全加载时执行一些代码：

$(document).ready(function(){...});

您的文档还没有准备好(我们仍处于立即运行代码的领域(，因此执行下一行，

document.write("outside " + properties );

properties仍然为null(尚未调用.ready()函数内部的代码(。

过一段时间，文档就准备好了，提供的函数被调用，

function(){
    $.ajax({url:"demo_test.txt",success:function(result){
    properties = result;
    document.write("inside " + properties);
}});

在这个函数中，您设置了一个AJAX请求，该请求在完成时运行一个函数

$.ajax({url:"demo_test.txt",success:function(result){...}});

此请求也是异步的，因此在处理此请求并从服务器返回时，您的代码的其余部分将输出。不过，在这之后，程序中就没有其他函数行了，所以过了一段时间，该函数就变成了下一个调用的函数。

    properties = result;
    document.write("inside " + properties);

(为了可读性，我删除了注释(

CCD_ 3被设置为CCD_。这也解释了为什么你可能会看到"外部"写首先显示，而"内部"写第二显示，尽管它看起来应该是"内部"第一。

处理这种情况的最好方法是在返回的AJAX请求中继续所有代码，或者让请求调用另一个函数来继续代码。这样你就会知道请求已经处理，可以安全地继续：

var properties = null;
$.ajax({
    url : "demo_test.txt",
    success : function(result)
    {
        properties = result;
        document.write("inside " + properties);
        runTheRestOfMyCode();
    }
});
function runTheRestOfMyCode()
{
    document.write("outside " + properties );
}

或者，您可以将AJAX请求中jQuery的async设置设置为false。这将阻止您的代码前进到下一行，直到发出并返回请求为止，但它将在等待期间暂停所有内容。

var properties = null;
$.ajax({
    url : "demo_test.txt",
    async : false,
    success : function(result)
    {
        properties = result;
        document.write("inside " + properties);
        runTheRestOfMyCode();
    }
});
document.write("outside " + properties );
相关文章：