{"id":18060331,"url":"https://github.com/unbug/js-middleware","last_synced_at":"2025-04-11T12:12:00.668Z","repository":{"id":49223952,"uuid":"88004968","full_name":"unbug/js-middleware","owner":"unbug","description":"Powerful Javascript Middleware Pattern Implementation, apply middleweares to any object.","archived":false,"fork":false,"pushed_at":"2021-06-22T21:49:30.000Z","size":565,"stargazers_count":53,"open_issues_count":4,"forks_count":5,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-03-25T08:38:13.997Z","etag":null,"topics":["javascript-middleware-pattern","js-middleware","middleware","middleware-functions","middleware-objects"],"latest_commit_sha":null,"homepage":"https://unbug.github.io/js-middleware/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/unbug.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-04-12T03:18:17.000Z","updated_at":"2024-02-15T17:25:59.000Z","dependencies_parsed_at":"2022-09-17T22:21:47.623Z","dependency_job_id":null,"html_url":"https://github.com/unbug/js-middleware","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unbug%2Fjs-middleware","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unbug%2Fjs-middleware/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unbug%2Fjs-middleware/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/unbug%2Fjs-middleware/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/unbug","download_url":"https://codeload.github.com/unbug/js-middleware/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248398369,"owners_count":21097291,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript-middleware-pattern","js-middleware","middleware","middleware-functions","middleware-objects"],"created_at":"2024-10-31T04:07:45.811Z","updated_at":"2025-04-11T12:12:00.649Z","avatar_url":"https://github.com/unbug.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# js-middleware\n\nPowerful Javascript Middleware Pattern implementation, apply middleweares to any object.\nA painless solution to make codes as scalable and maintainable as ReduxJS and ExpressJS.\n\n## Links\n - [Project overview](https://unbug.github.io/js-middleware/)\n - [Documentation](https://unbug.github.io/js-middleware/docs/html/)\n - [GitHub repo](https://github.com/unbug/js-middleware)\n\n# Overview\nMiddleware functions are functions that have access to the target function and it's arguments,\nand the target object and the next middleware function in the target function cycle.\nThe next middleware function is commonly denoted by a variable named next.\n\nMiddleware functions can perform the following tasks:\n  - Execute any code.\n  - Make changes to the function's arguments.\n  - End the target function.\n  - Call the next middleware in the stack.\n\n If the current middleware function does not end the target function cycle,\n it must call next() to pass control to the next middleware function. Otherwise,\n the target function will be left hanging.\n \n# Get started\n\n1. **window.MiddlewareManager** is available for browsers by include\n [`dist/middleware.min.js`](https://github.com/unbug/js-middleware/tree/master/dist) file in your HTML.\n```\n  \u003cscript src=\"middleware.min.js\"\u003e\u003c/script\u003e\n```\n2. Or install the package\n```\nnpm install --save js-middleware\n```\nand import it in your files\n```\nimport {MiddlewareManager} from 'js-middleware';\n```\n\n# Usages\n\n## Basic\nWe define a Person class.\n```\n// the target object\nclass Person {\n  // the target function\n  walk(step) {\n    this.step = step;\n  }\n  \n  speak(word) {\n    this.word = word;\n  }\n }\n```\nThen we define a middleware function to print log.\n\n```\n // middleware for walk function\n const logger = target =\u003e next =\u003e (...args) =\u003e {\n    console.log(`walk start, steps: ${args[0]}.`);\n    const result = next(...args);\n    console.log(`walk end.`);\n    return result;\n  }\n```\nNow we apply the log function as a middleware to a Person instance.\n\n```\n // apply middleware to target object\n const p = new Person();\n const middlewareManager = new MiddlewareManager(p);\n middlewareManager.use('walk', logger);\n p.walk(3);\n```\nWhenever a Person instance call it's walk method, we'll see logs from the looger middleware.\n\n## Middleware object\nWe can also apply a middleware object to a target object. Middleware object is an object that contains function's name as same as the target object's function name.\nFunction's name start or end with \"_\" will not be able to apply middleware.\n\n```\nconst PersonMiddleware = {\n  walk: target =\u003e next =\u003e step =\u003e {\n    console.log(`walk start, steps: step.`);\n    const result = next(step);\n    console.log(`walk end.`);\n    return result;\n  },\n  speak: target =\u003e next =\u003e word =\u003e {\n    word = 'this is a middleware trying to say: ' + word;\n    return next(word);\n  }\n}\n\n // apply middleware to target object\n const p = new Person();\n const middlewareManager = new MiddlewareManager(p);\n middlewareManager.use(PersonMiddleware);\n p.walk(3);\n p.speak('hi');\n```\n\n## middlewareMethods\nIn a class, function's name start or end with \"_\" will not be able to apply as middleware.\nOr we can use `middlewareMethods` to define function names for middleware target within a class.\n\n```\nclass PersonMiddleware {\n  constructor() {\n    /**\n     * Or Define function names for middleweare target.\n     * @type {Array}\n     */\n    this.middlewareMethods = ['walk', 'speak'];\n  }\n  // Function's name start or end with \"_\" will not be able to apply as middleware.\n  _getPrefix() {\n   return 'Middleware log: ';\n  }\n  log(text) {\n    console.log('Middleware log: ' + text);\n  }\n  walk(target) {\n    return next =\u003e step =\u003e {\n      this.log(`walk start, steps: step.`);\n      const result = next(step);\n      this.log(`walk end.`);\n      return result;\n    }\n  }\n  speak(target) {\n    return next =\u003e word =\u003e {\n      this.log('this is a middleware tring to say: ' + word);\n      return next(word);\n    }\n  }\n}\n\n // apply middleware to target object\n const p = new Person();\n const middlewareManager = new MiddlewareManager(p);\n middlewareManager.use(new PersonMiddleware())\n p.walk(3);\n p.speak('hi');\n```\n\n# APIs\n\n### .use(methodName, ...middlewares)\nApply (register) middleware functions to the target function or apply (register) middleware objects.\nIf the first argument is a middleware object, the rest arguments must be middleware objects.\n  - **{string|object}** methodName String for target function name, object for a middleware object.\n  - **{...function}** middlewares The middleware chain to be applied.\n  - return **{object}** this\n\n# Build\n1. Run `npm install` to install requirements.\n\n2. Run `gulp` to builds the library, generates `dist/middleware.js` as the core script, watches for file changes, \nstarts a HTTP server for debug.\n  ```\n  Usage\n    gulp [TASK] [OPTIONS...]\n  \n  Available tasks\n    build       Builds the library.\n    clean       Cleans files.\n    clean:dist  Cleans dist files.\n    clean:docs  Cleans docs files.\n    default    \n    docs        Builds documentation.\n    docs:html   Builds HTML documentation.\n    docs:md     Builds markdown documentation.\n    help        Display this help text.\n    lint        Lint JS files.\n    mini        Minify the library.\n    server      Starts a HTTP server for debug.\n    test        Run test cases.\n    watch       Watches for changes in files, re-lint, re-build \u0026 re-docs.\n   ```\n3. Run `gulp docs` to build docs. View markdown docs with `docs/API.md`, or run `gulp server` to start a HTTP server \nand view HTML docs with [localhost:3000/docs/html/](localhost:3000/docs/html/).\n   \n# Roadmap \u0026 Make contributions\n - Supports RegExp to match method names, pass the current method name as param to the current middleware.\n - **once(methodName, ...middlewares)** Apply middlewares only run once.\n - Be able to **unuse** middlewares.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Funbug%2Fjs-middleware","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Funbug%2Fjs-middleware","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Funbug%2Fjs-middleware/lists"}