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

一. 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();
});

 

 

三. http://localhost/angularjs_cgi访问

浏览器显示如下(去除格式了, 其中data_from_cgi即req_resp.cpp返回的内容):

 

angularjs_cgi.html

angularjs get data from cgi with https

data from angularjs:1234

data from cgi:<H4>PID: 4072</H4> <H4>Request Number: 17</H4> <H4>Request Environment</H4> QUERY_STRING=hello=1

 

posted @ 2014-11-27 19:51  helloweworld  阅读(614)  评论(0)  编辑  收藏  举报