将 Strophe 与 React JS 集成

Question

我正在尝试使用 React JS 登录我的 XMPP 服务器。

我是 React 的新手，所以不知道我做错了什么，请看看你能不能在这里帮助我。

import './App.css';
var BOSH_SERVICE = 'ws://chat.example.com:7070/ws';
var connection = null;
const Strophe = require("strophe.js").Strophe;
console.log("Strophe is "  ,  Strophe);
Strophe.LogLevel = 0;
connection = new Strophe.Connection(BOSH_SERVICE, { 'keepalive': true });
connection.connect("rajan@example.com","jagruti", onConnect);
console.log("New Connection is " , connection);

function App() {
 
  

  return (
    <div className="App">
     <p>Strophe React Example</p>
    </div>
  );
}

function onConnect(status) {

  if (status == Strophe.Status.CONNECTING) {
      console.log('Synergy is connecting.');
  } else if (status == Strophe.Status.CONNFAIL) {
    console.log('Synergy failed to connect.');

  } else if (status == Strophe.Status.DISCONNECTING) {
    console.log('Synergy is disconnecting.');
  } else if (status == Strophe.Status.DISCONNECTED) {
    console.log('Synergy is disconnected.');

  } else if (status == Strophe.Status.CONNECTED) {
    console.log('Synergy is connected.');
      // set presence
      connection.addHandler(onMessage, null, 'message', null, null, null);
      connection.send($pres().tree());
      connection.addHandler(onPresence, null, "presence");
      connection.sendIQ($iq({ type: "get" }).c("query", { xmlns: Strophe.NS.ROSTER }).tree(), onRoster);
  }
}

但是在编译过程中我不断收到这个错误：

src/App.js
  Line 39:23:  '$pres' is not defined       no-undef
  Line 40:29:  'onPresence' is not defined  no-undef
  Line 41:25:  '$iq' is not defined         no-undef

Answer 1

您还需要导入它们。

import  { Strophe, $pres, $iq, onPresence } from 'strophe.js'

将 Strophe 与 React JS 集成

Integrating Strophe with React JS

reactjs

react-hooks

strophe