Table des matières
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. 试一下
Maison base de données tutoriel 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="language-npm hljs cmake">npm install mysql</code>
Copier après la connexion

这里写图片描述
?

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="language-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>
Copier après la connexion

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

<code class="language-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>
Copier après la connexion

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

<code class="language-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>
Copier après la connexion

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

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

<code class="language-npm hljs cmake">npm install querystring</code>
Copier après la connexion
<code class="language-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>
Copier après la connexion
&#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="language-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>
Copier après la connexion

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

5. 删除MySQL数据

<code class="language-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>
Copier après la connexion

6. 更新MySQL数据

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

<code class="language-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>
Copier après la connexion

7. 获取MySQL数据

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

<code class="language-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>
Copier après la connexion

8. 渲染MySQL记录

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

<code class="language-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>
Copier après la connexion
&#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="language-javascript hljs ">exports.workFormHtml = function () {
   var html = &#39;</code>
Copier après la connexion
&#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="language-node hljs avrasm">node timetrack_server.js</code>
Copier après la connexion

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

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment ouvrir plusieurs comptes Toutiao ? Quelle est la démarche pour demander un compte Toutiao ? Comment ouvrir plusieurs comptes Toutiao ? Quelle est la démarche pour demander un compte Toutiao ? Mar 22, 2024 am 11:00 AM

Avec la popularité de l'Internet mobile, Toutiao est devenue l'une des plateformes d'information les plus populaires de Chine. De nombreux utilisateurs espèrent disposer de plusieurs comptes sur la plateforme Toutiao pour répondre à différents besoins. Alors, comment ouvrir plusieurs comptes Toutiao ? Cet article présentera en détail la méthode et le processus de demande d'ouverture de plusieurs comptes Toutiao. 1. Comment ouvrir plusieurs comptes Toutiao ? La méthode d'ouverture de plusieurs comptes Toutiao est la suivante : Sur la plateforme Toutiao, les utilisateurs peuvent enregistrer des comptes via différents numéros de téléphone mobile. Chaque numéro de téléphone mobile ne peut enregistrer qu'un seul compte Toutiao, ce qui signifie que les utilisateurs peuvent utiliser plusieurs numéros de téléphone mobile pour enregistrer plusieurs comptes. 2. Inscription par e-mail : utilisez différentes adresses e-mail pour enregistrer un compte Toutiao. Semblable à l'enregistrement d'un numéro de téléphone mobile, chaque adresse e-mail peut également enregistrer un compte Toutiao. 3. Connectez-vous avec un compte tiers

Les ancres de sommeil Douyin sont-elles rentables ? Quelles sont les procédures spécifiques à la diffusion en direct du sommeil ? Les ancres de sommeil Douyin sont-elles rentables ? Quelles sont les procédures spécifiques à la diffusion en direct du sommeil ? Mar 21, 2024 pm 04:41 PM

Dans la société actuelle en évolution rapide, les problèmes de qualité du sommeil touchent de plus en plus de personnes. Afin d'améliorer la qualité du sommeil des utilisateurs, un groupe d'ancres de sommeil spéciales est apparu sur la plateforme Douyin. Ils interagissent avec les utilisateurs via des diffusions en direct, partagent des conseils sur le sommeil et proposent de la musique et des sons relaxants pour aider les téléspectateurs à s'endormir paisiblement. Alors, ces ancres de sommeil sont-elles rentables ? Cet article se concentrera sur cette question. 1. Les ancres de sommeil Douyin sont-elles rentables ? Les ancres de sommeil Douyin peuvent en effet gagner certains bénéfices. Premièrement, ils peuvent recevoir des cadeaux et des transferts grâce à la fonction de pourboire dans la salle de diffusion en direct, et ces avantages dépendent de leur nombre de fans et de la satisfaction du public. Deuxièmement, la plateforme Douyin attribuera au présentateur une certaine part en fonction du nombre de vues, de likes, de partages et d'autres données de la diffusion en direct. Certaines ancres de sommeil seront également

Le guide de stratégie de mission pour le chemin de fer Collapsed Star Dome à travers l'Ombre de la Mort Le guide de stratégie de mission pour le chemin de fer Collapsed Star Dome à travers l'Ombre de la Mort Mar 28, 2024 pm 01:10 PM

Que faire lorsque vous voyagez à travers l'Ombre de la Mort sur le chemin de fer effondré du Star Dome ? Marcher à travers l'Ombre de la Mort est l'une des quêtes principales [Chat parmi les colombes], et c'est aussi la dernière étape de la quête principale. Ci-dessous, l'éditeur fournira une explication détaillée de la mission de Marcher à travers l'Ombre de la Mort sur. le chemin de fer Collapsed Star Dome, pour ceux qui sont intéressés, venez y jeter un œil. 1. Après avoir terminé l'étape précédente de l'intrigue, vous serez automatiquement transféré à l'emplacement illustré ci-dessous. Après avoir parlé au 7 mars, vous entrerez dans le donjon. 2. Le plan de sauvegarde est de combattre. [Stone Heart Ten] Weird Placer Gold, avec quatre équipes. Les meilleures tactiques de personnage et compétences de finition sont les attaques de groupe, et il est préférable d'apporter un bouclier et du lait. Cet étrange sable d'or [Stone Heart Ten] est difficile à frapper. En lançant les dés, si vos points sont supérieurs à l'or du sable, vous ne serez pas battu. Et après la fin, le nombre de compétences de finition sera entièrement restauré s'il est inférieur à cela, vous serez battu, alors essayez de le faire. amenez un personnage d'attaque de groupe pour obtenir des points. chez le patron

Toutes les tristes histoires du guide stratégique de la mission Collapsed Star Railroad Toutes les tristes histoires du guide stratégique de la mission Collapsed Star Railroad Mar 28, 2024 pm 01:26 PM

Que faire de toutes les tristes histoires de l’effondrement du Star Dome Railway ? All Sad Stories fait partie de la quête principale [Chat parmi les colombes]. Le processus à ce stade est relativement long. Ci-dessous, l'éditeur fournira une explication détaillée de la quête All Sad Stories sur le chemin de fer Collapsed Star Dome. un regard. 1. Après avoir terminé l'étape précédente, vous serez automatiquement transféré vers la deuxième nouvelle carte [Cloak Film and Television Park]. Suivez la mission jusqu'au 1er [Pinball Machine] jusqu'au 2ème emplacement et suivez le troisième personnage. intrigue, allez dans Parlez à l'enfant en 4ème position et terminez le mini-jeu [Speed ​​​​and Nuts]. Un mini-jeu similaire à Tiantian Cool Run est très simple. 3. Ensuite, la tâche de suivi consiste à voler de la position 1 [flipper] dans l'image ci-dessous à la position 2. 4. Après être arrivé à la position dans l'image ci-dessous, vous devez traverser le labyrinthe. Après être entré par la gauche, continuez. marcher vers la droite pour atteindre le point de tâche 15.

Explication détaillée et stratégie d'optimisation du processus de traitement des requêtes php-fpm Explication détaillée et stratégie d'optimisation du processus de traitement des requêtes php-fpm Jul 07, 2023 pm 01:52 PM

Explication détaillée et stratégie d'optimisation du processus de traitement des requêtes php-fpm 1. Introduction Dans le développement d'applications Web, PHP est un langage de script côté serveur très populaire. Et php-fpm (FastCGIProcessManager) est un gestionnaire PHP, utilisé pour traiter les requêtes PHP. Cet article présentera en détail le processus de traitement des requêtes de php-fpm et expliquera comment optimiser php-fpm et améliorer les performances des applications Web. 2. php-fpm Processus de traitement des demandes Lorsque le client lance une demande

Partage d'expériences de développement Vue : expérience dans l'optimisation du processus de développement et de l'efficacité du travail Partage d'expériences de développement Vue : expérience dans l'optimisation du processus de développement et de l'efficacité du travail Nov 22, 2023 am 10:53 AM

Vue.js est un framework JavaScript populaire pour créer des interfaces utilisateur et des applications monopage. Sa syntaxe concise, sa flexibilité et ses fonctions puissantes en font le premier choix de nombreux développeurs. Lors du développement récent de projets, mon équipe et moi avons accumulé une certaine expérience dans l'optimisation des processus de développement et de l'efficacité du travail, que nous aimerions partager avec vous. Tout d'abord, comme base du développement de Vue.js, nous devons pleinement comprendre l'écosystème et les concepts fondamentaux de Vue.js. Les concepts de base de Vue.js incluent des systèmes basés sur les données et des composants

Introduction au processus de développement de logiciels en langage Java Introduction au processus de développement de logiciels en langage Java Jun 10, 2023 am 11:07 AM

Le langage Java est un langage de programmation orienté objet largement utilisé dans le développement de logiciels au niveau de l'entreprise. Dans le langage Java, le processus de développement logiciel est une partie très importante, qui peut aider l'équipe de développement à accomplir les tâches de développement logiciel plus efficacement. Cet article présentera le processus de développement logiciel en langage Java et discutera des tâches à accomplir à chaque étape. Phase d'analyse des exigences La première étape du développement de logiciels consiste à effectuer une analyse des exigences, qui vise à déterminer les exigences logicielles. Lors de la phase d'analyse des besoins en langage Java, l'équipe de développement a besoin

Processus de base de création d'applications Big Data à l'aide de PHP Processus de base de création d'applications Big Data à l'aide de PHP May 11, 2023 pm 04:58 PM

Ces dernières années, avec la croissance explosive du volume de données, la demande d’applications Big Data a augmenté. En tant que langage de programmation populaire, PHP est largement utilisé dans le développement Web et peut également être utilisé pour créer des applications Big Data. Cet article présentera le processus de base de création d'applications Big Data à l'aide de PHP, y compris le traitement, le stockage et l'analyse des données. 1. Traitement des données Le traitement des données est la première étape de l'application du Big Data. Son objectif est de collecter des données provenant de diverses sources et d'effectuer un traitement et un nettoyage préliminaires pour le stockage, l'analyse et l'utilisation. PHP peut être utilisé

See all articles