web(七)--angular从cgi获取数据

浏览数：37 / 时间：2015年06月09日

一. cgi用前面小节的req_resp.cpp, 这里略去cgi的编译和部署.

二. 下面的几个文件在同一个目录.

1. index.py 增加两处:

(1)

 (r"/index.py/angularjs_cgi", AngularjsCgiHandler)

(2)

class AngularjsCgiHandler(tornado.web.RequestHandler):
    def get(self):
        self.render("angularjs_cgi.html")

import tornado.ioloop
import tornado.web

class MainHandler(tornado.web.RequestHandler):
    def get(self):
        self.write("Hello, world, this is tornado test!")

class StoryHandler(tornado.web.RequestHandler):
    def get(self, story_id):
        self.write("You requested the story " + story_id)

class TemplateHandler(tornado.web.RequestHandler):
    def get(self):
        items = ["Item 1", "Item 2", "Item 3"]
        self.render("template.html", title="My title", items=items)

class AngularjsTestHandler(tornado.web.RequestHandler):
    def get(self):
        self.render("angularjs_test.html")

class AngularjsCgiHandler(tornado.web.RequestHandler):
    def get(self):
        self.render("angularjs_cgi.html")

application = tornado.web.Application([
    (r"/", MainHandler),
    (r"/index.py", MainHandler),
    #(r"/story/([0-9]+)", StoryHandler),
    (r"/template", TemplateHandler),
    (r"/index.py/template", TemplateHandler),
    (r"/index.py/angularjs_test", AngularjsTestHandler),
    (r"/index.py/angularjs_cgi", AngularjsCgiHandler),
])

if __name__ == "__main__":
    application.listen(8888)
    tornado.ioloop.IOLoop.instance().start()

2. angularjs_cgi.html

<!DOCTYPE html>
<html>
<body>
<h2>angularjs_cgi.html</h1>
<h2>angularjs get data from cgi with https</h2>

<div ng-app="angularjs_cgi_app" ng-controller="angularjs_cgi_ctrl">
    <p>data from angularjs:||data_from_angularjs|| </p>
    <p>data from cgi:||data_from_cgi|| </p>
</div>

</body>
</html>

<script src="//www.w3cschool.cc/try/angularjs/1.2.5/angular.min.js"></script>
<script src="angularjs_cgi.js"></script>

3. angularjs_cgi.js angular利用$http从cgi获取数据, $http的使用google之.

var app = angular.module("angularjs_cgi_app", []);

app.config(function($interpolateProvider) {
  $interpolateProvider.startSymbol(‘||‘);
  $interpolateProvider.endSymbol(‘||‘);
});

app.controller("angularjs_cgi_ctrl", function($scope, $http, $timeout, $interval) {

    $scope.data_from_angularjs = 1234;

    // data from cgi
    $scope.data_from_cgi = ‘‘;
    $scope.get_data = function(){
        $http({
        method:"GET",
        url:"/req_resp.cgi?hello=1",
        data:{
            action : "this_is_action",
            login_name : "zhangsan",
            }
        }).success(function(data){
            $scope.data_from_cgi = data;
        }).error(function(){
            alert(‘get data from cgi err!‘);
            setTimeout($scope.get_data(), 4000);
        });
    }
    $scope.get_data();
});