node-webkit鏈接mysql

1、安裝node.js mysql驅動庫javascript

  node-webkit裏面沒有mysql模塊的,咱們須要安裝mysql模塊。咱們可使用npm(Node package manager)進行安裝。這裏使用到的版本爲:"2.0.0-rc2"。安裝步驟以下:html

  一、打開cmd輸入命令:npm install -g mysql 回車,下載完成以後效果圖以下:java

  mysql下載的目錄爲C:\Users\user\AppData\Roaming\npm\node_modulesnode

2、編寫相關代碼mysql

  一、建立index.html文件,文件內容以下:web

 1 <html>
 2 <head>
 3 <title>Demo</title>  
 4 <meta http-equiv="Content-Type" content="text/html; charset=gbk" />
 5 <script type="text/javascript" src="script.js"></script> 
 6 </head> 
 7 <body >   
 8     name: <input type="text" id="name" /> password: <input type="text" id="password" />  <input type="button"  value="add" onclick="add();"/><br/>
 9     <div id="info"><div>  
10 
11 </body>
12 </html>

  二、建立script.js文件,文件內容以下:sql

  1 var mysql = require('./mysql');//加載數據庫模塊
  2 var TEST_DATABASE = 'nodejs_mysql_test';//數據庫名
  3 var TEST_TABLE = 'user';//表名
  4 var client ;
  5 var infodiv;
  6 
  7 window.onload = function (){    
  8     client = mysql.createConnection({  
  9         host : '127.0.0.1',  //主機地址
 10         user : 'root',  //數據庫用戶名
 11         password : '123456'//數據庫密碼
 12     }); 
 13     client.query('USE '+TEST_DATABASE);//使用該數據庫
 14     infodiv = document.getElementById("info"); 
 15        queryAll(); //查詢全部數據
 16 }
 17  
 18  //日期格式轉換
 19 Date.prototype.Format = function(fmt) 
 20 { 
 21   var o = { 
 22     "M+" : this.getMonth()+1,                  //月份 
 23     "d+" : this.getDate(),                     //
 24     "h+" : this.getHours(),                    //小時 
 25     "m+" : this.getMinutes(),                  //
 26     "s+" : this.getSeconds(),                  //
 27     "q+" : Math.floor((this.getMonth()+3)/3), //季度 
 28     "S"  : this.getMilliseconds()               //毫秒 
 29   };   
 30   if(/(y+)/.test(fmt)) 
 31     fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length)); 
 32   for(var k in o)  
 33     if(new RegExp("("+ k +")").test(fmt))  
 34   fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length))); 
 35   return fmt; 
 36 }
 37 
 38 //添加數據
 39 function add(){
 40     var name =  document.getElementById("name");
 41     var password = document.getElementById("password");
 42     var date = (new Date()).Format("yyyy-MM-dd hh:mm:ss");
 43     client.query('INSERT INTO '+TEST_TABLE+' SET username = ?, password = ?, created = ?',[name.value, password.value, date],function(err, results){
 44         if(results.insertId != null){
 45             alert("添加成功");
 46           }//返回記錄id
 47     });
 48     infodiv.innerHTML=""; 
 49     queryAll();
 50 }
 51 
 52 //查詢全部數據
 53 function queryAll(){
 54      client.query('select * from  '+TEST_TABLE,function(err, results){ 
 55         var info="id  &nbsp;&nbsp;username &nbsp; &nbsp; &nbsp;password&nbsp;  &nbsp;createdate</br>";
 56         for(var i = 0; i < results.length; i++){
 57             var person = results[i];
 58             var date=new Date(person.created);
 59             var dateStr = date.Format("yyyy-MM-dd");
 60             info += person.id + " &nbsp; &nbsp;" + person.username + " &nbsp; &nbsp;" + person.password + " &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;" +dateStr + "&nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<lable onclick='toremove("+person.id+");'>delete</lable> </br>";
 61         }
 62         infodiv.innerHTML=info; 
 63     }); 
 64 }
 65 
 66 //刪除數據
 67 function toremove(id){
 68     if(confirm("肯定刪除?")){
 69     client.query("delete from user where id = ?", [ id ], function(err, results) {//刪除id爲1的記錄
 70     var str = JSON.stringify(results);
 71   /**result 以下的信息
 72       {
 73           fieldCount: 0,
 74           affectedRows: 1,
 75           insertId: 0,
 76           serverStatus: 2,
 77           warningCount: 0,
 78           message: '',
 79           protocol41: true,
 80           changedRows: 0 
 81       }
 82   */    infodiv.innerHTML=""; 
 83         queryAll();
 84     });
 85 }
 86 }
 87 
 88 //修改數據
 89     /**client.query("update user set password = ? where id = ?", [ "123456", 4 ], function(err, results) {//修改id爲1的記錄的password
 90     var str = JSON.stringify(results);    
 91     alert(str);
 92 //  alert(results);  
 93   /** result 以下的信息
 94       {      fieldCount: 0,
 95           affectedRows: 1,
 96           insertId: 0,
 97           serverStatus: 2,
 98           warningCount: 0,
 99           message: '(Rows matched: 1  Changed: 1  Warnings: 0',
100           protocol41: true,
101           changedRows: 1 
102       }
103   
104 });  */
105  
106 client.end();//關閉鏈接

  三、package.json文件,文件內容以下:數據庫

1 {
2   "name": "nw-demo",
3   "main": "index.html"
4 }

  四、將C:\Users\user\AppData\Roaming\npm\node_modules目錄下的mysql目錄拷貝到與package.jsonindex.html等文件的相同目錄,然一塊兒壓縮成zip包,重命名爲mysql.nw。打包後的目錄結構以下圖所示:npm

五、將這個壓縮文件運行,可進行簡單的添加,刪除與查詢全部的功能。由於修改的功能有些繁瑣,這裏就沒有實現。可是script.js已經有相關的修改代碼,能夠根據那些代碼進行實現。運行後的界面以下圖所示:json

相關文章
相關標籤/搜索