Explore how to implement DDE using JavaScript-Front-end Q&A-php.cn

JavaScript is a general scripting language mainly used to implement interactive functions in front-end web pages. However, we can also use it to implement a variety of operations, and even use it to implement DDE (Dynamic Data Exchange).

DDE is a method of Windows inter-application communication (IPC). It allows data to be shared between two or more programs. Specifically, it allows one Windows application to pass data to another, typically another running application.

In this article, we will explore how to implement DDE using JavaScript. Before you begin, make sure you have basic knowledge of working with JavaScript and Windows.

Understanding DDE

Before we begin, let’s briefly understand DDE. DDE is an IPC (Inter-Process Communication) technology in Windows. It allows applications to send and receive various messages and commands. As we mentioned earlier, it allows one application to send data to another application. This is called the "sender" application and the "receiver" application.

To understand the functions of DDE, you need to understand the following two concepts:

DDE Client: It is the application through which we send data.
DDE Server: It is the application that we use to receive data.

When the DDE client sends data to the DDE server, it first packages the data into a DDE transaction. This DDE transaction includes the following:

Application name
Topic name
Item name
Operation type (for example, open, close, Send, etc.)
Status (success or failure)

The DDE client sends the DDE transaction to the DDE server. When the DDE server receives a transaction, it parses the transaction, extracts the data (if needed) and sends a response to the DDE client.

Now, let’s see how to implement DDE using JavaScript.

Implementing the DDE client

Implementing the DDE client in JavaScript requires the use of ActiveXObject objects. This object is a type of "ActiveX control" developed by Microsoft that provides common Windows components that allow Web developers to perform many Windows operations.

Next, we will use the ActiveXObject object to create a DDE client.

The following is a simple example demonstrating how to create a DDE client using JavaScript:

function sendDDEMessage(appName, topicName, itemName, command) {
  var ddeClient = new ActiveXObject("DDE.DdeClient");
  ddeClient.Connect(appName, topicName);

  var ddeTransaction = ddeClient.BeginTransaction();
  var ddeData = ddeTransaction.AddItem(itemName);
  ddeTransaction.SetData(ddeData, command);
  ddeTransaction.SetFormats(ddeData, 1); // 1 = CF_TEXT
  ddeTransaction.CommitTransaction();
  
  ddeClient.Disconnect();
}

Copy after login

As shown above, the sendDDEMessage function accepts four parameters:

appName: Contains the application name of the DDE server.
topicName: Contains the name of the DDE server context.
itemName: Contains the name of the object to be accessed in the DDE server application.
command: The command or message to be sent to the DDE server.

This function first uses new ActiveXObject("DDE.DdeClient") to create a DDE client. Next, it uses the Connect() method to connect the client to the specified application and topic.

Next, it creates a DdeTransaction instance and adds the item to be accessed using the AddItem() method. Then, use the SetData() method to set the command or message to be sent into the DdeData instance. Finally, use the SetFormats() method to set the data format. 1 is used here, indicating the CF_TEXT format.

Finally, the function uses the CommitTransaction() method to commit the transaction and the Disconnect() method to disconnect the client from the DDE server.

Implementing the DDE server

Although the implementation of the DDE server is relatively complex, we can easily simulate it using JavaScript and ActiveXObject objects.

In this example, we will simulate a DDE server with the following functions:

It can receive commands from the client and save them in an array.
When it receives a command named "get_commands", it will use the returnCommandList() method to return a string containing all previously received commands.

The following is the JavaScript code of the DDE server:

function DDEServer(appName, topicName) {
  var self = this;
  self.appName = appName;
  self.topicName = topicName;
  self.commandList = [];

  self.connect = function() {
    self.ddeServer = new ActiveXObject("DDE.DdeServer");
    self.ddeServer.Register(appName, topicName);
  };

  self.disconnect = function() {
    self.ddeServer.Unregister();
  };

  self.handleTransaction = function(ddeTransaction) {
    var command = ddeTransaction.GetData(ddeTransaction.FirstItem);
    self.commandList.push(command);
  };

  self.returnCommandList = function() {
    return self.commandList.join('\r\n');
  };
}

Copy after login

As shown above, the DDEServer constructor accepts two parameters: appName and topicName, these parameters are used to connect to the DDE server application and topic.

connect() method uses new ActiveXObject("DDE.DdeServer") Create a DDE server and use the Register() method Register it under the specified application and theme. The

disconnect() method uses the Unregister() method to unregister the DDE server.

When the DDE server receives the transaction, the handleTransaction() method is called. It fetches the data from the transaction and adds it to the server-side command list.

Finally, when the server receives the command named "get_commands", the returnCommandList() method will use the join() method to join all the commands in the command list The command is concatenated into a string and returned.

测试示例

现在我们已经开始实现 DDE 客户端和服务端，让我们来看看一些示例。为了测试客户端和服务端，我们将创建一个简单的 HTML 页面，该页面包含两个文本框和两个按钮。第一个文本框将用于输入命令，第二个文本框将用于显示服务器端的响应。

在按钮上单击时，客户端将尝试连接到服务器端，并将命令发送到它。一旦服务器端接收到命令，它将保存它，并返回一个包含所有已接收到的命令的字符串。

以下是示例代码：

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>DDE Client Demo</title>
  </head>
  <body>
    <h1>DDE Client Demo</h1>
    <label for="command">Enter a command:</label>
    <input id="command" type="text">
    <button id="sendCommand">Send Command</button>
    <br>
    <label for="output">Output:</label>
    <textarea id="output"></textarea>
    <script>
      var ddeServer = new DDEServer("dde_demo", "demo_topic");
      ddeServer.connect();

      function sendCommand() {
        var command = document.getElementById("command").value;
        sendDDEMessage("dde_demo", "demo_topic", "command", command);
        var output = document.getElementById("output");
        output.value = sendDDEMessage("dde_demo", "demo_topic", "get_commands", "");
      }

      document.getElementById("sendCommand").addEventListener("click", sendCommand);
    </script>
  </body>
</html>

Copy after login

如上所示，我们使用了 var ddeServer = new DDEServer("dde_demo", "demo_topic") 创建了一个 DDE 服务端，并使用 ddeServer.connect() 连接到它。

我们还定义了 sendCommand() 函数，该函数将获取命令并使用 sendDDEMessage() 函数将其发送到 DDE 服务端。然后，它将获取 DDE 服务端的响应并将其设置为第二个文本框中的值。

最后，我们监听按钮上的单击事件，并在单击时调用 sendCommand() 函数。

结论

在本文中，我们了解了什么是 DDE 和如何使用 JavaScript 和 ActiveXObject 对象实现它。虽然这种方法不是最佳的，但它可以让我们学习如何在 JavaScript 中使用 ActiveXObject 对象和 Windows API，以及如何进行应用程序和操作系统级别的操作。

The above is the detailed content of Explore how to implement DDE using JavaScript. For more information, please follow other related articles on the PHP Chinese website!