websocket - WSO2 websocket + SockJS - 跨源请求被阻止

Question

由于 WSO2 5.0 支持 WebSockets，我按照教程编写了一个简单的应用程序:

• WebSocket Transport
• Sending a Message from a WebSocket Client to an HTTP Endpoint

这是我在 WSO2 中的源 View 输出:

<?xml version="1.0" encoding="UTF-8"?>
<definitions xmlns="http://ws.apache.org/ns/synapse">
    <registry provider="org.wso2.carbon.mediation.registry.WSO2Registry">
        <parameter name="cachableDuration">15000</parameter>
    </registry>
    <taskManager provider="org.wso2.carbon.mediation.ntask.NTaskTaskManager"/>
    <sequence name="fault">
        <!-- Log the message at the full log level with the ERROR_MESSAGE and the ERROR_CODE-->
        <log level="full">
            <property name="MESSAGE" value="Executing default 'fault' sequence"/>
            <property expression="get-property('ERROR_CODE')" name="ERROR_CODE"/>
            <property expression="get-property('ERROR_MESSAGE')" name="ERROR_MESSAGE"/>
        </log>
        <!-- Drops the messages by default if there is a fault -->
        <drop/>
    </sequence>
    <sequence name="main">
        <in>
            <!-- Log all messages passing through -->
            <log level="full"/>
            <!-- ensure that the default configuration only sends if it is one of samples -->
            <!-- Otherwise Synapse would be an open proxy by default (BAD!)               -->
            <filter regex="http://localhost:9000.*" source="get-property('To')">
                <!-- Send the messages where they have been sent (i.e. implicit "To" EPR) -->
                <send/>
            </filter>
        </in>
        <out>
            <send/>
        </out>
        <description>The main sequence for the message mediation</description>
    </sequence>
    <sequence name="outDispatchSeq">
        <log level="full"/>
        <respond/>
    </sequence>
    <sequence name="dispatchSeq">
        <switch
            source="get-property('websocket.source.handshake.present')" xmlns:ns="http://org.apache.synapse/xsd">
            <case regex="true">
                <drop/>
            </case>
            <default>
                <call/>
                <respond/>
            </default>
        </switch>
    </sequence>
    <!-- You can add any flat sequences, endpoints, etc.. to this synapse.xml file if you do
    *not* want to keep the artifacts in several files -->
    <inboundEndpoint name="test" onError="fault" protocol="ws"
        sequence="dispatchSeq" suspend="false">
        <parameters>
            <parameter name="inbound.ws.port">9091</parameter>
            <parameter name="ws.client.side.broadcast.level">0</parameter>
            <parameter name="ws.outflow.dispatch.sequence">outDispatchSeq</parameter>
            <parameter name="ws.outflow.dispatch.fault.sequence">fault</parameter>
        </parameters>
    </inboundEndpoint>
</definitions>

我能够使用 Nett 客户端成功测试它:

C:\work\servers\netty>java -Durl=ws://localhost:9091/websocket -DsubProtocol="synapse(contentType='application/xml')" -cp netty-example-4.1.4.Final.jar;lib/*;. io.netty.example.http.websocketx.client.WebSocketClient
WebSocket Client connected!

但是，如果我尝试通过 JavaScript 代码对其进行测试，则会出现如下错误:

你知道我的代码有什么问题吗？

Answer 1

出现此问题是因为 SockJS 在内部尝试使用 XMLHttpRequest 加载 URL，但 Chrome 不允许访问跨源内容，除非该协议(protocol)是上述协议(protocol)之一(在本例中为 ws://)。我在 Firefox 上尝试过类似的情况，它工作正常，因为它没有这个 Chrome 特定的限制。

在这种情况下，由于 WSO2 ESB 公开了一个 WebSocket 接口(interface)来调用 HTTP 端点，您可以使用 native HTML5 WebSocket 实现，如下所示。

var url = 'ws://localhost:9091/websocket';
var ws = new WebSocket(url);

ws.onopen = function() {
  // todo
}

ws.onmessage = function(e) {
  // todo
}