egg.js+vueプロジェクト

26881 ワード

前言
このプロジェクトを書く理由:PHPに基づいてVueのバックグラウンドを書いたことがあります.ここをクリックすると(thinkPHP 5.1に基づいて書かれたVueのバックグラウンド)、言語を変えて似たようなバックグラウンドを書いて、ここをクリックして(node.jsのegg.jsフレームワーク開発に基づいて)見ることができます.目的は純粋に個人の興味で、各言語で各言語の間にどのような優位性があるかを探して、後で仕事の中で必要な時に多くの選択があるようにしたいです.
eggでjsの重要な原因は、内蔵マルチプロセスとミリ秒レベルのタイミングタスクが気に入ったからです.内蔵マルチプロセスはpm 2を使用する必要はありません(egg-clusterマルチプロセスモジュールのデフォルトは、サーバのコアCPUがどれだけ起動しているかによって、このようなworkerプロセスがどれだけ起動しているかに基づいています).内蔵ミリ秒レベルのタイミングタスクは、多くの騒々しい操作を迅速に実現することができます.
仮に君がegg.jsの構造はすでにある程度理解して、よく知らないものは公式サイトのドキュメントに行って見ます
次は私個人のeggです.jsフレームワークはピットを登る場所の理解に注意して、ピットを登っているあなたが直接私が作成した基礎demoに基づいて開発することができることを助ける必要があります.MongoDB/MySQL/Redisなどのプラグインが含まれています.
一、egg.jsのpost要求404
この穴、上手な人は第一歩でconfig/configで安全防犯を無効にする必要があると思います.default.jsには次のような言葉が加わっています.
  config.security = {
    csrf: { //     
      enable: false
    },
  };

方式2:ユーザー構成に書く
const userConfig = {
    // myAppName: 'egg',
    security: {
      csrf: {
        enable: false,
      },
    },
};

フロントエンドリクエストインタフェースがこのファイルにドメイン間で次のコードを追加することを防止したい場合(userConfigにも書くことができます):
cors: {
  origin: '*',
  allowMethods: 'GET,HEAD,PUT,POST,DELETE,PATCH',
},

二、カスタムミドルウェア
コントローラやサービス、ルーティング、モデルは何も言うことはありませんが、他のMVCフレームワークと同じです.このフレームワークのミドルウェアの実装方式はexpressとは少し異なり、公式にはegg.jsはKoaというフレームワークに基づいて
ExpressがRequestとResponseの2つのオブジェクトのみであるのとは異なり、Koaは今回要求されたコンテキストオブジェクトとしてContextのオブジェクトを追加した(Koa 1ではミドルウェアのthis、Koa 2ではミドルウェアの最初のパラメータとして入力される).1回のリクエストに関連するコンテキストをこのオブジェクトにマウントできます.traceIdのような要求全体(後続の任意の場所で他の呼び出しを行うには使用する必要がある)を貫く必要がある属性は、マウントできます.requestやresponseよりも意味に合っています.
同時にContextにもRequestとResponseの2つのオブジェクトがマウントされています.Expressと同様に、この2つのオブジェクトは、開発を支援する多くの便利な方法を提供しています.例えば、
get request.query get request.hostname set response.body set response.status
express私も使っていますが、個人的に使って感じてみると、違いはこの点です.
1回のリクエストに関連するコンテキストをこのオブジェクトにマウントできます.traceIdのような要求全体を貫く必要がある(後続の任意の場所で他の呼び出しを行うには使用する必要がある)属性は、マウントできます.
くだらないことは言わないで、直接demoを書いてconfig/config.default.jsに追加:
  config.middleware = [
    'test', //    test
  ];
  config.test = {
    enable: true, // test     
    // enable: false, // test     true     ,  false ,   router           
  };

新しいapp/middleware/test.jsファイル、middlewareディレクトリの下のすべてのjsファイルは、定義したミドルウェア名と同じでなければなりません.そうしないと、エラーが発生します.test.jsファイルコード:
module.exports = () => { //    test
  return async function (ctx, next) {
    await next();
    //       
    let timeToDate = new Date().toLocaleString();
    console.log(timeToDate);
  }
};

ルーティングファイルrouter.jsでは指定したルーティングにミドルウェアを単独で追加できます
'use strict';

/**
 * @param {Egg.Application} app - egg application
 */
module.exports = app => {
  const {router, controller, middleware} = app;

  //--------------------------------------------------
  //    
  //--------------------------------------------------
  const test = middleware.test();

  router.get('/:id', controller.home.index);
  router.post('/test', test, controller.test.test); //           
  router.post('/api/posts', controller.post.create);
};

三、プラグインの使用
MySQLを例にとると、ORM操作が統合されているため、egg-sequelizeプラグインを使用することをお勧めします.MySQL、PostgreSQL、SQLite、MSSQLなどの複数のデータソースをサポートします.
まず、ローカル/サーバにデータベース環境があることを確認します.
インストール
npm install --save egg-sequelize mysql2

config/plugin.jsにegg-sequelizeプラグインを導入
  module.exports = {
  	//   egg-sequelize mysql2
	sequelize: {
	  enable: true,
	  package: 'egg-sequelize',
	}
}

config/config.default.jsでsequelize構成を記述する
方法1:
 module.exports = appInfo => {
   const config = exports = {};
   // MySQL  
   config.sequelize = {
     dialect: 'mysql',
     host: '127.0.0.1',
     port: 3306,
     username: 'root',
     password: 'xxx',
     database: 'xxx',
   };
   return {
     ...config
   };
}

方式2:
const userConfig = {
    // myAppName: 'egg',
    //               
    sequelize: {
      sync: true, // whether sync when app init
      dialect: 'mysql',
      host: '127.0.0.1',
      port: '3306',
      database: 'egg_sequelize_dev',
      username: 'xxx',
      password: 'xxx',
    }
}

四、構造関数の使用
このフレームワークはコンストラクション関数を使用しないと、次のコードを定義するのによく使用されます.
const { ctx } = this;

クラスファイルにコンストラクション関数を追加すると、重複コードを書く必要はありません.
  //     
  constructor(ctx) {
    super(ctx); //               ,       ,       `this.ctx`   。
    //         this.ctx    ctx  
    //         this.app    app  
  }


これはサービス/userです.jsに書いてある
const Service = require('egg').Service;

class UserService extends Service {
  //     
  constructor(ctx) {
    super(ctx); //               ,       ,       `this.ctx`   。
    //         this.ctx    ctx  
    //         this.app    app  
  }

  /**
   *   id      
   * @param id
   * @return {Promise}
   */
  async getUserById(id) {
    // const { ctx } = this;
    let userInfo = {};
    try {
      userInfo = await this.ctx.model.User.findAll({
        where: { id },
        //        ,                     ,             
        raw: true,
        attributes:["id","name","age"], //       
      });
    } catch (err) {
      this.ctx.logger.error(err);
    }
    return userInfo;
  }

  //   id    
  async update(id) {
    console.log(id)
    let result = {};
    try {
      result = await this.ctx.model.User.update({
        age: 20
      }, {
        where: {
          id: id
        }
      });
    } catch (err) {
      this.ctx.logger.error(err);
    }
    return result;
  }
}

module.exports = UserService;


次にctx、appなどを定義する必要がなくなり、thisを直接使用します.app,this.ctxでいい
五、定時任務
フレームワーク自体がミリ秒レベルのタイミングタスクをサポートすることも重要です
スケジュールタスクはschedule/taskに書きます.js里
module.exports = {
  schedule: {
    interval: '1s', // 1s  ,     ms,     1,   1      
    type: 'all', //       worker      
  },
  async task(ctx) {
    console.log(new Date()) //       
  },
};

六、フレームワークの拡張
アシスタント関数のようなメソッドフレームワーク自体の内蔵サポートを追加することができます:Application Context Request Response Helper拡張ファイルはapp/extend/xxxに配置されています.js
例:app/extend/helper.js
module.exports = {
  //       
  parseInt(string) {
    if (typeof string === 'number') return string;
    if (!string) return string;
    return parseInt(string) || 0;
  }
}

使用方法:
async destroy() {
   const {ctx} = this;
   const {params, service, helper} = ctx;
   const id = helper.parseInt(params.id); //     
   await service.wbUrl.destroy(id);
   ctx.status = 200;
   ctx.body = {
       code: 0,
       success: true,
   };
}

前に穴を登ったときは記録していませんでしたが、もう登ったのに記録が必要な場所が思い出せませんでした.後でeggを使います.jsが出会った問題はすべて記録して、もし私たちがここで出会ったら、あなたの問題も投げ出してください.私たちは一緒に研究して解決します.