越来越多的服务走向云端,看不见摸不着,让没接触过的我感觉有些茫然,IBM的云平台Blumemix上提供了很多服务,我这里就把学习使用ClearDBMySQL Database服务的过程给大家分享一下。这是一个Python的投票小程序,针对主题“你曾后悔进入 IT 行业吗?”展开投票功能,基于简单的Cookie操作判断用户有没有投过票,如果没有投过票,就显示投票选项和按钮,不显示投票结果;如果已经投票了,就直接显示投票结果,而不能再次投票。
构建一个类似的应用程序的前提条件
一个 Bluemix 帐户,您还没有? 点击这里注册,已经有,点击这里登录;对 HTML(超文本标记语言)的基本了解;
对CSS (层叠样式表)的基本了解;
对JavaScript(一种直译式脚本语言)的基本了解;
对Python 编程的基本了解;
对MySQL数据库及管理工具的基本了解;
对SQL语言的基本了解;
我提供了所有必要代码,但对这些技术的基本了解有助于您理解有关的细节。
步骤 1. 创建您的Python应用程序
- 1、在 Bluemix 用户界面中,转至“仪表板”。
- 2、单击创建应用程序。
- 3、单击 Web,然后按照指导经验来选择入门模板,指定名称以及选择编码方式。
- 输入应用程序名称
- 应用程序名称是唯一的,接下来要通过它做为二级域名来访问你的应用!
- 点击完成之后,需要等待一会儿,然后可以看到下图的界面
- 这时就可以访问你刚刚创建的应用了。如下图:
- 可以通过单击 Bluemix 用户界面中应用程序“概述”上的添加服务或 API,将服务添加到应用程序中。也可以使用 cf 命令行界面。请参阅处理应用程序的可用选项。
- 在服务列表中选择数据库(ClearDB MySQL Database)
- 您可以指定服务的名称,也可以使用默认的;
如果你事先已经创建了数据库服务,也可以直接绑定:
获取服务信息
进入自己的应用程序》概述页面,找到已经添加的服务,点击“显示凭证”,可以查看服务的具体信息:
拿到凭证,我们就可以通过MysqL的客户端管理工具来连接管理数据库了:
1、连接数据库
如果你还没有安装Navicat for MySQL管理工具,请参考:MySQL学习(二)图形界面管理工具Navicat for MySQL安装和使用
2、创建数据表
注意:我们是没有权限创建数据库的,只能用默认创建好的;
3、添加所需要的数据:
步骤 3. 准备开发环境
有关开发环境搭建的细节,请参考下面的文章:
《Python入门》Windows 7下Python Web开发环境搭建笔记
《Python入门》第一个Python Web程序——简单的Web服务器
《Python入门》Linux 下 Python Web开发环境搭建笔记步骤 4.编写代码
1、下载初始Hello World示例代码
你可以下载入门示例参考,也可以完全自己写!
进入您的应用程序,点击左侧的开始编码,在右侧点击“下载入门模板代码”。
也可以通过添加Git来下载代码。
2、使其在本地运行
1、将下载的入门模板代码解压到一个目录,打开命令行窗口,切换到这个目录下
可以看出代码结构是很简单的;
2、执行命令:python server.py
3、在浏览器中访问:http://localhost:8000/
3、编写代码
主要代码:“index.html”实现用户交互
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Bluemix云端数据库服务ClearDB MySQL使用示例———Python投票程序 - 无知人生,记录点滴</title>
<style>
body {
margin:0; padding:0;
}
a{
text-decoration:none;
color:black;
}
div.div_id {
float:left;
clear:left;
width:60px;
height:27px;
border-bottom:solid 1px #808080;
text-align:center;
line-height:27px;
}
div.div_item {
float:left;
clear:none;
width:260px;
height:27px;
border-bottom:solid 1px #808080;
text-align:left;
line-height:27px;
}
div.div_radio {
float:left;
clear:none;
width:60px;
height:27px;
border-bottom:solid 1px #808080;
text-align:left;
line-height:27px;
display:none;
}
div.div_num {
float:left;
clear:right;
width:260px;
height:27px;
border-bottom:solid 1px #808080;
text-align:left;
line-height:27px;
display:none;
}
</style>
<script src="jquery.js" type="text/javascript"></script>
<SCRIPT language=javascript>
$(document).ready(function(){
loadVote();
//判断是否已经投过票了,如果投过票了,就不再显示投票按钮,而是显示投票结果;
if (document.cookie == "" || document.cookie == "abc="){
$("#button1").show();
$("div.div_radio").show();
}else{
$("div.div_num").show();
}
});
//通过AJAX加载投票信息
function loadVote(){
$.ajax({
type: "GET",
url: "voteinfo",
dataType:"html",
async: false,
success: function(data){
$("#divctnr").html(data);
console.log(data);
},
error: function(data){
console.log(data);
alert( "加载投票信息失败: " + data.responseText );
}
});
}
//通过AJAX调用后台保存投票信息
function execVote(){
var id = $('input[name="radio1"]:checked').val();
if (id == "" || id == undefined){
alert("请选择投票项!");
return;
}
$("#button1").hide();
$.ajax({
type: "POST",
url: "votesave",
dataType:"html",
data: {"id":id},
success: function(data){
$("#div_num_" + id).text(parseInt($("#div_num_" + id).text()) + 1);
$("div.div_radio").hide();
$("div.div_num").show();
document.cookie = "abc=123";
console.log(data);
},
error: function(data){
console.log(data);
alert( "投票失败: " + data.responseText );
}
});
}
</SCRIPT>
</head>
<body>
<div>
<a href="http://blog.csdn.net/testcs_dn" target="_blank" title="无知人生,记录点滴 不积硅步,无以至千里;不积小流,无以成江海……">
<img src="banner.png" border=0 />
</a>
</div>
<div style="width:640px; height:40px; border-bottom:solid 1px #808080;text-align:center;">
<a href="http://blog.csdn.net/testcs_dn/article/details/49965993"><h3>你曾后悔进入 IT 行业吗?</h3></a>
</div>
<div id="Wrapper" style="padding: 0px; margin: 0px; min-height:300px; text-align: center; background-color: rgb(255, 255, 255);">
<form>
<div id="divctnr"></div>
</form>
<div style="width:640px; height:40px; border-bottom:solid 1px #808080;text-align:center; float:left; clear:both; margin-top:15px;">
<input type="button" id="button1" name="button1" value="投票" οnclick="execVote()" style="display:none" />
</div>
</div>
<hr />
<div style="margin:auto; text-align:center; line-height:28px;">
云服务器:<a href="https://console.ng.bluemix.net/home/" target="_blank" title="IBM Bluemix 数字创新平台" style="">
IBM Bluemix 数字创新平台
</a><br />
服务提供:<a href="https://www.ibm.com/smarterplanet/us/en/ibmwatson/developercloud/language-translation/api/v2/#introduction" target="_blank" title="IBM Watson Developer Cloud" style="">
IBM Watson Developer Cloud
</a>
</div>
<div style="margin:auto; text-align:center; line-height:28px;">
<a href="http://blog.csdn.net/testcs_dn" target="_blank" title="无知人生,记录点滴 不积硅步,无以至千里;不积小流,无以成江海……" style="">
Powered by:testcs_dn(微wx笑)<br />
无知人生,记录点滴 不积硅步,无以至千里;不积小流,无以成江海……
</a>
</div>
<br /><br /><br />
<div id="divout"></div>
</body>
</html>
server.py 实现用户投票数据的加载和记录
import os #Python的标准库中的os模块包含普遍的操作系统功能
import re #引入正则表达式对象
import MySQLdb
import sys #提供了许多函数和变量来处理 Python 运行时环境的不同部分.
import cgi
#调试函数,用于输出对象的属性及属性值
def getAllAttrs(obj):
strAttrs = ''
for o in dir(obj):
strAttrs =strAttrs + o + ' := ' + str(getattr(obj,o)) + '<br />'
return strAttrs;
try:
from SimpleHTTPServer import SimpleHTTPRequestHandler as Handler
from SocketServer import TCPServer as Server
except ImportError:
from http.server import SimpleHTTPRequestHandler as Handler
from http.server import HTTPServer as Server
#自定义处理程序,用于处理HTTP请求
class TransHTTPHandler(Handler):
#处理GET请求
def do_GET(self):
#页面输出模板字符串
templateStr = '<html><head><title>pytrans</title></head><body>%s</body></html>'
# 将正则表达式编译成Pattern对象
pattern = re.compile(r'/voteinfo')
# 使用Pattern匹配文本,获得匹配结果,无法匹配时将返回None
match = pattern.match(self.path)
if match:
resContent = ''
try:
conn=MySQLdb.connect(host='us-cdbr-iron-east-04.cleardb.net',user='b7de4ass24234',passwd='6472',db='ad_fd4a422d117d69b',port=3306)
#conn=MySQLdb.connect(host='localhost',user='root',passwd='root',db='test',port=3306)
cur=conn.cursor()
cur.execute('SET NAMES UTF8')
cur.execute('SELECT * FROM vote_item')
rows = cur.fetchall()
rowIdx = 0
for row in rows:
rowIdx += 1;
resContent += "<div class=\"div_id\">" + str(rowIdx) + "</div>"
resContent += "<div class=\"div_item\">" + row[1] + "</div>"
resContent += "<div class=\"div_radio\"><input type=\"radio\" id=\"radio1\" name=\"radio1\" value=\"" + str(row[0]) + "\" /></div>"
resContent += "<div class=\"div_num\" id=\"div_num_" + str(row[0]) + "\">" + str(row[2]) + "</div>"
cur.close()
conn.close()
except MySQLdb.Error,e:
print "Mysql Error %d: %s" % (e.args[0], e.args[1])
self.protocal_version = 'HTTP/1.1' #设置协议版本
self.send_response(200) #设置响应状态码
self.send_header("Content-type", "text/html") #设置响应头
self.end_headers()
self.wfile.write(resContent) #输出响应内容
else:
#/voteinfo 之外的请求,交给底层去处理
if self.path == "":
self.path = '/index.html'
fStatic = self.send_head()
if fStatic:
try:
self.copyfile(fStatic, self.wfile)
finally:
fStatic.close()
#处理POST请求
def do_POST(self):
form = cgi.FieldStorage()
# 将正则表达式编译成Pattern对象
pattern = re.compile(r'/votesave')
# 使用Pattern匹配文本,获得匹配结果,无法匹配时将返回None
match = pattern.match(self.path)
datas = self.rfile.read(int(self.headers['content-length']))
ids = datas.split("=")
id = 0
if len(ids) == 2 :
id = int(ids[1])
print id
if match:
resContent = ''
try:
conn=MySQLdb.connect(host='us-cdbr-iron-east-04.cleardb.net',user='b7de345345b1f4',passwd='644234d2',db='ad_fd4a422d117d69b',port=3306)
#conn=MySQLdb.connect(host='localhost',user='root',passwd='root',db='test',port=3306)
cur=conn.cursor()
cur.execute("UPDATE vote_item SET vote_num=vote_num+1 WHERE id=" + str(id))
conn.commit()
cur.close()
conn.close()
except MySQLdb.Error,e:
print "Mysql Error %d: %s" % (e.args[0], e.args[1])
self.protocal_version = 'HTTP/1.1' #设置协议版本
self.send_response(200) #设置响应状态码
self.send_header("Content-type", "text/html") #设置响应头
self.end_headers()
self.wfile.write(resContent) #输出响应内容
else:
#/votesave 之外的请求,返回错误信息
self.protocal_version = 'HTTP/1.1' #设置协议版本
self.send_response(500) #设置响应状态码
self.send_header("Content-type", "text/html") #设置响应头
self.end_headers()
self.wfile.write("非法请求") #输出响应内容
# Read port selected by the cloud for our application
PORT = int(os.getenv('PORT', 8000))
# #改变当前目录到 static 目录
os.chdir('static')
httpd = Server(("", PORT), TransHTTPHandler)
try:
print("Start serving at port %i" % PORT)
httpd.serve_forever() ##设置一直监听并接收请求
except KeyboardInterrupt:
pass #按Ctrl+C退出服务
httpd.server_close()
步骤 5. 本地运行访问
运行
执行命令:python server.py
访问
启动调试后会自动打开浏览器窗口:
投票前:
步骤 6. 上传应用程序
登录到 Bluemix™ 后,可以使用 cf push 命令来上传应用程序。
- 1、安装 Cloud Foundry 命令行界面。
- 请根据自己使用的操作系统下载对应的版本;我使用的是Windows 7 64位操作系统,
- 下载Binaries版本的不需要安装,直接解压到Windows目录就可以了。
- 依次点击仪表板》jstrans(您创建的应用程序名称)》开始编码,可以查看属于自己的命令;如下图:
- 2、连接到 Bluemix。
- 打开命令提示符窗口:开始》运行,输入“cmd”,回车
- 执行:cf api https://api.ng.bluemix.net,如下图:
- 3、登录到 Bluemix。
- 注意,这里要换成对应你自己账户的命令!
cf login -u ivu4e@qq.com -o ivu4e@qq.com -s ivu4e
4、发出 cf push 命令时,cf 命令行界面将提供使用 buildpack 来构建并运行应用程序的 Bluemix 环境的工作目录。
步骤 7. 做个小小的测试
通过仪表板进入您刚刚创建的应用页面,点击左侧的概述,右侧顶部会显示:您的应用程序正在运行。
这时应用程序路径是带链接可以访问的,点击链接就可以访问刚刚发布的应用程序了。
运行效果:
结束语
这个小例子是使用原生的Python编写的,没使用Web开发框架(像:Django,Flask),所以过程中遇到一些曲折,代码看起来也有些笨拙。
通过IBM的Bluemix云平台,我们可以轻松的将自己的应用共享到网络上;
创建Web应用之后会自动获得一个用来访问应用的二级域名;
通过应用程序概述中的应用程序运行状况,可以方便的查看和管理应用运行状态;
这里通过一个小例子展示如何使用IBM的Bluemix云平台上提供的数据库服务,
如果您有更好的应用或想法,试试通过IBM的Bluemix云平台共享出来吧。