Use Cotonic and MQTT for browser messaging

Use the existing Cotonic browser models and Zotonic MQTT bridge when components need to communicate through topics. First identify whether the topic stays inside the browser or crosses to the server.

Define a small payload and a clear reply contract. Subscribe before requesting data when the response can arrive immediately. Clean up component subscriptions when their lifetime ends, and handle reconnects without duplicating actions.

Server-side topic access must follow the site's permission rules. A topic name is not a secret or an access check.

With the greeting model from the model task active, try this read in the browser console:

cotonic.ready.then(() =>
    cotonic.broker.call("bridge/origin/model/garden/get/greeting", {})
).then(reply => console.log(reply.payload));

Inspect the reply's status and result; expect the greeting on success. An error or disconnected bridge is not an empty greeting. The bridge/origin/ prefix crosses to the site's server model, while a browser-local model such as model/location stays in the browser. Use cotonic#location for the latter's topic contract. Do not insert response text as HTML without escaping it.