'WebSocket'の作成に失敗しました： '[オブジェクトオブジェクト]'のURLが無効です

Question

私はwebsocketへの接続を試み、反応ルータでデータを取得しようとしていました。接続は行われておらず、エラーUncaught SyntaxError: Failed to construct 'WebSocket': The URL '[object Object]' is invalid.がブラウザコンソールに表示されています。端末からアプリケーションを起動するためにnpm startを使用します。これは単純な反応ルータアプリケーションです。以下は、問題が発生したと思うリアクションコードです。

import React from 'react' 

export default React.createClass({ 
    getInitialState: function() { 
    return { value : [], 
        client : '' }; 
    }, 

    componentWillMount: function() { 
     client = new WebSocket("ws://localhost:8000/","echo-protocol"); 
     client.onerror = function() { 
      console.log('Connection Error'); 
     }; 

     client.onopen = function() { 
      function sendNumber() { 
       if (client.readyState === client.OPEN) { 
        var number = Math.round(Math.random() * 0xFFFFFF); 
        client.send(number.toString()); 
        setTimeout(sendNumber, 1000); 
       } 
      } 
      sendNumber(); 
     }; 

    client.onmessage = function(e) { 
      this.setState({ 
       value: e.data 
      }); 
     }.bind(this); 
    }, 

    componentWillUnmount: function(){ 
     client.close(); 
    }, 

    render: function() { 
     return (React.createElement("div",null,this.state.value)) 
    } 
}); 

WebPACKの設定ファイルされる -

module.exports = { 
    entry: './index.js', 

    output: { 
    filename: 'bundle.js', 
    publicPath: '' 
    }, 

    module: { 
    loaders: [ 
     { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader?presets[]=es2015&presets[]=react' } 
    ] 
    } 
} 

コードの他の部分は、その後、私に知らせてください必要がある場合はまた、packge.jsonファイルが

{ 
    "name": "react_form", 
    "version": "1.0.0", 
    "description": "Sample form that uses React for its rendering", 
    "main": "index.js", 
    "scripts": { 
    "start": "webpack-dev-server --inline --content-base . --history-api-fallback" 
    }, 
    "author": "J", 
    "license": "ISC", 
    "dependencies": { 
    "react": "^0.14.7", 
    "react-dom": "^0.14.7", 
    "react-router": "^2.0.0", 
    "websocket": "^1.0.23" 
    }, 
    "devDependencies": { 
    "babel-core": "^6.5.1", 
    "babel-loader": "^6.2.2", 
    "babel-preset-es2015": "^6.5.0", 
    "babel-preset-react": "^6.5.0", 
    "http-server": "^0.8.5", 
    "webpack": "^1.12.13", 
    "webpack-dev-server": "^1.14.1" 
    } 
} 

です。また、ルートオプションの選択時にコンソールに表示されるエラーのイメージを確認してください。 私は得ることができない正確な問題は何ですか？

Answer 1

私はさまざまな方法でアプリをデバッグしていました。その後、コードに問題はないことがわかりました。さらに、ファイル名をWebSocketからSocketに変更し、ルート名をwebSocketからsocketに様々なファイルで変更しました。問題は、ファイルに名前を付け、それに応じてファイルにコードを組み込むことでした。

Answer 2

try this syntax 

クライアント=新しいのWebSocket（ "WS：// localhostを：8000 /"）;