🧲Flutter에서 websocket 오류인 경우

windows 환경에서 Flutter 와 AGENT 연결할 때 javascript 를 지원 해 주고 있습니다.

가.순서

js 패키지 설치
빌드된 JS 라이브러리 준비
플러터 프로젝트의 web폴더 밑의 index.html 수정
JS 라이브러리 연결
사용

1. js 패키지 설치

pubspec.yaml에 다음과 같이 js 패키지를 추가합니다.

dependencies:
  flutter:
    sdk: flutter
  js: ^0.6.3

추가하고 패키지를 설치합니다.

$ flutter pub get

2. JS 라이브러리 파일 준비

3. web 폴더 구조

4. web폴더의 index.html 에 websocketSample.html 소스 복사

```html
  <title>windows_flutter_web_testpage</title>
  <script src="websocketSample.js"></script>
  
```

```html
<body>
  <h1>WebSocket Client</h1>
  <table>
  <tr>
    <td>거래구분</td>
    <td>
    <select name=tran_code id="tran_code">
      <option value="D1">신용승인</option>
      <option value="D2">신용취소</option>
      <option value="CC">현금영수증승인</option>
      <option value="CR">현금영수증취소</option>
    </select>
    </td>
  </tr>
  <tr>
    <td>결제금액</td>
    <td><input type = 'text' id="txtAmount" size =12 value='1004'></td>
  </tr>
  <tr>
    <td>할부개월</td>
    <td><input type = 'text' id="txtPeriod" size =2 value='00'></td>
  </tr>
  </table>
  <!-- WebSocket Connection Parameters Table -->
      <table>
    <tr>
      <td>통신방식</td>
      <td>
        <input style="width:50px;" type='radio' name='netprotocol' id='net_ws' value='ws' checked=true />WS
        <input style="width:50px;" type='radio' name='netprotocol' id='net_wss' value='wss' />WSS
      </td>
    </tr>
          <tr>
              <td>WS Endpoint</td>
              <td><input type="text" id="endpoint"/></td>
          </tr>
    <tr>
              <td>Message</td>
              <td><input type="text" id="message"/></td>
          </tr>
    <tr>
              <td>연결요청</td>
              <td>
                  <input id="btnConnect"	type="button" value="Connect"	onclick="Connect()">&nbsp;&nbsp;
              </td>
          </tr>
    <tr>
              <td>연결해제</td>
              <td>
                  <input id="btnDisconnect"	type="button" value="Disconnect"	onclick="Disconnect()">&nbsp;&nbsp;
              </td>
          </tr>
          <tr>
              <td>결제요청</td>
              <td>
                  <input id="btnApproval"	type="button" value="Approval"	onclick="Approval()">&nbsp;&nbsp;
              </td>
          </tr>
    <tr>
      <td>거래중단</td>
              <td>
        <input id="btnStop" 	type="button" value="Stop"		onclick="KIS_Agent_Stop()">&nbsp;&nbsp;
      </td>
    </tr>
      </table><br/>

      <textarea id="incomingMsgOutput" rows="10" cols="20" disabled="disabled"></textarea>
  
</body>
```

5. 사용

$ flutter doctor

$ flutter channel stable
$ flutter upgrade
$ flutter config --enable-web //web 활성화 명령어
$ flutter devices

// run
$ flutter run -d chrome
Launching lib\main.dart on Chrome in debug mode...
Waiting for connection from debug service on Chrome...             11.4s
This app is linked to the debug service: ws://127.0.0.1:63805/EAlgYyEyUw4=/ws
Debug service listening on ws://127.0.0.1:63805/EAlgYyEyUw4=/ws

AGENT PAY STOP

Previous🧯WPF에서 Integration 오류인 경우 NextEdge 브라우저 통신실패인 경우

Last updated 7 months ago