简体   繁体   English

如何将SensorThings查询结果存储到JavaScript / jQuery中的变量中

[英]How to store SensorThings query result into a variable in JavaScript/jQuery

I am trying to read a thing entity from a SensorThings server ( https://scratchpad.sensorup.com/OGCSensorThings/v1.0/ ) by using GET method via JavaScript/jQuery and store the result into a variable named thing so that I can use the variable in another part of the script. 我想读从SensorThings服务器(事实体https://scratchpad.sensorup.com/OGCSensorThings/v1.0/由通过JavaScript / jQuery的使用GET方法),结果存储到一个名为件事变量,以便我可以在脚本的另一部分中使用变量。

Here is my code: 这是我的代码:

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Read Thing</title>
    <link rel="stylesheet" href="main.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
    <h1>Read Thing</h1>
    <h2 id="thing_name"></h2>
    <script>
        var thing = $.ajax({
            url: "https://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)",
            type: "GET",
            contentType: "application/json; charset=utf-8",
            success: function(data){
                console.log(data);
                return data;
            },
            error: function(response, status){
                console.log(response);
                console.log(status);
            }
        });
    </script>
</body>
</html>

And after I run it in the browser, I got the result like this: 在浏览器中运行它之后,得到的结果如下:

{@iot.id: 1785996, @iot.selfLink: "http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)", description: "Thing Description 15", name: "Thing Name 16", properties: {…}, …}
@iot.id
:
1785996
@iot.selfLink
:
"http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)"
Datastreams@iot.navigationLink
:
"http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)/Datastreams"
HistoricalLocations@iot.navigationLink
:
"http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)/HistoricalLocations"
Locations@iot.navigationLink
:
"http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)/Locations"
description
:
"Thing Description 15"
name
:
"Thing Name 16"
properties
:
{Thing Property Name 16: "Thing Property Description 16", Thing Property Name 15: "Thing Property Description 15"}
__proto__
:
Object

Based on that result, I tried to do some query: 基于该结果,我尝试进行一些查询:

>>> thing
{readyState: 4, getResponseHeader: ƒ, getAllResponseHeaders: ƒ, setRequestHeader: ƒ, overrideMimeType: ƒ, …}abort: ƒ (a)always: ƒ ()complete: ƒ ()done: ƒ ()error: ƒ ()fail: ƒ ()getAllResponseHeaders: ƒ ()getResponseHeader: ƒ (a)overrideMimeType: ƒ (a)pipe: ƒ ()progress: ƒ ()promise: ƒ (a)readyState: 4responseJSON: {@iot.id: 1785996, @iot.selfLink: "http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)", description: "Thing Description 15", name: "Thing Name 16", properties: {…}, …}responseText: "{"@iot.id":1785996,"@iot.selfLink":"http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)","description":"Thing Description 15","name":"Thing Name 16","properties":{"Thing Property Name 16":"Thing Property Description 16","Thing Property Name 15":"Thing Property Description 15"},"Datastreams@iot.navigationLink":"http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)/Datastreams","HistoricalLocations@iot.navigationLink":"http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)/HistoricalLocations","Locations@iot.navigationLink":"http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)/Locations"}"setRequestHeader: ƒ (a,b)state: ƒ ()status: 200statusCode: ƒ (a)statusText: "OK"success: ƒ ()then: ƒ ()__proto__: Object
>>> thing.responseJSON
{@iot.id: 1785996, @iot.selfLink: "http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)", description: "Thing Description 15", name: "Thing Name 16", properties: {…}, …}
>>> thing.responseJSON["name"]
"Thing Name 16"
>>> var thing_name = thing.responseJSON["name"]
undefined
>>> thing_name
"Thing Name 16"

It seemed that the code run successfully. 看来代码成功运行了。 However, when I insert the query into the script and tried to display the output in the console (I only display the script tag here, other lines are the same as the code above), such as: 但是,当我将查询插入脚本并尝试在控制台中显示输出时(我仅在此处显示script标记,其他行与上面的代码相同),例如:

<script>        
        var thing = $.ajax({
            url: "https://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)",
            type: "GET",
            contentType: "application/json; charset=utf-8",
            success: function(data){
                console.log(data);
                return data;
            },
            error: function(response, status){
                console.log(response);
                console.log(status);
            }
        });
        var thing_name = thing.responseJSON["name"];
        console.log("Thing Name: " + thing_name);
        // I want to insert the variable into a h2 tag in the page
        document.querySelector("#thing_name").innerHTML = thing_name;
    </script>

I got an error like this: 我收到这样的错误:

Uncaught TypeError: Cannot read property 'responseJSON' of undefined
    at read_thing.htm:36
(anonymous) @ read_thing.htm:36
read_thing.htm:27 {@iot.id: 1785996, @iot.selfLink: "http://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)", description: "Thing Description 15", name: "Thing Name 16", properties: {…}, …}

It seemed that the script did not store the result into the variable thing successfully. 脚本似乎没有将结果成功存储到变量事物中 When I tried to display the content of the variable in the console, the output was undefined . 当我尝试在控制台中显示变量的内容时,输出未定义

So, how should I modify my script to get the result into a variable? 因此,如何修改脚本以将结果转换为变量? Thanks in advance. 提前致谢。

Cheers, 干杯,

Move that code near the end of your scripts into the success method of the ajax call, like this: 将脚本末尾附近的代码移动到ajax调用的success方法中,如下所示:

<script>
    var thing = $.ajax({
        url: "https://scratchpad.sensorup.com/OGCSensorThings/v1.0/Things(1785996)",
        type: "GET",
        contentType: "application/json; charset=utf-8",
        success: function(data){
            console.log(data);
            var thing_name = thing.responseJSON["name"];
            console.log("Thing Name: " + thing_name);
            // I want to insert the variable into a h2 tag in the page
            document.querySelector("#thing_name").innerHTML = thing_name;
            return data;
        },
        error: function(response, status){
            console.log(response);
            console.log(status);
        }
    });
</script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM