<h1 id="우분투-mqtt-적용" style="box-sizing: inherit; font-size: 2.5rem; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">우분투 mqtt 적용</h1>
<h2 id="1-mosquitto-설치-및-환경설정" style="box-sizing: inherit; font-size: 2rem; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">1. mosquitto 설치 및 환경설정</h2>
<h3 id="1-1-mosquitto-설치" style="box-sizing: inherit; font-size: 1.5rem; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">1-1. mosquitto 설치</h3>
<ul style="box-sizing: inherit; color: #ececec; font-size: 18px; letter-spacing: -0.072px; background-color: #121212;">
   <li style="box-sizing: inherit;">
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">sudo apt-get update</code>
      <br style="box-sizing: inherit;" />: apt 업데이트</li>
   <li style="box-sizing: inherit;">
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">sudo apt-get install mosquitto mosquitto-clients</code>
      <br style="box-sizing: inherit;" />: mosquitto 및 mosquitto클라이언트 설치</li>
   </ul>
<h3 id="1-2-mosquitto-환경설정" style="box-sizing: inherit; font-size: 1.5rem; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">1-2. mosquitto 환경설정</h3>
<blockquote style="box-sizing: inherit; margin: 2rem 0px; border-left: 4px solid var(--primary2); border-top-right-radius: 4px; border-bottom-right-radius: 4px; background-image: ; background-position-x: ; background-position-y: ; background-size: ; background-repeat: ; background-attachment: ; background-origin: ; background-clip: ; padding: 1rem 1rem 1rem 2rem; color: #ececec; font-size: 18px; letter-spacing: -0.072px;">
   <ul style="box-sizing: inherit; padding-left: 1rem; margin-top: 0px; margin-bottom: 0px;">
      <li style="box-sizing: inherit; margin-top: 0px; margin-bottom: 0px;">
         <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background-image: ; background-position-x: ; background-position-y: ; background-size: ; background-repeat: ; background-attachment: ; background-origin: ; background-clip: ; padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px; margin-top: 0px;">sudo vim /etc/mosquitto/mosquitto.conf</code>
         &nbsp;또는&nbsp;
         <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background-image: ; background-position-x: ; background-position-y: ; background-size: ; background-repeat: ; background-attachment: ; background-origin: ; background-clip: ; padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">sudo vim /etc/mosquitto/conf.d/[임의의설정파일명].conf</code>
         <br style="box-sizing: inherit;" />: 임의의 설정파일을 만들어서 기본적인 설정을 할수 있다.<br style="box-sizing: inherit; margin-bottom: 0px;" />: mosquitto가 실행될때 먼저 읽는다.</li>
      </ul>
   </blockquote>
<h4 id="1-mosquitto-사용자-설정" style="box-sizing: inherit; font-size: 18px; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">1) mosquitto 사용자 설정</h4>
<ul style="box-sizing: inherit; color: #ececec; font-size: 18px; letter-spacing: -0.072px; background-color: #121212;">
   <li style="box-sizing: inherit;">
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">sudo mosquitto_passwd -c /etc/mosquitto/passwd [username]</code>
      <br style="box-sizing: inherit;" />: mosquitto 사용자 추가 -&gt; 명령어 실행 이후 password 두번 입력해야함</li>
   <li style="box-sizing: inherit;">환경설정 파일에 아래의 코드를 추가한다.<br style="box-sizing: inherit;" />
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">allow_anonymous false</code>
      &nbsp;: 익명의 사용자 거부.<br style="box-sizing: inherit;" />
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">password_file /etc/mosquitto/passwd</code>
      &nbsp;: 추가한 사용자 정보를 사용하도록 설정.</li>
   </ul>
<h4 id="2-mosquitto-포트-설정" style="box-sizing: inherit; font-size: 18px; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">2) mosquitto 포트 설정</h4>
<ul style="box-sizing: inherit; color: #ececec; font-size: 18px; letter-spacing: -0.072px; background-color: #121212;">
   <li style="box-sizing: inherit;">기본적으로 mosquitto는 localhost:1883 포트를 사용한다.</li>
   <li style="box-sizing: inherit;">외부의 접속을 허용하기 위해서는 설정에 아래의 코드를 추가한다.<br style="box-sizing: inherit;" />
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">listener 1883</code>
      &nbsp;: 외부의 1883(브로커) 포트 접근을 허용한다.<br style="box-sizing: inherit;" />
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">listener 11884</code>
      &nbsp;: 외부의 11884(웹소켓) 포트 접근을 허용한다.<br style="box-sizing: inherit;" />
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">protocol websockets</code>
      &nbsp;: 웹소켓 프로토콜을 사용한다.</li>
   </ul>
<h2 id="2-실행" style="box-sizing: inherit; font-size: 2rem; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">2. 실행</h2>
<ul style="box-sizing: inherit; color: #ececec; font-size: 18px; letter-spacing: -0.072px; background-color: #121212;">
   <li style="box-sizing: inherit;">
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">sudo systemctl start mosquitto</code>
      <br style="box-sizing: inherit;" />: mosquitto 서비스 시작.</li>
   <li style="box-sizing: inherit;">
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">sudo systemctl enable mosquitto</code>
      <br style="box-sizing: inherit;" />: mosquitto가 시스템 부팅 시 자동으로 시작되도록 설정.</li>
   <li style="box-sizing: inherit;">
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">sudo systemctl status mosquitto</code>
      <br style="box-sizing: inherit;" />: mosquitto 상태 조회 -&gt; active (running) 이라고 나와야함.</li>
   </ul>
<h2 id="3-테스트" style="box-sizing: inherit; font-size: 2rem; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">3. 테스트</h2>
<h3 id="3-1-우분투-터미널-테스트" style="box-sizing: inherit; font-size: 1.5rem; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">3-1. 우분투 터미널 테스트</h3>
<ul style="box-sizing: inherit; color: #ececec; font-size: 18px; letter-spacing: -0.072px; background-color: #121212;">
   <li style="box-sizing: inherit;">터미널창을 2개 연다.</li>
   <li style="box-sizing: inherit;">1번 터미널창에 아래와같이 입력한다.<br style="box-sizing: inherit;" />
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">mosquitto_sub -h localhost -t "test/topic" -u "username" -P "password"</code>
      <br style="box-sizing: inherit;" />: username과 userpassword는 사용자 설정에서 추가한 사용자의 아이디, 패스워드<br style="box-sizing: inherit;" />: 실행하면 메세지를 받을 준비를 한다.</li>
   <li style="box-sizing: inherit;">2번 터미널 창에 아래와같이 입력한다.<br style="box-sizing: inherit;" />
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">mosquitto_pub -h localhost -t "test/topic" -m "Hello World" -u "username" -P "password"</code>
      <br style="box-sizing: inherit;" />: username과 userpassword는 사용자 설정에서 추가한 사용자의 아이디, 패스워드<br style="box-sizing: inherit;" />: 실행하면 1번 터미널창에 Hello World가 출력된다.</li>
   </ul>
<h3 id="3-2-php-테스트" style="box-sizing: inherit; font-size: 1.5rem; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">3-2. php 테스트</h3>
<blockquote style="box-sizing: inherit; margin: 2rem 0px; border-left: 4px solid var(--primary2); border-top-right-radius: 4px; border-bottom-right-radius: 4px; background-image: ; background-position-x: ; background-position-y: ; background-size: ; background-repeat: ; background-attachment: ; background-origin: ; background-clip: ; padding: 1rem 1rem 1rem 2rem; color: #ececec; font-size: 18px; letter-spacing: -0.072px;">
   <ul style="box-sizing: inherit; padding-left: 1rem; margin-top: 0px; margin-bottom: 0px;">
      <li style="box-sizing: inherit; margin-top: 0px;">mosquitto와 php 소스는 같은 서버일 필요가 없다.</li>
      <li style="box-sizing: inherit;">mosquitto는 브로커의 역할만 하기때문.</li>
      <li style="box-sizing: inherit; margin-bottom: 0px;">테스트를 위한 php 파일은 총 세개를 준비한다.<br style="box-sizing: inherit; margin-top: 0px; margin-bottom: 0px;" />: publisher, client, mqttlibrary</li>
      </ul>
   </blockquote>
<h4 id="1-publisher" style="box-sizing: inherit; font-size: 18px; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">1) publisher</h4>
<pre class=" language-null" style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; font-size: 0.875rem; padding: 1em; border-radius: 4px; line-height: 1.5; overflow: auto; letter-spacing: 0px; background-image: ; background-position-x: ; background-position-y: ; background-size: ; background-repeat: ; background-attachment: ; background-origin: ; background-clip: ; color: var(--prism-default-text); word-break: normal; overflow-wrap: normal; tab-size: 4; hyphens: none; margin-top: 0.5em; margin-bottom: 0.5em;">
   <code class=" language-null" style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; color: var(--prism-default-text); background-image: none; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; word-spacing: normal; word-break: normal; overflow-wrap: normal; tab-size: 4; hyphens: none;">&lt;?php
require_once("phpMQTT.php");
if ($_SERVER['REQUEST_METHOD'] === 'POST' &amp;&amp; !empty($_POST['message'])) {
    $server   = '8.8.8.12';   		// MQTT 브로커 주소
    $port     = 1883;         		// MQTT 포트 번호
    $username = '[사용자이름]';       // MQTT 사용자 이름
    $password = '[사용자비밀번호]';   // MQTT 비밀번호
    $client_id = uniqid();    		// 클라이언트 ID
    // MQTT 클라이언트 인스턴스 생성
    $mqtt = new Bluerhinos\phpMQTT($server, $port, $client_id);
    // MQTT 서버에 연결
    if ($mqtt-&gt;connect(true, NULL, $username, $password)) {
        $topic = "test/topic";
        $message = strip_tags($_POST['message']);
        // 메시지 발행
        $mqtt-&gt;publish($topic, $message, 0);
        $mqtt-&gt;close();
        $feedback = "Message published to {$topic}";
    } else {
        $feedback = "Could not connect to the MQTT server.";
    }
} else {
    $feedback = "";
}
?&gt;
&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;title&gt;MQTT Message Publisher&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;h1&gt;MQTT Message Publisher&lt;/h1&gt;
&lt;form action="index.php" method="post"&gt;
    &lt;label for="message"&gt;Message:&lt;/label&gt;&lt;br&gt;
    &lt;input type="text" id="message" name="message" required&gt;&lt;br&gt;&lt;br&gt;
    &lt;input type="submit" value="Publish"&gt;
    &lt;a href="client.php"&gt;client&lt;/a&gt;
&lt;/form&gt;
&lt;p&gt;&lt;?php echo $feedback; ?&gt;&lt;/p&gt;
&lt;script&gt;
    document.getElementById("message").focus();
&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;</code>
   </pre>
<ul style="box-sizing: inherit; color: #ececec; font-size: 18px; letter-spacing: -0.072px; background-color: #121212;">
   <li style="box-sizing: inherit;">
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">$server = '8.8.8.12'</code>
      <br style="box-sizing: inherit;" />: mosquitto(브로커)가 설치 된 서버 아이피</li>
   <li style="box-sizing: inherit;">
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">$port = 1883</code>
      <br style="box-sizing: inherit;" />: mosquitto(브로커) 포트</li>
   <li style="box-sizing: inherit;">
      <code style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; background: var(--bg-inline-code); padding: 0.2em 0.4em; font-size: 15.3px; border-radius: 3px;">$topic = "test/topic"</code>
      <br style="box-sizing: inherit;" />: 구독 할 topic</li>
   </ul>
<h4 id="2-client" style="box-sizing: inherit; font-size: 18px; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">2) client</h4>
<pre class=" language-null" style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; font-size: 0.875rem; padding: 1em; border-radius: 4px; line-height: 1.5; overflow: auto; letter-spacing: 0px; background-image: ; background-position-x: ; background-position-y: ; background-size: ; background-repeat: ; background-attachment: ; background-origin: ; background-clip: ; color: var(--prism-default-text); word-break: normal; overflow-wrap: normal; tab-size: 4; hyphens: none; margin-top: 0.5em; margin-bottom: 0.5em;">
   <code class=" language-null" style="box-sizing: inherit; font-family: &quot;Fira Mono&quot;, source-code-pro, Menlo, Monaco, Consolas, &quot;Courier New&quot;, monospace; color: var(--prism-default-text); background-image: none; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; word-spacing: normal; word-break: normal; overflow-wrap: normal; tab-size: 4; hyphens: none;">&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
    &lt;title&gt;MQTT WebSocket Example with PHP&lt;/title&gt;
    &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/paho-mqtt/1.1.0/paho-mqtt.min.js"&gt;&lt;/script&gt;
    &lt;script&gt;
        function MQTTconnect() {
            const client = new Paho.Client("ws://mqtt.themomos.co.kr:11884/", "clientId" + new Date().getTime());
            client.onConnectionLost = function (responseObject) {
                console.log("Connection Lost: "+responseObject.errorMessage);
            };
            client.onMessageArrived = function (message) {
                console.log("Message Arrived: "+message.payloadString);
                document.getElementById("messages").innerHTML += '&lt;p&gt;' + message.payloadString + '&lt;/p&gt;';
            };
            client.connect({
                onSuccess:function(){
                    console.log("Connected");
                    client.subscribe("test/topic");
                },
                userName: "[사용자이름]",
                password: "[사용자비밀번호]"
            });
        }
    &lt;/script&gt;
&lt;/head&gt;
&lt;body onload="MQTTconnect();"&gt;
&lt;h2&gt;MQTT over WebSockets Example&lt;/h2&gt;
&lt;div id="messages"&gt;&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;</code>
   </pre>
<h4 id="3-library" style="box-sizing: inherit; font-size: 18px; line-height: 1.5; margin-bottom: 1rem; color: #ececec; letter-spacing: -0.072px; background-color: #121212;">3) library</h4>
<p style="box-sizing: inherit; color: #ececec; font-size: 18px; letter-spacing: -0.072px; background-color: #121212;"><a href="https://github.com/bluerhinos/phpMQTT" style="box-sizing: inherit; text-decoration-line: none;" target="_blank">https://github.com/bluerhinos/phpMQTT</a><br style="box-sizing: inherit;" />: phpMQTT.php 파일을 다운받아서 사용한다.</p>