topic Re: VuforiaStudio请求服务器数据 in Vuforia Studio

VuforiaStudio请求服务器数据

FY_10283333 — Thu, 20 Feb 2025 04:27:57 GMT

提供一段js代码，满足以下条件：1、请求服务器数据 2、在vuforia studio的Home.js里面使用3.请求的数据如何解析后绑定不同的文本显示在2D UI上

Re: VuforiaStudio请求服务器数据

vnamboodheri — Thu, 20 Feb 2025 04:44:45 GMT

Thank you for your question regarding the JavaScript code for Vuforia Studio. To better assist you, please add more context to your topic.
Possibly on the below points?

Could you specify the type of data you are requesting from the server and the API endpoint you are using?
Are there any specific requirements or constraints for using the code within the Home.js file in Vuforia Studio?

This information will help the community members understand your requirements more clearly and provide a more accurate and helpful response.

Regards,

Vivek N
Community Moderation Team.

Re: VuforiaStudio请求服务器数据

FY_10283333 — Thu, 20 Feb 2025 05:44:53 GMT

你好

1.请求到的数据类型是Json字符串

2.特定要求没有，就是注意一下请求的链接错误，超时等给出提示即可

Best Regards!

Re: VuforiaStudio请求服务器数据

RolandRaytchev — Thu, 20 Feb 2025 07:58:48 GMT

Hi @FY_10283333 ,

To your points:

Provide a piece of js code that meets the following conditions:

Your Question 1. request server data - what kind of server /Thingworx server . And what kind of data ?

Answer: Currently because there is CORS resticion you could contact only as server located on the same domain The code will differs depending on that , what kind of server object you need to access . PTC supports only server request where data is requested but access depend on that what is the server database /Things and properties what need to be requested and if there are specific requirements.

2. use inside Home.js in vuforia studio -

Answer any JS code could be used there so far It is supported on the mobile platforms

3. how the requested data is parsed and then bound to different text to be displayed on the 2D UI

- you do not need to parse /that what in terms of Javascript/ but to convert it to string (JSON.stringify() when it is a json object) or .toString() methoded if you have an object which supports that method and then you could display it on widget wich support the text property

example:

$scope.myText="any text there"; $scope.setWidgetProp("myLabel-1","text",$scope.myText);

Re: VuforiaStudio请求服务器数据

FY_10283333 — Thu, 20 Feb 2025 08:06:45 GMT

你好

就像MQTT服务器，在同一个局域网内，但不经过Thingworx，直接在Home.js里面去写脚本来连接服务器获取消息，怎么写

谢谢

Re: VuforiaStudio请求服务器数据

RolandRaytchev — Thu, 20 Feb 2025 09:15:28 GMT

That could work but only when the MQTT server is running on the same server where you installed the Experience Service. The best will be when you have some MQTT server which could be access via REST API so that you can use the standard rest API in Home.js and you do not need to use any additional libraries. I think the best approach is to install every thing in node.js server on the same location where you Experience Service is running . So you can install there also you MQTT clients etc and integrate in a WebServer which you can access then vom Studio where the standard REST api calls are supported. But all that is is not part of the supported functionality. I di not have examples for that - Possibly somebody else could provide a help

Here is samples for the node.js server npm - MQTT.js e.g. what I found when I searched

https://www.npmjs.com/package/mqtt#example

https://stackoverflow.com/questions/58852141/showing-mqtt-response-on-a-node-server-api

https://stackoverflow.com/questions/66506976/sending-mqtt-data-via-api

https://iot.stackexchange.com/questions/5828/how-to-make-a-mqtt-broker-and-a-rest-api-communicate

Also a test in chat AI tools^DeepSeek whiere simple I tested , did provide the following resuts (below):

Could you provide a code what access a MQTT brocker and will provide an node.js server where I could request the MQTT invormaton via REST api requests

Here's a Node.js example that connects to an MQTT broker and provides REST API endpoints to access MQTT information:

require('dotenv').config();
const express = require('express');
const mqtt = require('mqtt');
const cors = require('cors');

// Initialize Express app
const app = express();
const port = process.env.SERVER_PORT || 3000;

// MQTT Configuration
const mqttUrl = process.env.MQTT_URL || 'mqtt://broker.hivemq.com';
const mqttTopics = process.env.MQTT_TOPICS ? process.env.MQTT_TOPICS.split(',') : ['test/topic'];
const mqttOptions = {
  clientId: `mqtt_${Math.random().toString(16).substr(2, 8)}`,
  clean: true,
  connectTimeout: 4000,
  reconnectPeriod: 1000,
};

// Store received MQTT messages
const mqttDataStore = {};

// Connect to MQTT Broker
const mqttClient = mqtt.connect(mqttUrl, mqttOptions);

mqttClient.on('connect', () => {
  console.log('Connected to MQTT Broker');
  mqttClient.subscribe(mqttTopics, (err) => {
    if (!err) {
      console.log(`Subscribed to topics: ${mqttTopics.join(', ')}`);
    }
  });
});

mqttClient.on('message', (topic, message) => {
  console.log(`Received message on ${topic}: ${message.toString()}`);
  mqttDataStore[topic] = {
    message: message.toString(),
    timestamp: new Date().toISOString()
  };
});

mqttClient.on('error', (err) => {
  console.error('MQTT Error:', err);
});

// Express middleware
app.use(cors());
app.use(express.json());

// REST API Endpoints
app.get('/api/mqtt', (req, res) => {
  res.json({
    status: 'success',
    data: mqttDataStore
  });
});

app.get('/api/mqtt/:topic', (req, res) => {
  const topic = req.params.topic;
  if (mqttDataStore[topic]) {
    res.json({
      status: 'success',
      data: mqttDataStore[topic]
    });
  } else {
    res.status(404).json({
      status: 'error',
      message: 'Topic not found'
    });
  }
});

// Start server
app.listen(port, () => {
  console.log(`REST API server running on port ${port}`);
});

process.on('SIGINT', () => {
  mqttClient.end();
  process.exit();
});

To use this code:

Install required dependencies:

npm install express mqtt dotenv cors

Create a .env file with your configuration:

MQTT_URL=mqtt://your-broker-url
MQTT_TOPICS=topic1,topic2,topic3
SERVER_PORT=3000

Start the server:

node server.js

Key features:

Connects to MQTT broker and subscribes to specified topics
Stores last received message for each topic
Provides REST API endpoints:
- GET /api/mqtt - Get all stored MQTT messages
- GET /api/mqtt/:topic - Get message for specific topic
Handles MQTT connection errors and reconnections
Uses environment variables for configuration

Example usage with curl:

# Get all messages
curl http://localhost:3000/api/mqtt

# Get specific topic
curl http://localhost:3000/api/mqtt/your/topic

To test with MQTT publishing (using mosquitto_pub):

mosquitto_pub -h broker.hivemq.com -t "test/topic" -m "Hello World"

Potential improvements you could add:

Authentication for both MQTT and REST API
History storage (not just last message)
WebSocket support for real-time updates
QoS configuration for MQTT
Message validation
Rate limiting for API endpoints

Remember to:

Keep your MQTT broker secure
Handle sensitive data appropriately
Add proper error handling for production use
Implement proper CORS configuration for your needs
Add request validation for the API endpoints

Re: VuforiaStudio请求服务器数据

FY_10283333 — Thu, 20 Feb 2025 09:25:40 GMT

你好

Thank you very much!

Best regards!

Re: VuforiaStudio请求服务器数据

vnamboodheri — Thu, 27 Feb 2025 03:29:41 GMT

Hello @FY_10283333,

It looks like you have some responses from some community members. If any of these replies helped you solve your question please mark the appropriate reply as the Accepted Solution.
Of course, if you have more to share on your issue, please let the Community know so other community members can continue to help you.

Thanks,
Vivek N.
Community Moderation Team.