目次
1. 系统分析
1.1 系统流程
1.2 系统任务
1.3 使用模块
1.4 最终效果
2. 创建程序的逻辑
3. 创建辅助函数发送HTML,创建表单,接收表单数据
4. 用MySQL添加数据
5. 删除MySQL数据
6. 更新MySQL数据
7. 获取MySQL数据
8. 渲染MySQL记录
9. 渲染HTML表单
10. 试一下
ホームページ データベース mysql チュートリアル 用MySQL构建一个工作跟踪流程_MySQL

用MySQL构建一个工作跟踪流程_MySQL

May 27, 2016 pm 01:45 PM
プロセス

为了了解在Node中如何使用MySQL,我们来看一个需要RDBMS的程序。
假设你要创建一个Web程序,用来记录你是如何度过工作日的。这需要记录工作的日期,花在工作上的时间,以及工作完成情况的描述。

1. 系统分析

1.1 系统流程

这个程序会有个表单,用来输入工作的详细信息,如图:
这里写图片描述
? 工作信息输入后,可以被归档或删除,让它不再显示在用来输入更多工作的输入域上方,如图。 点击“Archived Work”链接可以把之前归档的工作项全部显示出来。
这里写图片描述
?

1.2 系统任务

创建程序逻辑 创建程序工作所需的辅助函数 编写让你可以用MySQL添加、删除、更新和获取数据的函数 编写渲染HTML记录和表单的代码

1.3 使用模块

这个程序会用Node内置的http模块实现Web服务器的功能,用一个第三方模块跟MySQL服务器交互。一个名为timetrack的定制模块,它是程序特有的函数,用来在MySQL中存储、修改和获取数据。图5-4是这个程序的概览。
先用下面这条命令安装这个很受欢迎的MySQL Node模块:

<code class="npm hljs cmake">npm install mysql</code>
ログイン後にコピー

这里写图片描述
?

1.4 最终效果

最终结果如图5-5所示,一个可以用来记录所做工作的简单Web程序,还可以回顾、归档及删除工作记录。
这里写图片描述
?

2. 创建程序的逻辑

接下来需要创建两个文件存放程序逻辑。这个两个文件分别是: timetrack_server.js,用来启动程序; timetrack.js,包含程序相关功能的模块。
先创建timetrack_server.js,把代码清单5-7中的代码放到里面。这段代码包含Node的HTTPAPI,程序特定的逻辑以及MySQL API。根据你的MySQL配置填入host、 user和password这些设定值。

<code class="javascript hljs ">var http = require( &#39;http&#39; ) ;
var work = require( &#39;./lib/timetrack&#39; ) ;
var mysql = require( &#39;mysql&#39; ) ;

var db = mysql.createConnection( {
    host: &#39;127.0.0.1&#39;,
    user: &#39;root&#39;,
    password: &#39;root&#39;,
    database: &#39;timetrack&#39;
} ) ;</code>
ログイン後にコピー

接下来添加代码清单5-8中的逻辑,定义Web程序的行为。用这个程序可以浏览、添加和删除工作执行记录。此外还可以归档工作记录。被归档的工作记录不再出现在主页面上,但还可以在一个单独的Web页面上浏览。

<code class="javascript hljs ">var server = http.createServer( function (req, res) {
    switch ( req.method ) {
        case &#39;POST&#39;: {
            switch ( req.url ) {
                case &#39;/&#39;: {
                    work.add( db, req, res ) ;
                    break ;
                }
                case &#39;/archive&#39;: {
                    work.archive( db, req, res ) ;
                    break ;
                }
                case &#39;/delete&#39;: {
                    work.delete(db, req, res) ;
                    break ;
                }
            }
            break ;
        }

        case &#39;GET&#39;: {
            switch ( req.url ) {
                case &#39;/&#39;: {
                    work.show( db, res ) ;
                    break ;
                }
                case &#39;http://blog.csdn.net/archived&#39;: {
                    work.showArchived( db, res ) ;
                    break ;
                }
            }
            break ;
        }
    }
} ) ;</code>
ログイン後にコピー

代码清单5-9是timetrack_server.js中的最后一块代码。这段代码创建了一个数据库表(如果不存在的话) , 启动HTTP服务器,监听本机的3000端口。所有的node-mysql查询都用query函数执行。

<code class="javascript hljs ">db.query(
    &#39;create table if not exists work ( &#39; +
    &#39;id int(10) not null auto_increment, &#39; +
    &#39;hours decimal(5, 2) default 0, &#39; +
    &#39;date date, &#39; +
    &#39;archived int(1) default 0, &#39; +
    &#39;description longtext, &#39; +
    &#39;primary key(id) )&#39;,
    function (err) {
        if (err) throw err ;
        console.log( &#39;Server started...&#39; ) ;
        server.listen( 3000, &#39;127.0.0.1&#39; ) ;
    }
) ;</code>
ログイン後にコピー

3. 创建辅助函数发送HTML,创建表单,接收表单数据

启动程序的文件已经完成,该创建定义程序其他功能的文件了。创建一个名为lib的目录,然后在这个目录下创建文件timetrack.js。把代码清单5-10中的代码放到这个文件中,其中包含Node querystring API,并定义了辅助函数,用来发送Web页面HTML,接收通过表单提交的数据。

<code class="npm hljs cmake">npm install querystring</code>
ログイン後にコピー
<code class="javascript hljs ">var qs = require( &#39;querystring&#39; ) ;

exports.sendHtml = function (res, html) {
    res.setHeader( &#39;Content-Type&#39;, &#39;text/html&#39; ) ;
    res.setHeader( &#39;Content-Length&#39;, Buffer.byteLength( html ) ) ;
    res.end( html ) ;
} ;

exports.parseReceivedData = function (req, cb) {
    var body = &#39;&#39; ;
    req.setEncoding( &#39;utf8&#39; ) ;
    req.on( &#39;data&#39;, function (chunk) {
        body = chunk ;
    } ) ;
    req.on( &#39;end&#39;, function () {
        var data = qs.parse( body ) ;
        cb( data ) ;
    } ) ;
} ;

exports.actionForm = function (id, path, label) {
    var html = &#39;</code>
ログイン後にコピー
&#39; + &#39;<input name="id" type="hidden" value="' + id + '" />&#39; + &#39;<input type="submit" value="' +label+ '" />&#39; + &#39;
&#39; ; return html ; } ;

4. 用MySQL添加数据

辅助函数到位了,该编写往MySQL数据库里添加工作记录的代码了。把下面代码清单里的代码添加到timetrack.js中。

<code class="javascript hljs ">exports.add = function (db, req, res) {
    exports.parseReceivedData( req, function (work) {
        db.query(
            &#39;insert into work( hours, date, description ) &#39; +
            &#39;values ( ?, ?, ? )&#39;,
            [ work.hours, work.date, work.description ],
            function (err) {
                if (err) throw err ;
                exports.show( db, res ) ;
            }
        ) ;
    } ) ;
} ;</code>
ログイン後にコピー

注意上面代码中的问号(?),这是用来指明应该把参数放在哪里的占位符。在添加到查询语句中之前, query方法会自动把参数转义,以防遭受到SQL注入攻击。此外还要留意一下query方法的第二个参数,是一串用来替代占位符的值。

5. 删除MySQL数据

<code class="javascript hljs ">exports.delete = function (db, req, res) {
    exports.parseReceivedData(req, function (work) {
        db.query(
            &#39;delete from work where id = ?&#39;,
            [work.id],
            function (err) {
                if (err) throw err ;
                exports.show( db, res ) ;
            }
        ) ;
    } ) ;
} ;</code>
ログイン後にコピー

6. 更新MySQL数据

为了实现更新工作记录的逻辑,将它标记为已归档,把下面的代码添加到timetrack.js中。

<code class="javascript hljs ">exports.archive = function (db, req, res) {
    exports.parseReceivedData( req, function (work) {
        db.query(
            &#39;update work set archived = 1 where id = ?&#39;,
            [work.id],
            function (err) {
                if (err) throw err ;
                exports.show( db, res ) ;
            }
        ) ;
    } ) ;
} ;</code>
ログイン後にコピー

7. 获取MySQL数据

添加、删除、更新工作记录的逻辑已经定义好了,现在可以把代码清单5-14中的逻辑添加到到timetrack中,用来获取工作记录数据(归档的或未归档的),从而把它渲染为HTML。在发起查询时传入了一个回调函数,它的参数rows是用来保存返回的查询结果的。

<code class="javascript hljs ">exports.show = function (db, res, showArchived) {
    console.log( &#39;in show function&#39; ) ;
    var query = &#39;select * from work &#39; +
       &#39;where archived = ? &#39; +
       &#39;order by date desc &#39; ;
    var archiveValue = (showArchived) ? 1 : 0 ;
    console.log( &#39;archiveValue:&#39; + archiveValue ) ;
    db.query(
        query,
        [archiveValue],
        function (err, rows) {
            console.log( rows ) ;
            if (err) throw err ;
            html = (showArchived)
                ? &#39;&#39;
                : &#39;Archived Work
&#39; ;
            html += exports.workHitlistHtml( rows ) ;
            html += exports.workFormHtml() ;
            exports.sendHtml(res, html) ;
        }
    ) ;
} ;

exports.showArchived = function (db, res) {
    exports.show(db, res, true) ;
}</code>
ログイン後にコピー

8. 渲染MySQL记录

将下面代码清单中的代码添加到timetrack.js中。它会将工作记录渲染为HTML。

<code class="javascript hljs ">exports.workHitlistHtml = function (rows) {
    var html = &#39;&#39; ;
    for( var i in rows ) {
        html += &#39;&#39; ;
        html += &#39;&#39;
        html += &#39;&#39;
        html += &#39;&#39;
        if ( !rows[i].archived ) {
            html += &#39;&#39;
        }
        html += &#39;&#39; ;
    }
    html += &#39;</code>
ログイン後にコピー
&#39; + rows[i].date + &#39; &#39; + rows[i].hours + &#39; &#39; + rows[i].description + &#39; &#39; + exports.workArchiveForm( rows[ i ].id ) + &#39; &#39; +exports.workDeleteForm( rows[i].id )+ &#39;
&#39; ; return html ; } ;

9. 渲染HTML表单

<code class="javascript hljs ">exports.workFormHtml = function () {
   var html = &#39;</code>
ログイン後にコピー
&#39; + &#39;

Date (YYYY-MM-DD):<br /> <input name="date" type="text" />

&#39; + &#39;

Hours worked:<br /> <input name="hours" type="text" />

&#39; + &#39;

Description:
&#39; + &#39;

&#39; + &#39;&#39; + &#39;
&#39; ; return html ; } ; exports.workArchiveForm = function (id) { return exports.actionForm(id, '/archive', 'Archive') ; } ; exports.workDeleteForm = function (id) { return exports.actionForm( id, '/delete', 'Delete' ) ; } ;

10. 试一下

程序已经做完了,现在可以运行了。记得先用MySQL管理工具创建名为timetrack的数据库。然后在命令行中用下面的命令启动程序:

<code class="node hljs avrasm">node timetrack_server.js</code>
ログイン後にコピー

最后在浏览器中访问http://127.0.0.1:3000

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

複数の Toutiao アカウントを開くにはどうすればよいですか? Toutiao アカウントを申請するプロセスはどのようなものですか? 複数の Toutiao アカウントを開くにはどうすればよいですか? Toutiao アカウントを申請するプロセスはどのようなものですか? Mar 22, 2024 am 11:00 AM

モバイルインターネットの人気により、Toutiao は私の国で最も人気のあるニュース情報プラットフォームの 1 つになりました。多くのユーザーは、さまざまなニーズを満たすために Toutiao プラットフォームで複数のアカウントを持つことを望んでいます。では、複数の Toutiao アカウントを開くにはどうすればよいでしょうか?この記事ではToutiaoアカウントを複数開設する方法と申請手順を詳しく紹介します。 1. 複数の Toutiao アカウントを開くにはどうすればよいですか?複数の Toutiao アカウントを開設する方法は次のとおりです。 Toutiao プラットフォームでは、ユーザーはさまざまな携帯電話番号を使用してアカウントを登録できます。各携帯電話番号で登録できる Toutiao アカウントは 1 つだけです。つまり、ユーザーは複数の携帯電話番号を使用して複数のアカウントを登録できます。 2. 電子メール登録: 別の電子メール アドレスを使用して Toutiao アカウントを登録します。携帯電話番号の登録と同様に、各メール アドレスでも Toutiao アカウントを登録できます。 3. サードパーティのアカウントでログインします

Douyin スリープアンカーは儲かりますか?睡眠ライブストリーミングの具体的な手順は何ですか? Douyin スリープアンカーは儲かりますか?睡眠ライブストリーミングの具体的な手順は何ですか? Mar 21, 2024 pm 04:41 PM

今日のペースの速い社会では、睡眠の質の問題に悩まされる人がますます増えています。ユーザーの睡眠の質を向上させるために、特別な睡眠アンカーのグループがDouyinプラットフォームに登場しました。ライブ配信を通じてユーザーと交流し、睡眠のヒントを共有し、視聴者が安らかに眠りにつくのを助けるリラックスできる音楽やサウンドを提供します。では、このスリープアンカーは儲かるのだろうか?この記事ではこの問題に焦点を当てます。 1.Douyin スリープアンカーは儲かりますか? Douyin スリープアンカーは確かに一定の利益を得ることができます。まず、ライブ配信ルームの投げ銭機能を通じてギフトや送金を受け取ることができ、これらの特典はファンの数と視聴者の満足度によって異なります。次に、Douyin プラットフォームは、生放送の視聴数、いいね、シェア、その他のデータに基づいてアンカーに一定のシェアを与えます。一部のスリープアンカーは、

死の影を越えて崩壊したスタードーム鉄道のミッション攻略ガイド 死の影を越えて崩壊したスタードーム鉄道のミッション攻略ガイド Mar 28, 2024 pm 01:10 PM

崩壊したスタードーム鉄道で死の影を通過する場合はどうすればよいですか? Walking through the Shadow of Death は、メイン クエスト [Cat between Doves] の 1 つであり、メイン クエストの最終段階でもあります。以下では、編集者がこの Shadow of Death のミッションについて詳しく説明します。崩壊したスタードーム鉄道、興味のある方はぜひ見に来てください。 1. 前段階のプロットを完了すると、自動的に下の写真の場所に移動します。3 月 7 と会話した後、ダンジョンに入場します。チームを結成することを忘れないでください。 2. バックアッププランは戦うことです。 [ストーン ハート テン] 奇妙な砂金、4 つのチームで構成されます。最高のキャラクター戦術とフィニッシュ スキルはグループ攻撃であり、盾と牛乳を持参するのが最善です。この [ストーン ハート テン] 奇妙な砂金はヒットするのが困難です。サイコロを振って、得点が砂金より多ければ負けません、終了後は必殺技の量が全回復します、それ以下だと負けますので頑張ってください。グループ攻撃キャラクターを連れてポイントを獲得します。上司で

php-fpmリクエスト処理プロセスの詳細な説明と最適化戦略 php-fpmリクエスト処理プロセスの詳細な説明と最適化戦略 Jul 07, 2023 pm 01:52 PM

php-fpm リクエスト処理プロセスの詳細な説明と最適化戦略 1. はじめに Web アプリケーション開発において、PHP は非常に人気のあるサーバーサイド スクリプト言語です。 php-fpm (FastCGIProcessManager) は PHP のマネージャーであり、PHP リクエストを処理するために使用されます。この記事では、php-fpm のリクエスト処理プロセスを詳しく紹介し、php-fpm を最適化して Web アプリケーションのパフォーマンスを向上させる方法について説明します。 2. php-fpmリクエスト処理プロセス クライアントがリクエストを開始したとき

崩壊した星鉄道の悲しい物語のすべて ミッション攻略ガイド 崩壊した星鉄道の悲しい物語のすべて ミッション攻略ガイド Mar 28, 2024 pm 01:26 PM

崩壊したスタードーム鉄道の悲しい物語をどうするか? All Sad Stories はメイン クエスト [Cat between Pigeons] の一部です。この段階のプロセスは比較的長いです。以下では、編集者が崩壊したスター ドーム鉄道の All Sad Stories クエストについて詳しく説明します。友達、ぜひ参加してください。一見。 1. 前のステージを完了すると、自動的に 2 番目の新しいマップ [クローク映画テレビ公園] に移動します。1 [ピンボール マシン] から 2 の場所までミッションを進め、3 番目のキャラクターをフォローします。プロットを作成し、4番目の位置の子供に話しかけ、ミニゲーム[スピードとナッツ]を完了します。天天クールランに似たミニゲームは非常に簡単です。 3. 次に、追跡タスクは、下の写真の位置 1 [ピンボール マシン] から位置 2 まで飛行することです 4. 下の写真の位置に到着したら、迷路を歩く必要があります。右に歩くとタスクポイント 15 に到達します。

Vue 開発経験の共有: 開発プロセスと作業効率の最適化に関する経験 Vue 開発経験の共有: 開発プロセスと作業効率の最適化に関する経験 Nov 22, 2023 am 10:53 AM

Vue.js は、ユーザー インターフェイスやシングルページ アプリケーションを構築するための人気のある JavaScript フレームワークです。その簡潔な構文、柔軟性、強力な機能により、多くの開発者の最初の選択肢となっています。最近のプロジェクト開発において、私のチームと私は開発プロセスと作業効率の最適化に関して経験を蓄積してきましたので、それを皆さんと共有したいと思います。まず、Vue.js 開発の基礎として、Vue.js のエコシステムと中心となる概念を完全に理解する必要があります。 Vue.js の中核となる概念には、データ駆動型システムとコンポーネント システムが含まれます

Java言語によるソフトウェア開発プロセスの紹介 Java言語によるソフトウェア開発プロセスの紹介 Jun 10, 2023 am 11:07 AM

Java 言語は広く使用されているオブジェクト指向プログラミング言語であり、エンタープライズ レベルのソフトウェア開発で広く使用されています。 Java 言語では、ソフトウェア開発プロセスは非常に重要な部分であり、開発チームがソフトウェア開発タスクをより効率的に完了するのに役立ちます。この記事では、Java 言語でのソフトウェア開発プロセスを紹介し、各段階で完了する必要があるタスクについて説明します。要件分析フェーズ ソフトウェア開発の最初のステップは、ソフトウェア要件を決定することを目的とした要件分析を実行することです。 Java 言語での要件分析フェーズ中に、開発チームは次のことを行う必要があります。

PHP を使用してビッグ データ アプリケーションを構築する基本プロセス PHP を使用してビッグ データ アプリケーションを構築する基本プロセス May 11, 2023 pm 04:58 PM

近年、データ量の爆発的な増加に伴い、ビッグデータアプリケーションの需要が高まっています。 PHP は人気のあるプログラミング言語として Web 開発で広く使用されており、ビッグ データ アプリケーションの構築にも使用できます。この記事では、データの処理、保存、分析など、PHP を使用してビッグ データ アプリケーションを構築する基本的なプロセスを紹介します。 1. データ処理 データ処理はビッグデータ活用の最初のステップであり、その目的は、さまざまなソースからデータを収集し、保管、分析、使用するための前処理とクリーニングを行うことです。 PHPが使える

See all articles