Question

您好我正在尝试找到一种方法，可以将不属于我自己的网站上显示的变量拉到我自己的网站上，这样我就可以将它用作我的JavaScript变量。理想情况下，我希望能够显示此变量，并在网站系统中更新时对其进行更新。

我现在已经搜索了几天，似乎无法找到关于如何实现这一目标的明确解释。更具体地说，我的学校跟踪停车数据和可用的空间数量，我希望能够在我正在开发的HTML项目中使用这些数字。

如果有人能够向我解释如何使用任何必要的手段将这两个数字作为JavaScript变量访问，我将不胜感激。

Answer 1

将先前的评论作为答案以增加空间：

一种可能的方法是进行一些网页抓取。

您每抓取一段时间就可以获取您感兴趣的页面副本，然后您可以使用正则表达式扫描页面源以获取所需的值。然后，您可以在扫描后返回该值并将其放入变量中。

它不是最有效的路线（理想情况下，它们会提供API，但我认为这对他们的用例来说会有点过分）但它可以工作。

例如，快速Google搜索＆＃34;网页抓取器＆＃34;给出：

你可以使用其中一种（或类似的，我真的没有使用过那些特定的那些）或者你可以建立自己的，但概念是相同的：

获取网页源代码，丢弃您不需要的任何内容，或者只提取您想要的内容和内容。

Answer 2

除非您有办法与学校服务器通信并获取该数据，否则您可能会陷入困境。如果您查看学校网站的代码，您会看到通过调用cgi脚本并解析它来生成可用空间量。

如果您有权访问此cgi脚本，则可以使用该脚本获取您的值，并按照学校网站源代码中getStatus函数中的描述进行解析。

如果您无法访问cgi，可以尝试对此网站进行ajax调用，并检查包含这些数字的节点是否可供您从DOM中进行选择。

如果您无法访问网站的DOM和/或如果访问它太慢，请使用ajax加载网站，但不要使用text / html，请求text / plain，这样您只需要很长时间包含网站的字符串。然后你可以用正则表达式刮掉这个字符串以获得你的价值。

如果所有这些都失败了，请将网站加载到隐藏的iframe中，以确保运行插入停车场编号的脚本。然后正常继续，从此iframe中选择正确的节点。

这些都是针对客户端的选项。服务器端可能有更多选项（比如更容易与学校cgi交互），但一般原则仍然存在。要么使用自己的API（cgi脚本），要么自己使用网站来抓取，要么使用满载网站的文本表示来进行正则表达式。

Answer 3

在您的特定情况下，您可以使用它，但您不需要网页抓取。正如JasonK的评论中所提到的，您可以使用页面使用的相同API调用：

https://www.jmu.edu/cgi-bin/parking_get_sign_data.cgi?date=1441292695108

现在，由于同源策略，您无法在网站上使用该API，但您可以创建一个小型服务来获取数据。在node.js中它可能看起来像这样，但你可以在php中轻松实现相同的功能：

var request = require("request");
var http    = require('http');

var server  = http.createServer(onRequest);

server.listen(3000);


//----------------------------------------------------
function onRequest(req, res){

    var parkingUrl = 'https://www.jmu.edu/cgi-bin/parking_get_sign_data.cgi?date=' + (new Date()).getTime();

    request(parkingUrl, function (error, response, body) {

        var data   = error;
        var status = 404;

        if(!error){
            status = 200;
            data = {
                championStatus : getStatus(body, '2'), 
                warsawStatus   : getStatus(body, '10')
            };
        }

        res.writeHead(status, { 'Content-Type': 'application/json', "Access-Control-Allow-Origin":"*" });
        res.write(JSON.stringify(data));
        res.end();
    });
}


//----------------------------------------------------
function getStatus(ss, si){
    var status = ss;

    status = status.split("<SignId>"+si+"</SignId>"); 
    status = status[1];
    status = status.split("<Display>"); 
    status = status[1];
    status = status.split("</Display>"); 
    status = status[0];
    status = status.replace(' ','');
    if(isNaN(status)){
        // do nothing 
    } else {
        status = parseInt(status);
    }

    if( status == 'Errors'){status = '';}
    else if(status != 'FULL' && isNaN(status)){status = 'Unavailable';}
    else if(status != '' && status != 'FULL'  && status != 'OPEN'){
        if(status == '   1'){status = status + ' space available'; }
        else{status = status + ' spaces available'; }
    } 
    return status;
}

getStatus功能直接来自https://www.jmu.edu/parking/网站，我宁愿使用xml2js或类似的模块来解析响应和数据。

从您的网站，您现在可以获得如下状态：

function httpGetAsync(url, callback)
{
    var xmlHttp = new XMLHttpRequest();
    xmlHttp.onreadystatechange = function() { 
        if (xmlHttp.readyState == 4 && xmlHttp.status == 200){
            callback(xmlHttp.responseText);
        }  
    }
    xmlHttp.open("GET", url, true); // true for asynchronous
    xmlHttp.send(null);
}

httpGetAsync("http://localhost:3000/", function(res){
    var data = JSON.parse(res);
    console.log(data);
});

不要忘记将localhost:3000更改为您的服务器地址，调整Access-Control-Allow-Origin标题以限制谁可以使用您的服务并添加一些错误处理。

如何从网站中提取数据计数器以在另一个HTML项目中用作JS变量

3 个答案: