Question

我在Jack Moffit的书中尝试了一个例子：使用JavaScript和jQuery的专业XMPP编程。具体来说，我正在尝试第3章中的hello world应用程序，它应该通过使用bosh的Web界面登录到xmpp服务器。我已经从http://media.wiley.com/product_ancillary/10/04705407/DOWNLOAD/9780470540718_Professional%20XMPP_Code%20Download.zip下载了所有必要的代码。

当我在Chrome中打开文件Hello.html并打开JavaScript控制台时，没有任何问题，因此文件中引用的脚本和css文件似乎已成功加载。

这是Hello.html文件：

        <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
              "http://www.w3.org/TR/html4/strict.dtd">
    <html>
      <head>
        <title>Hello - Chapter 3</title>

        <link rel='stylesheet' href='http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/cupertino/jquery-ui.css'>
        <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js'></script>
        <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js'></script>
        <script src='../scripts/strophe.js'></script>
        <script src='../scripts/flXHR.js'></script>
        <script src='../scripts/strophe.flxhr.js'></script>

        <link rel='stylesheet' href='hello.css'>
        <script src='hello.js'></script>
      </head>
      <body>
        <h1>Hello</h1>

        <div id='log'>
        </div>

        <!-- login dialog -->
        <div id='login_dialog' class='hidden'>
          <label>JID:</label><input type='text' id='jid'>
          <label>Password:</label><input type='password' id='password'>
        </div>
      </body>
    </html>

这是hello.js：

        var Hello = {
        connection: null,
        start_time: null,

        log: function (msg) {
            $('#log').append("<p>" + msg + "</p>");
        },

        send_ping: function (to) {
            var ping = $iq({
                to: to,
                type: "get",
                id: "ping1"}).c("ping", {xmlns: "urn:xmpp:ping"});

            Hello.log("Sending ping to " + to + ".");

            Hello.start_time = (new Date()).getTime();
            Hello.connection.send(ping);
        },

        handle_pong: function (iq) {
            var elapsed = (new Date()).getTime() - Hello.start_time;
            Hello.log("Received pong from server in " + elapsed + "ms.");

            Hello.connection.disconnect();

            return false;
        }
    };

    $(document).ready(function () {
        $('#login_dialog').dialog({
            autoOpen: true,
            draggable: false,
            modal: true,
            title: 'Connect to XMPP',
            buttons: {
                "Connect": function () {
                    $(document).trigger('connect', {
                        jid: $('#jid').val(),
                        password: $('#password').val()
                    });

                    $('#password').val('');
                    $(this).dialog('close');
                }
            }
        });
    });

    $(document).bind('connect', function (ev, data) {
        var conn = new Strophe.Connection(
            "http://bosh.metajack.im:5280/xmpp-httpbind");
        conn.connect(data.jid, data.password, function (status) {
            if (status === Strophe.Status.CONNECTED) {
                $(document).trigger('connected');
            } else if (status === Strophe.Status.DISCONNECTED) {
                $(document).trigger('disconnected');
            }
        });

        Hello.connection = conn;
    });

    $(document).bind('connected', function () {
        // inform the user
        Hello.log("Connection established.");

        Hello.connection.addHandler(Hello.handle_pong, null, "iq", null, "ping1");

        var domain = Strophe.getDomainFromJid(Hello.connection.jid);

        Hello.send_ping(domain);

    });

    $(document).bind('disconnected', function () {
        Hello.log("Connection terminated.");

        // remove dead connection object
        Hello.connection = null;
    });

基本上，它所做的是通过在http://bosh.metajack.im:5280/xmpp-httpbind运行的BOSH服务连接到XMPP服务器。当它连接时，它打印＆＃34;建立连接＆＃34;使用jQuery到html文件。

但是，我无法连接到服务器。我已检查http://bosh.metajack.im:5280/xmpp-httpbind的bosh服务已启动并正在运行。我在alpha-labs.net和jabber.de上创建了xmpp帐户。两个帐户都在我的Windows机器上使用pidgin IM工作。但我无法使用此示例登录其中任何一个帐户。

当我输入我的jid如justastest@alpha-labs.net和相应的密码时，屏幕上没有任何内容。

我也已经发布到这本书的出版商的论坛，但它并不是经常光顾，所以我想我会在这里试试。

感谢您的帮助！

C

编辑：所以我把它缩小了一点，并且在其他人的帮助下确定这可能是一个CORS问题。到目前为止，我一直使用file：///在本地Web浏览器中访问Hello.html。在这种情况下，我无法连接到任何服务器。

但是，如果我在服务器上托管Hello.html / hello.js，然后使用http通过我的Web浏览器访问该版本，则代码可以正常工作，即可以建立服务器连接。

我不太明白，为什么这是一个问题。如果我在本地访问它，为什么它不起作用，我能以某种方式使它在本地场景中工作吗？

Answer 1

要启用CORS功能，您必须从Web服务器而不是文件运行本地站点。

Here's a relevant SO answer which explains why。

基本上，由于您网站的来源是文件而不是网址，因此当CORS机制尝试确定是否应该允许该请求时，它会与null进行比较。看来这个问题可能只影响某些浏览器（chrome）。显然，简单的解决方法是从本地Web服务器运行您的html文件。

如果JS代码没有托管在服务器上（CORS？），Strophejs XMPP Hello World无法连接到服务器

1 个答案: