伪造squaremap的玩家显示

发布时间： 2025-08-13 14:03:57

更新时间： 2025-08-13 14:49:32

👀 阅读量：Loading...

fakeplayer位置显示

前言

squaremap是我的世界知名的网页地图之一，它可以做到玩家位置的显示，服务端可以设置玩家是否显示，但是如果玩家不再显示到地图上，玩家自己又如何才能找到自己的位置呢？那么显然，我们需要修改前端才能实现

squaremap玩家显示原理

通过分析squaremap的前端代码，我们可以了解到它通过定期从服务器获取玩家数据来显示玩家位置。主要的数据源是players.json文件，其中包含了所有在线玩家的信息。

从https://map.***.cn/tiles/players.json可以看到如下格式的数据：

1
{
2
  "max": 200,
3
  "players": [
4
    {
5
      "world": "minecraft_overworld",
6
      "armor": 0,
7
      "name": "Comecat",
8
      "x": 267652,
9
      "y": 72,
10
      "health": 40,
11
      "z": -67070,
12
      "display_name": "Comecat",
13
      "uuid": "83691f9849133901819b0bc29ab5883e",
14
      "yaw": -91
15
    }
16
    // ... 更多玩家数据
17
  ]
18
}

前端实现机制

squaremap通过一个主类SquaremapMap来管理整个地图系统，其中包含了一个PlayerList组件来处理玩家相关的功能。

主要组件结构

在squaremap.js中，主要初始化代码如下：

1
class SquaremapMap {
2
    constructor() {
3
        this.map = L.map("map", {
4
            crs: L.CRS.Simple,
5
            center: [0, 0],
6
            attributionControl: false,
7
            preferCanvas: true,
8
            noWrap: true
9
        });
10
        // ... 其他初始化代码
11
    }
12
}

玩家列表功能由PlayerList类管理：

1
class PlayerList {
2
    constructor(json) {
3
        this.players = new Map();
4
        this.markers = new Map();
5
        this.following = null;
6
        this.firstTick = true;
7
    }
8

9
    tick() {
10
        if (P.tick_count % P.worldList.curWorld.player_tracker.update_interval == 0) {
11
            P.getJSON("tiles/players.json", (json) => {
12
                this.updatePlayerList(json.players);
13
                // ... 更新玩家列表标题
14
            });
15
        }
16
    }
17
}

玩家数据处理

每个玩家由Player类表示，包含以下主要功能：

1
class Player {
2
    constructor(json) {
3
        this.name = json.name;
4
        this.uuid = json.uuid;
5
        this.world = json.world;
6
        this.displayName = json.display_name !== undefined ? json.display_name : json.name;
7
        this.x = 0;
8
        this.z = 0;
9
        this.armor = 0;
10
        this.health = 20;
11

12
        // 创建地图标记
13
        this.marker = L.marker(P.toLatLng(json.x, json.z), {
14
            icon: L.icon({
15
                iconUrl: 'images/icon/player.png',
16
                iconSize: [17, 16],
17
                iconAnchor: [8, 9],
18
                tooltipAnchor: [0, 0]
19
            }),
20
            rotationAngle: (180 + json.yaw)
21
        });
22
    }
23
}

实现自定义玩家位置显示

如果我们想要在玩家被服务器设置为不可见时仍能显示自己的位置，可以通过以下方式实现：

方法一：修改前端请求逻辑

我们可以通过拦截或修改前端请求，添加当前玩家的信息：

1
// 在获取玩家数据后，手动添加当前玩家信息
2
function addCurrentPlayer(jsonData, currentPlayerData) {
3
    // 检查当前玩家是否已经在列表中
4
    const playerExists = jsonData.players.some(player => player.uuid === currentPlayerData.uuid);
5

6
    // 如果不存在，则添加当前玩家
7
    if (!playerExists) {
8
        jsonData.players.push(currentPlayerData);
9
    }
10

11
    return jsonData;
12
}

方法二：本地存储玩家位置

另一种方法是在本地存储玩家的位置信息，并在请求时合并：

1
// 保存玩家位置到本地存储
2
function savePlayerLocation(playerData) {
3
    localStorage.setItem('myPosition', JSON.stringify({
4
        x: playerData.x,
5
        y: playerData.y,
6
        z: playerData.z,
7
        world: playerData.world,
8
        lastUpdate: Date.now()
9
    }));
10
}
11

12
// 从本地存储获取玩家位置并添加到玩家列表
13
function addLocalPlayerPosition(playersJson) {
14
    const localPosition = localStorage.getItem('myPosition');
15
    if (localPosition) {
16
        const position = JSON.parse(localPosition);
17
        // 检查数据是否过期（例如超过5分钟）
18
        if (Date.now() - position.lastUpdate < 5 * 60 * 1000) {
19
            // 创建一个虚拟玩家对象
20
            const virtualPlayer = {
21
                world: position.world,
22
                armor: 0,
23
                name: "You",
24
                x: position.x,
25
                y: position.y,
26
                health: 20,
27
                z: position.z,
28
                display_name: "You (Local)",
29
                uuid: "local-player",
30
                yaw: 0
31
            };
32

33
            // 添加到玩家列表
34
            playersJson.players.push(virtualPlayer);
35
        }
36
    }
37
    return playersJson;
38
}

WebmapView模组介绍

WebmapView 是我开发的一个Fabric模组，允许玩家通过游戏内浏览器界面查看网页地图服务（如squaremap），支持自定义URL等功能。我依据此实现在后端创建api节点来实现java客户端向js前端传递玩家json数据。

关键代码结构

PlayerInformation类

PlayerInformation类负责收集和管理玩家信息：

1
public class PlayerInformation {
2
    private String playerName;
3
    private double x, y, z;
4
    private String world;
5
    private float yaw, pitch;
6

7
    // 获取玩家信息的方法
8
    public static PlayerInformation getCurrentPlayerInfo() {
9
        PlayerEntity player = MinecraftClient.getInstance().player;
10
        PlayerInformation info = new PlayerInformation();
11
        info.playerName = player.getName().getString();
12
        info.x = player.getX();
13
        info.y = player.getY();
14
        info.z = player.getZ();
15
        info.world = player.getWorld().getRegistryKey().getValue().toString();
16
        info.yaw = player.getYaw();
17
        info.pitch = player.getPitch();
18
        return info;
19
    }
20
}

API接口类

API类提供将玩家信息传递给网页的方法：

1
public class API {
2
    // 将玩家位置信息发送到网页
3
    public static void sendPlayerPosition(PlayerInformation info) {
4
        // 构造JavaScript代码
5
        String jsCode = String.format(
6
            "window.updatePlayerPosition && window.updatePlayerPosition(%f, %f, %f, '%s', %f, %f);",
7
            info.x, info.y, info.z, info.world, info.yaw, info.pitch
8
        );
9

10
        // 执行JavaScript代码
11
        BasicBrowser.executeJavaScript(jsCode);
12
    }
13
}

浏览器实现类

BasicBrowser类负责管理嵌入的浏览器实例：

1
public class BasicBrowser {
2
    private MCEFBrowser browser;
3

4
    public void loadMapUrl(String url) {
5
        if (browser != null) {
6
            browser.loadURL(url);
7
            // 注入自定义JavaScript代码以处理玩家位置更新
8
            injectPlayerPositionHandler();
9
        }
10
    }
11

12
    private void injectPlayerPositionHandler() {
13
        String jsCode = """
14
            // 创建更新玩家位置的函数
15
            window.updatePlayerPosition = function(x, y, z, world, yaw, pitch) {
16
                // 将玩家位置保存到本地存储
17
                localStorage.setItem('playerPosition', JSON.stringify({
18
                    x: x,
19
                    y: y,
20
                    z: z,
21
                    world: world,
22
                    yaw: yaw,
23
                    pitch: pitch,
24
                    timestamp: Date.now()
25
                }));
26

27
                // 如果页面上有squaremap实例，则更新地图中心点
28
                if (typeof P !== 'undefined' && P.map) {
29
                    var latlng = P.toLatLng(x, z);
30
                    P.map.setView(latlng, P.map.getZoom());
31
                }
32
            };
33

34
            // 定期检查本地存储中的玩家位置并更新地图
35
            setInterval(function() {
36
                var position = localStorage.getItem('playerPosition');
37
                if (position) {
38
                    var pos = JSON.parse(position);
39
                    // 仅在5秒内的位置数据有效
40
                    if (Date.now() - pos.timestamp < 5000) {
41
                        if (typeof P !== 'undefined' && P.map) {
42
                            var latlng = P.toLatLng(pos.x, pos.z);
43
                            // 添加特殊标记表示本地玩家
44
                            if (!window.localPlayerMarker) {
45
                                window.localPlayerMarker = L.marker(latlng, {
46
                                    icon: L.icon({
47
                                        iconUrl: 'images/icon/player_local.png',
48
                                        iconSize: [20, 19],
49
                                        iconAnchor: [10, 10]
50
                                    })
51
                                }).addTo(P.map);
52
                            } else {
53
                                window.localPlayerMarker.setLatLng(latlng);
54
                            }
55
                        }
56
                    }
57
                }
58
            }, 1000);
59
            """;
60

61
        executeJavaScript(jsCode);
62
    }
63

64
    public static void executeJavaScript(String jsCode) {
65
        // 执行JavaScript代码的具体实现
66
        // 这里会调用MCEF的相关API来执行JavaScript
67
    }
68
}

总结

当服务器隐藏玩家位置时的webmapview能够自我定位地图中的位置，方便了玩家的体验