当前位置：首页 > news >正文

69、JS中如何调用上位机接口

news 2025/6/14 8:49:46

在JavaScript中调用上位机(主机)接口通常有以下几种方式，具体取决于你的应用场景和安全要求：

1. Web应用中的接口调用

使用Fetch API

fetch('https://api.example.com/endpoint', {method: 'POST', // 或 'GET', 'PUT', 'DELETE' 等headers: {'Content-Type': 'application/json','Authorization': 'Bearer your_token_here'},body: JSON.stringify({ key: 'value' })
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error:', error));

使用Axios (推荐)

axios.post('https://api.example.com/endpoint', {key: 'value'}, {headers: {'Authorization': 'Bearer your_token_here'}}).then(response => {console.log(response.data);}).catch(error => {console.error('Error:', error);});

2. 浏览器扩展/桌面应用中的特殊调用

使用Chrome扩展的native messaging

// 在background.js中
const port = chrome.runtime.connectNative('com.your_company.your_application');
port.onMessage.addListener((response) => {console.log("Received: " + response);
});
port.postMessage("Hello from the extension");

使用Electron应用

const { ipcRenderer } = require('electron');// 发送消息到主进程
ipcRenderer.send('api-call', { data: 'some data' });// 接收主进程响应
ipcRenderer.on('api-response', (event, arg) => {console.log(arg);
});

3. 本地HTTP服务器接口

如果你的上位机运行了本地HTTP服务：

// 调用本地服务
fetch('http://localhost:3000/api', {method: 'POST',headers: {'Content-Type': 'application/json'},body: JSON.stringify({ query: 'data' })
})
.then(response => response.json())
.then(data => console.log(data));

4. WebSocket实时通信

const socket = new WebSocket('ws://localhost:8080');socket.onopen = function(e) {console.log("Connection established");socket.send(JSON.stringify({ command: 'getData' }));
};socket.onmessage = function(event) {console.log(`Data received: ${event.data}`);
};socket.onclose = function(event) {if (event.wasClean) {console.log(`Connection closed cleanly, code=${event.code} reason=${event.reason}`);} else {console.log('Connection died');}
};socket.onerror = function(error) {console.log(`Error: ${error.message}`);
};