Browser Restrictions
Web applications created by Node-App run in a browser and are limited by the browser's runtime environment. Due to security considerations, browsers restrict cross-origin requests initiated by scripts. If your application needs to call third-party interfaces (such as weather APIs), send HTTP commands, create WebSocket connections, or connect to MQTT Brokers, then this chapter is important; otherwise, you can skip it for now.
Cross-Origin Resource Sharing (CORS)
"Cross-origin" means that the requesting parties have different protocols, domains, or ports. For example, the URL of the application myapp created by Node-App is https://nodematrix.cc/myapp. Here, https is the protocol, nodematrix.cc is the domain, and 443 is the default port for https. When JavaScript in myapp needs to call an interface from a third-party website, such as the https://weatherapi.com weather query interface, this is a cross-origin request because they belong to different domains.
By default, browsers block cross-origin requests unless the service provider permits cross-origin access. This protocol that allows cross-origin access is called the Cross-Origin Resource Sharing (CORS) Protocol. The https://weatherapi.com weather query interface supports the CORS protocol, so myapp can access this interface normally.
Specifically, the service provider informs the browser that it allows cross-origin access by adding the identifier Access-Control-Allow-Origin: * in the response header. If myapp needs to access custom hardware with a network interface, such as an ESP32 module, then Access-Control-Allow-Origin: * should also be added in the HTTP response header returned by the firmware to allow cross-origin access.
JSONP
The CORS protocol became a W3C standard in 2014. Before that, there was no official standard for cross-origin access. JSONP (JSON with Padding) is an unofficial agreement that indirectly bypasses cross-origin access restrictions by leveraging the browser's ability to load scripts from other origins. JSONP requires an agreement between both parties and was the conventional solution for cross-origin requests before CORS.
The http GET block in the Network category of the Node-App toolbox supports JSONP cross-origin requests.
JSONP implementation: w3schools.com/JSONP
HTTP and HTTPS
In addition to default cross-origin restrictions, browsers have stricter rules for cross-protocol requests. Browsers will block scripts on a HTTPS page from accessing HTTP resources, even if Access-Control-Allow-Origin: * is added to the response header. This includes initiating HTTP requests or making WebSocket connections. For HTTP page scripts accessing HTTPS resources, browsers generally do not restrict it, but will output warning messages in the console.
For security reasons, it's recommended that both communicating parties use the HTTPS protocol. Node-App applications are published as HTTPS URLs by default.
Some hardware may only provide HTTP interfaces due to resource or firmware limitations. When an application is opened with the HTTPS protocol, it cannot access HTTP interfaces. You can open the application with the HTTP protocol (e.g., http://nodematrix.cc/myapp) to enable access to HTTP interfaces. This is generally an acceptable compromise when it occurs in a private local network.
Use case: Communicating with ESP32's HTTP service