AngularJS意外的令牌<在ng-view中的位置0的JSON中

时间:2016-08-16 14:30:17

标签: javascript angularjs json ng-view

我有点问题。我正在开发angularjs单个Web应用程序页面,我试图在角度模块中添加SockJS。

这是我的主页。

<html ng-app="myApp">
    <head>
        <title>Timeline Page</title>
        <meta charset="utf-8">
        <link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700&subset=all" rel="stylesheet" type="text/css" />
        <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <link href="css/bootstrap-switch.min.css" rel="stylesheet" type="text/css" />
        <link href="css/components.min.css" rel="stylesheet" id="style_components" type="text/css" />
        <link href="css/plugins-md.min.css" rel="stylesheet" type="text/css" />
        <link href="css/layout.min.css" rel="stylesheet" type="text/css" />
        <link href="css/light.min.css" rel="stylesheet" type="text/css" id="style_color" />
        <link href="css/custom.min.css" rel="stylesheet" type="text/css" />
    </head>
    <body class="page-container-bg-solid page-md">
        <div ng-view></div>
    </body>
    <script type="text/javascript" src="js/lib/angular.min.js"></script>
    <script type="text/javascript" src="js/lib/angular-route.min.js"></script>
    <script type="text/javascript" src="js/app.js"></script>
    <script type="text/javascript" src="js/lib/sockjs-0.3.4.js"></script>
    <script type="text/javascript" src="js/lib/stomp.js"></script>
</html>

这是js代码。

var myApp = angular.module('myApp', ['ngRoute', 'myApp.controllers', 'myApp.services', function () {
        var socket = new SockJS('/hello');
        stompClient2 = Stomp.over(socket);
        stompClient2.connect({}, function (frame) {
            con = true;
            console.log('Connected: ' + frame);
            stompClient2.subscribe('/topic/greetings', function (greeting) {
                showGreeting(JSON.parse(greeting.body).content);
            });
        });
    }]);

当我尝试这个时,我遇到了这个问题:

Uncaught SyntaxError: Unexpected token < in JSON at position 0

我有很多页面,我想在打开页面时打开一个套接字,但它不起作用。有人可以帮帮我吗?

修改 Greeting.class

public class Greeting {

    private String content;

    public Greeting(String content) {
        this.content = content;
    }

    public String getContent() {
        return content;
    }

}

GreetingController.class

@Controller
public class GreetingController {

    @MessageMapping("/hello")
    @SendTo("/topic/greetings")
    public Greeting greeting(HelloMessage message) throws Exception {
        //Thread.sleep(1000); // simulated delay
        return new Greeting("Hello, " + message.getName() + "!");
    }

}

2 个答案:

答案 0 :(得分:2)

好像从greeting.body返回的内容不是有效的 json字符串。

鉴于你的错误在位置0有一个<,我会假设html是在你的API上发回而不是意外。

答案 1 :(得分:-1)

您必须拥有无效的JSON响应。删除JSON.parse应该有助于避免此错误。但是,您应该只在服务器端工作。

您可以使用JSON Lint来验证响应JSON。

var myApp = angular.module('myApp', ['ngRoute', 'myApp.controllers', 'myApp.services', function () {
        var socket = new SockJS('/hello');
        stompClient2 = Stomp.over(socket);
        stompClient2.connect({}, function (frame) {
            con = true;
            console.log('Connected: ' + frame);
            stompClient2.subscribe('/topic/greetings', function (greeting) {
                showGreeting(greeting.body);
            });
        });
    }]);