2017-02-07 2 views
0

여러분, 저는 각도 2 Cli 프로젝트가 있습니다. 그것의 간단한 채팅 응용 프로그램. 그러나 어떤 이유로 서버가 클라이언트에게 메시지를 보내지 않거나 보내지 않습니다. 컴파일 오류가없고 응용 프로그램이 작동하지만 소켓 메시징은 없습니다.각도 2 cli 프로젝트 -Socket.io가 작동하지 않습니다.

import { Component } from '@angular/core'; 
import * as io from "socket.io-client"; 

@Component({ 
selector: 'app-root', 
templateUrl: './app.component.html', 
styleUrls: ['./app.component.css'] 
}) 
export class AppComponent { 
    messages: Array<String>; 
    chatBox: String; 
    socket: any; 
constructor() { 
    this.chatBox = ""; 
    this.socket = io("http://localhost:3000"); 
     this.socket.on("message", (msg) => { 
     this.messages.push(msg); 
     }); 
    } 
    send(message) { 
    this.socket.emit("message", message); 
    this.chatBox = ""; 
    } 

} 

HTML을

const express = require('express'); 
const path = require('path'); 
const http = require('http'); 
const bodyParser = require('body-parser'); 


const app = express(); 

// Parsers for POST data 
    app.use(bodyParser.json()); 
    app.use(bodyParser.urlencoded({ extended: false })); 

// Point static path to dist 
app.use(express.static(path.join(__dirname, 'dist'))); 


    // Catch all other routes and return the index file 
    app.get('*', (req, res) => { 
    res.sendFile(path.join(__dirname, 'dist/index.html')); 
    }); 

/** 
    * Get port from environment and store in Express. 
    */ 
    const port = process.env.PORT || '3000'; 
app.set('port', port); 

/** 
* Create HTTP server. 
*/ 
const server = http.createServer(app); 

    //set socket.io for chat 
    var io = require('socket.io').listen(server); 
    io.on('connnection', (socket) => { 
    console.log('user connected'); 
    socket.on('message', (msg) => { 
    console.log('Message Received: ', msg); 
    socket.broadcast.emit('message', msg); 
    }); 
    socket.on('disconnect',() => { 
    console.log('user has disconnected'); 
    }); 


    }); 


    server.listen(port,() => console.log("server running")); 

응용 프로그램 구성 요소 : 내가 어떤 도움이나 힌트를 부탁드립니다

<ul> 
    <li *ngFor="let item of messages">{{item}}</li> 
    </ul> 

<input [(ngModel)]="chatBox" autocomplete="off" /> 
    <button (click)="send(chatBox)">Send</button> 

는이 문제를 해결하기 위해

익스프레스 : 다음은 각각의 코드입니다 .

만약 내가 간단한 채팅을 기반으로 서버가 잘 작동합니다.

감사합니다.

+0

처럼 연결하거나 뭔가에 실패 오류가에

? 내 작업 코드 –

+0

하나 .. https://gist.github.com/parthghiya/7a03cbf2bb5be5af7746e06a0d7d24fe –

+0

없음 오류가없는, 그냥 내가 프런트 엔드에 대해 이야기하고있는 CONSOLE.LOG 메시지 – leo

답변

0

소켓에 연결하기위한 코드가 전혀 없습니다.

변경

this.socket = 10 ("http://localhost:3000");

this.socket=io.connect("http://localhost:3000") 
+0

도움이되지 않습니다 .... 클라이언트 측에서 socket.io를 어떻게 읽었습니까? angular-cli.json에 스크립트를 추가했거나 (index.html) 또는 을 index.html에 넣으십시오. – leo