JS调用API接口失败

qqrate · 发表于 2025-2-13 20:14

本帖最后由 qqrate 于 2025-2-13 20:34 编辑

如题，在VIA主页自定义调用了一个农历显示，但就是显示不出来，难道这个也和webview版本有关?

[JavaScript] 纯文本查看 复制代码

01

02

03

04

05

06

07

08

09

10

11

12

13

14

15

16

17

<!--农历-->
<div id='lunar0'>
<script>
var url = "https://api.ahfi.cn/api/nlrq"
var request = new XMLHttpRequest();
request.open("get", url);
request.send();
request.onload = function () {
var data = JSON.parse(request.responseText);
var lunar1=data["lunar"]
var lunar2=data["Thisyear"]
var lunar3=(lunar1.substring(2,4)+"("+lunar2.substring(0,1)+ ")"+lunar1.substring(4));
var lunar4=data["seasonal"]
document.getElementById('lunar0').innerHTML=lunar4+"<br>"+lunar3;
}
</script>
</div>

mr88fang · 发表于 2025-2-13 20:24

<!--农历-->
<div id='lunar0'>
<script>
var url = "https://api.ahfi.cn/api/nlrq"
var request = new XMLHttpRequest();
request.open("get", url);
request.send();
request.onload = function () {
var data = JSON.parse(request.responseText).data;
var lunar1=data["lunar"]
var lunar2=data["Thisyear"]
//document.write(lunar1.substring(2,4)+"("+lunar2.substring(0,1)+ ")"+lunar1.substring(4));
var lunar3=(lunar1.substring(2,4)+"("+lunar2.substring(0,1)+ ")"+lunar1.substring(4));
var lunar4=data["seasonal"]
document.getElementById('lunar0').innerHTML=lunar3
document.getElementById('lunar0').innerHTML=lunar4;
}
</script>
</div>

qqrate · 发表于 2025-2-13 20:36

mr88fang 发表于 2025-2-13 20:24
[md]```html

不好意思，刚才发的是未修改前的，我也是用的document.getElementById('lunar0')，麻烦再帮忙看看哪里有问题

mr88fang · 发表于 2025-2-13 20:44

qqrate 发表于 2025-2-13 20:36
不好意思，刚才发的是未修改前的，我也是用的document.getElementById('lunar0')，麻烦再帮忙看看哪里有 ...

可以了啊！页面显示立春后

Su、 · 发表于 2025-2-13 20:45

[HTML] 纯文本查看 复制代码

01

02

03

04

05

06

07

08

09

10

11

12

13

14

15

16

17

18

<!--农历-->
<div id='lunar0'>
<script>
var url = "https://api.ahfi.cn/api/nlrq"
var request = new XMLHttpRequest();
request.open("get", url);
request.send();
request.onload = function () {
var data = JSON.parse(request.responseText);
var lunar1=data.data.lunar
console.log(data)
var lunar2=data.data.Thisyear
var lunar3=(lunar1.slice(2,4)+"("+lunar2.slice(0,1)+ ")"+lunar1.slice(4));
var lunar4=data.data.seasonal
document.getElementById('lunar0').innerHTML=lunar4+"<br>"+lunar3;
}
</script>
</div>

qqrate · 发表于 2025-2-13 21:00

Su、发表于 2025-2-13 20:45
[mw_shl_code=html,true]

，我再学习一下语法知识！

qqrate · 发表于 2025-2-13 21:02

mr88fang 发表于 2025-2-13 20:44
可以了啊！页面显示立春后

谢谢，可能真的是手机webview版本问题吧，我以前用这种语法也可行，就是近段时间现在不行了，向5楼学习

涛之雨 · 发表于 2025-2-13 21:49

JSON.parse(request.responseText)获取到的是

{
    "code": 200,
    "msg": "请求成功",
    "data": {
        "time": "今天是公元2025年02月13日",
        "lunar": "农历乙巳年正月十六",
        "Thisyear": "蛇年",
        "seasonal": "立春后"
    }
}

JSON.parse(request.responseText).data获取的才是

{
    "time": "今天是公元2025年02月13日",
    "lunar": "农历乙巳年正月十六",
    "Thisyear": "蛇年",
    "seasonal": "立春后"
}

qqrate · 发表于 2025-2-13 23:01

本帖最后由 qqrate 于 2025-2-13 23:03 编辑

涛之雨发表于 2025-2-13 21:49
[md]
`JSON.parse(request.responseText)`获取到的是
```json

是的，我仔细对比了2楼的代码，确实是这样的，要么就像5楼一样，用console.log(data) 把data提取出来，受教了

ofo · 发表于 2025-2-14 08:55

[HTML] 纯文本查看 复制代码

01

02

03

04

05

06

07

08

09

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>农历显示</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
            margin-top: 50px;
        }
        #lunar-info {
            font-size: 24px;
            color: #333;
        }
    </style>
</head>
<body>
    <h1>今日农历信息</h1>
    <div id="lunar-info">加载中...</div>
 
    <script>
        // 调用API获取农历数据
        fetch('https://api.ahfi.cn/api/nlrq')
            .then(response => response.json())
            .then(data => {
                if (data.code === 200) {
                    const lunarInfo = data.data.lunar; // 农历信息
                    const seasonal = data.data.seasonal; // 节气信息
                    const Thisyear = data.data.Thisyear; // 年份信息
 
                    // 拼接显示内容
                    const infoText = `今天是：${data.data.time}<br>农历：${lunarInfo} (${Thisyear})<br>节气：${seasonal}`;
                    document.getElementById('lunar-info').innerHTML = infoText;
                } else {
                    document.getElementById('lunar-info').innerText = '数据加载失败，请稍后再试！';
                }
            })
            .catch(error => {
                console.error('Error:', error);
                document.getElementById('lunar-info').innerText = '网络错误，请检查连接！';
            });
    </script>
</body>
</html>

这个是AI生成的，可以试下效果

帐号		自动登录	找回密码
密码			注册[Register]

[求助] JS调用API接口失败