104 | "API_ENDPOINTS": 'http://127.0.0.1:3001',
105 | //API Proxies for multiple api endpoints with different prefix in router
106 | "API_ENDPOINTS": {
107 | //set a default prefix
108 | "defaultPrefix": "/prefix",
109 | //e.g http://127.0.0.1:3000/prefix/api/login -->proxy to--> http://127.0.0.1:3001/api/login
110 | "/prefix": "http://127.0.0.1:3001",
111 | "/prefix2": "http://127.0.0.1:3002",
112 | }
113 | }
114 | ```
115 |
116 | #### Environment Variables and Configuration
117 |
118 | All the variables in `app-config.js` can be set with Environment Variables, which have higher priority than `app-config.js`.
119 | e.g:
120 | `> NODE_ENV=production npm start`
121 | or
122 | ```bash
123 | export PORT=3001
124 | export NODE_ENV=production
125 | npm start
126 | ```
127 | You can also use `.env` file to config envs
128 |
129 | #### Default `config.default.[dev|prod].js` in `config` dir
130 |
131 | The project comes with default config files just like `app-config.js.sample`, which will be used if `app-config.js` above is not provided.
132 |
133 | > Priority: *Environment Variables* > .env > *app-config.js* > *config.default.[dev|prod].js*
134 |
135 | ### Logs
136 | The builtin `services/logger.js` provides some default log functionality for your app.
137 | By default, the manual log(calling like `logger.info()`) will be put into `./logs/app.log` file,
138 | and the http requests will be put into `./logs/requests.log`,
139 | both will also be logged to console.
140 | For more options, checkout the [pino](https://github.com/pinojs/pino).
141 |
142 | ```javascript
143 | //use the default logger
144 | const { logger, Logger } = require('../services/logger');
145 | logger.info('message');
146 | logger.error(new Error('test error'));
147 | //create custom logger, log into a different file
148 | const pino = require('pino');
149 | //the 2nd params for the constructor is for only for pino options
150 | const mylogger = new Logger({destination: pino.destination('./logs/my-log.log')}, {});
151 | mylogger.info('my log message');
152 | ```
153 |
154 | ### Production Deployment
155 |
156 | Deploy your app to production is extremely simple with only one npm script command, you can provide couple of options for different deployment phases(e.g: install, build, start server),
157 | [pm2](https://github.com/Unitech/pm2) inside is used as node process manager.
158 | > Global installation of PM2 is not required now, we will use the locally installed pm2, but if you want to use `pm2` cmd everywhere, you may still want to install it globally
159 |
160 |
161 | #### Usage
162 |
163 | `npm run deploy -- [skipInstall] [skipBuild] [skipServer]`
164 | The last three options are boolean values in `0`(or empty, false) and `1`(true).
165 |
166 | #### Examples:
167 |
168 | - `npm run deploy`: no options provided, defaults to do all the tasks.
169 | - `npm run deploy -- 1`: same as `npm run deploy:noinstall` as an alias, this will skip the `npm install --no-shrinkwrap`, and just go to build and start server.
170 | - `npm run deploy -- 1 0 1`: which will only build your assets
171 | - `npm run deploy -- 1 1 0`: which will just start node server, useful when all assets were built on a different machine.
172 |
173 | > You may need to create/update the `deploy.sh` to meet your own needs.
174 |
175 | ### Powered By
176 |
177 | 
178 |
179 | ### LICENSE
180 |
181 | MIT @ 2016-present [jason](http://blog.lovemily.me)
182 |
--------------------------------------------------------------------------------
/services/ServerRenderer.js:
--------------------------------------------------------------------------------
1 | const fs = require('fs');
2 | const path = require('path');
3 | const { Transform } = require('stream');
4 | const { minify } = require('html-minifier');
5 |
6 | const config = require('../config/env');
7 | const { logger } = require('./logger');
8 |
9 | const Cache = require('./Cache');
10 |
11 | const isSSREnabled = config.isSSREnabled();
12 | const isHMREnabled = config.isHMREnabled();
13 | const DEV_MODE = config.isDevMode();
14 | const isCSSModules = config.isCSSModules();
15 |
16 | let indexHtml = '';
17 | let s;
18 |
19 | if (isSSREnabled) {
20 | if (isCSSModules) {
21 | logger.warn(
22 | 'When SSR is enabled, [CSS_MODULES] should be disabled for now, you can manually add plugin like "isomorphic-style-loader" to enable both SSR and CSS Modules',
23 | );
24 | }
25 | const SSR = require('../build/node/main');
26 | s = new SSR();
27 | } else if (!isHMREnabled) {
28 | indexHtml = readIndexHtml();
29 | }
30 |
31 | function readIndexHtml() {
32 | let ret = '';
33 | try {
34 | ret = fs.readFileSync(path.join(__dirname, `../build/app/index.html`), {
35 | encoding: 'utf-8',
36 | });
37 | } catch (e) {
38 | logger.warn('failed to read build/app/index.html...');
39 | }
40 | return ret;
41 | }
42 |
43 | /**
44 | * Renderer to render React SSR contents or just static html in koa app's routes
45 | * @param {Object<{
46 | * ssr: boolean,
47 | * stream: boolean,
48 | * cache: ./Cache,
49 | * }>} options
50 | * @param {boolean} options.ssr - enable/disable SSR manually, if provided, will use the app config
51 | * @param {boolean} options.stream - instance of custom Cache
52 | * @param {boolean|Cache} options.cache - enable/disable SSR cache manually, if provided with true, will use a default Cache, or you can provide your own Cache instance
53 | * @see ./Cache
54 | */
55 | class ServerRenderer {
56 | constructor(options = {}) {
57 | this.ssrEnabled = options.hasOwnProperty('ssr')
58 | ? !!options.ssr
59 | : isSSREnabled;
60 |
61 | this.cache = null;
62 | if (options.cache && options.cache instanceof Cache) {
63 | this.cache = options.cache;
64 | } else if (this.ssrEnabled && options.cache === true) {
65 | this.cache = new Cache(options);
66 | }
67 | this.cacheDisabled = !this.cache;
68 | this.streaming = !!options.stream || !!options.streaming;
69 | }
70 |
71 | /**
72 | * Check if SSR is enabled
73 | * @return {boolean|*}
74 | */
75 | isSSREnabled() {
76 | return this.ssrEnabled;
77 | }
78 |
79 | /**
80 | * Render static html content or Server side rendering components
81 | * @param {object} ctx koa ctx
82 | * @param {object=} data initial data
83 | * @param {Boolean=} streaming whether to user streaming api or not
84 | */
85 | render(ctx, data = {}, streaming) {
86 | if (!this.ssrEnabled) {
87 | ctx.body = this.genHtml('', {}, ctx);
88 | return;
89 | }
90 |
91 | this.renderSSR(ctx, data, streaming);
92 | }
93 |
94 | /**
95 | * Render content from cache
96 | * @param key {string} cache key
97 | * @param ctx {object} koa ctx object
98 | */
99 | renderFromCache(key, ctx) {
100 | logger.info('Rendering content from cache...');
101 | this.setHtmlContentType(ctx);
102 | ctx.body = this.cache.get(key);
103 | }
104 |
105 | /**
106 | * Server side rendering components
107 | * @param {object} ctx koa ctx
108 | * @param {object=} data initial data
109 | * @param {Boolean=} streaming whether to user streaming api or not
110 | */
111 | renderSSR(ctx, data = {}, streaming = this.streaming) {
112 | this.setHtmlContentType(ctx);
113 |
114 | if (!this.cacheDisabled && this.isCacheMatched(ctx.path)) {
115 | this.renderFromCache(ctx.path, ctx);
116 | return;
117 | }
118 |
119 | if (!streaming) {
120 | logger.info('-----> Use React SSR Sync API!');
121 | const rendered = s.render(ctx.url, data);
122 | rendered.initialData = data;
123 | ctx.body = this.genHtml(rendered.html, rendered, ctx);
124 | return;
125 | }
126 | logger.info('-----> Use React SSR Streaming API!');
127 | //use streaming api
128 | const rendered = s.renderWithStream(ctx.url, data);
129 | rendered.initialData = data;
130 | this.genHtmlStream(rendered.htmlStream, rendered, ctx);
131 | }
132 |
133 | /**
134 | * Generate static html from component
135 | * @param {string=} html SSRed html
136 | * @param {object=} extra extra info from SSR#render()
137 | * @param {object} ctx koa ctx object
138 | * @return {string} final html content
139 | */
140 | genHtml(html, extra = {}, ctx) {
141 | if (!this.ssrEnabled) {
142 | if (!indexHtml) {
143 | indexHtml = readIndexHtml();
144 | }
145 | if (!DEV_MODE) {
146 | return indexHtml;
147 | }
148 | indexHtml = readIndexHtml();
149 | return indexHtml;
150 | }
151 |
152 | let ret = `
153 |
154 |
155 |
156 |
157 |
158 | ${extra.title || 'React App'}
159 |
160 | ${extra.linkTags}
161 | ${extra.styleTags}
162 |
163 |
164 | ${html}
165 |
168 | ${extra.scriptTags}
169 |
170 |
171 | `;
172 | ret = this.minifyHtml(ret);
173 | this.cache && this.cache.set(ctx.path, ret);
174 | return ret;
175 | }
176 | /**
177 | * Generate html in stream
178 | * @param nodeStreamFromReact
179 | * @param extra
180 | * @param ctx
181 | */
182 | genHtmlStream(nodeStreamFromReact, extra = {}, ctx) {
183 | const res = ctx.res;
184 | ctx.status = 200;
185 | ctx.respond = false;
186 |
187 | let cacheStream = this.createCacheStream(ctx.path);
188 | cacheStream.pipe(res, { end: false });
189 |
190 | const before = `
191 |
192 |
193 |
194 |
195 |
196 | ${extra.title || 'React App'}
197 |
198 | ${extra.styleTags}
199 |
200 | `;
201 | cacheStream.write(before);
202 | // res.write(before);
203 |
204 | nodeStreamFromReact.pipe(
205 | // res,
206 | cacheStream,
207 | { end: false },
208 | );
209 |
210 | nodeStreamFromReact.on('end', () => {
211 | logger.info('nodeStreamFromReact end');
212 | logger.info('start streaming rest html content...');
213 | const after = `
214 |
217 | ${extra.extractor.getScriptTags()}
218 |
219 | `;
220 | // res.end(after);
221 |
222 | cacheStream.write(after);
223 | logger.info('streaming rest html content done!');
224 | res.end();
225 | cacheStream.end();
226 | });
227 | }
228 |
229 | /**
230 | *
231 | * @param {String} key for now it's ctx.url
232 | */
233 | createCacheStream(key) {
234 | logger.info(`Creating cache stream for ${key}`);
235 | const bufferedChunks = [];
236 | const self = this;
237 | return new Transform({
238 | // transform() is called with each chunk of data
239 | transform(data, enc, cb) {
240 | // We store the chunk of data (which is a Buffer) in memory
241 | bufferedChunks.push(data);
242 | // Then pass the data unchanged onwards to the next stream
243 | cb(null, data);
244 | },
245 |
246 | // flush() is called when everything is done
247 | flush(cb) {
248 | // We concatenate all the buffered chunks of HTML to get the full HTML
249 | // then cache it at "key"
250 | if (!self.cacheDisabled && self.cache) {
251 | self.cache.set(
252 | key,
253 | self.minifyHtml(Buffer.concat(bufferedChunks).toString()),
254 | );
255 | logger.info(`Cache stream for [${key}] finished!`);
256 | }
257 | cb();
258 | },
259 | });
260 | }
261 |
262 | /**
263 | * Check if provided key being found in the current cache pool
264 | * @param key
265 | * @return {boolean}
266 | */
267 | isCacheMatched(key) {
268 | if (this.cache && this.cache.has(key)) {
269 | logger.info(`Cache for [${key}] matched!`);
270 | return true;
271 | }
272 | return false;
273 | }
274 |
275 | /**
276 | * Set content-type for rendered html
277 | * @param ctx {object} koa ctx
278 | */
279 | setHtmlContentType(ctx) {
280 | ctx.set({
281 | 'Content-Type': 'text/html; charset=UTF-8',
282 | });
283 | }
284 |
285 | minifyHtml(html) {
286 | if (DEV_MODE) {
287 | return html;
288 | }
289 | return minify(html, { collapseWhitespace: true });
290 | }
291 | }
292 |
293 | module.exports = ServerRenderer;
294 |
--------------------------------------------------------------------------------
/services/HttpClient.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Proxy/Send requests to backend or other endpoints
3 | */
4 |
5 | const got = require('got');
6 | const tunnel = require('tunnel');
7 | const SocksProxyAgent = require('socks-proxy-agent');
8 | const { URL } = require('url');
9 | const util = require('util');
10 | const { logger } = require('./logger');
11 | const appConfig = require('../config/env');
12 | const { HTTP_METHOD } = require('./http-config');
13 | const isCustomAPIPrefix = appConfig.isCustomAPIPrefix();
14 | const httpProxy = appConfig.getHttpProxy();
15 | const socksProxy = appConfig.getSocksProxy();
16 | const debugLevel = appConfig.getProxyDebugLevel();
17 |
18 | const DEBUG_LEVEL = {
19 | NONE: 0,
20 | PLAIN: 1,
21 | VERBOSE: 2,
22 | };
23 |
24 | const LOG_LEVEL = {
25 | INFO: 'info',
26 | WARN: 'warn',
27 | ERROR: 'error',
28 | };
29 |
30 | /**
31 | * proxy global default got options
32 | */
33 | const defaultRequestOptions = {
34 | throwHttpErrors: false,
35 | };
36 |
37 | /**
38 | * Proxy for apis or other http requests
39 | */
40 | class HttpClient {
41 | /**
42 | *
43 | * @param {object=} options - Proxy instance options
44 | * {
45 | * endPoint: string, //endpoint for the instance, e.g: http://domain.com
46 | * prefix: string, //extra prefix for url path
47 | * debugLevel: number, //default based on the global app config
48 | * }
49 | * @param {object=} gotOptions - default options for "got" module
50 | */
51 | constructor(options = {}, gotOptions = {}) {
52 | this.endPoint = options.endPoint || '';
53 | this.endPointHost = '';
54 | this.endPointParsedUrl = {};
55 | if (this.endPoint) {
56 | this.endPointParsedUrl = new URL(this.endPoint);
57 | this.endPointHost = this.endPointParsedUrl.host;
58 | }
59 | this.useFormData = options.useForm === true;
60 | this.useJsonResponse = options.jsonResponse !== false;
61 | const clientBaseOptions = {
62 | prefixUrl: this.endPoint,
63 | };
64 | const agent = this._getAgent();
65 | if (agent) {
66 | clientBaseOptions.agent = agent;
67 | }
68 | this.options = options;
69 | this.got = got.extend(
70 | Object.assign(clientBaseOptions, defaultRequestOptions, gotOptions),
71 | );
72 | this.debugLevel = options.debugLevel || debugLevel;
73 | }
74 |
75 | /**
76 | * Get the http agent for proxying or requesting,
77 | * NOTE: when use https endpoint, you may need to set "NODE_TLS_REJECT_UNAUTHORIZED=0" node option
78 | * with self signed certificate to bypass the TLS check
79 | * @return {*}
80 | * @private
81 | */
82 | _getAgent() {
83 | let agent;
84 | //Simple proxy tunnel
85 | if (socksProxy) {
86 | const socksProtocol = 'socks:';
87 | agent = new SocksProxyAgent(
88 | String(socksProxy).startsWith(socksProtocol)
89 | ? socksProxy
90 | : `${socksProtocol}//${socksProxy}`,
91 | );
92 | agent = { http: agent };
93 | } else if (httpProxy) {
94 | const parsedUrl = new URL(httpProxy);
95 | const tunnelOptions = {
96 | proxy: {
97 | host: parsedUrl.hostname,
98 | port: parsedUrl.port,
99 | },
100 | };
101 | agent =
102 | this.endPointParsedUrl.protocol === 'https:'
103 | ? { https: tunnel.httpsOverHttp(tunnelOptions) }
104 | : { http: tunnel.httpOverHttp(tunnelOptions) };
105 | }
106 | return agent;
107 | }
108 |
109 | /**
110 | * Customize real options for destination
111 | * @param ctx
112 | * @param options
113 | * @return {object}
114 | */
115 | _prepareRequestOptions(ctx, options = { headers: {} }) {
116 | options.method = ctx.method;
117 | options.headers = Object.assign({}, ctx.headers, options.headers);
118 | return this._finalizeRequestOptions(ctx.url, options);
119 | }
120 |
121 | /**
122 | * Proxy koa http request to another endpoint
123 | * @param ctx - koa ctx
124 | * @param opts - request options
125 | * @return {Stream}
126 | */
127 | proxyRequest(ctx, opts = {}) {
128 | let requestStream;
129 | const { url, options } = this._prepareRequestOptions(ctx, opts);
130 | // console.log('opts: ', opts);
131 | requestStream = ctx.req.pipe(this.got.stream(url, options));
132 | if (this.debugLevel) {
133 | this.handleProxyEvents(requestStream);
134 | }
135 | requestStream.on('error', (error, body) => {
136 | this._log(null, error, LOG_LEVEL.ERROR);
137 | this._log(`response body: ${JSON.stringify(body)}`);
138 | });
139 | return requestStream;
140 | }
141 |
142 | handleProxyEvents(requestStream) {
143 | let chunks = [];
144 | let gotOptions = {};
145 | let gotResponse;
146 | requestStream.on('response', (response) => {
147 | gotResponse = response;
148 | const request = response.request;
149 | if (request) {
150 | gotOptions = request.options;
151 | this._log(
152 | `[${response.url}] request options: \n${util.inspect(
153 | request.options,
154 | )}`,
155 | );
156 | }
157 | this._log(
158 | `[${response.url}] response headers: \n${util.inspect(
159 | response.headers,
160 | )}`,
161 | );
162 | });
163 |
164 | if (this.debugLevel > DEBUG_LEVEL.PLAIN) {
165 | requestStream.on('data', (chunk) => {
166 | chunks.push(chunk);
167 | });
168 | requestStream.on('end', () => {
169 | const ret = Buffer.concat(chunks);
170 | const type = gotResponse.headers['content-type'];
171 | if (this._isPlainTextBody(type)) {
172 | this._log(
173 | `[${gotOptions.method}][${
174 | gotResponse.url
175 | }] response body: ${ret.toString()}`,
176 | );
177 | } else {
178 | this._log(
179 | `[${gotOptions.method}][${gotResponse.url}] response body[${type}] length: ${ret.length}`,
180 | );
181 | }
182 | });
183 | }
184 | }
185 |
186 | /**
187 | * Send http requests
188 | * @param requestUrl
189 | * @param opts
190 | * @return {Promise}
191 | */
192 | async sendRequest(requestUrl, opts = {}) {
193 | const { url, options } = this._finalizeRequestOptions(requestUrl, opts);
194 | // console.log('opts: ', opts);
195 | let ret = {};
196 | try {
197 | if (this.useJsonResponse) {
198 | ret = await this.got(url, options).json();
199 | } else {
200 | const response = await this.got(url, opts);
201 | ret = response.body;
202 | }
203 | } catch (err) {
204 | this._log(null, err, LOG_LEVEL.ERROR);
205 | return Promise.reject(err);
206 | }
207 | return Promise.resolve(ret);
208 | }
209 |
210 | /**
211 | * Proxy logger
212 | * @param {*=} msg - log message
213 | * @param {Error=} error - the Error instance
214 | * @param {string=} level - log level
215 | */
216 | _log(msg, error, level = LOG_LEVEL.INFO) {
217 | msg && logger[level](msg);
218 | error && logger[level](error.stack);
219 | }
220 |
221 | /**
222 | * Throw an exception
223 | * @param msg
224 | */
225 | _exception(msg) {
226 | throw new Error(msg);
227 | }
228 |
229 | get(url, query, options = {}) {
230 | options.method = HTTP_METHOD.GET;
231 | if (query) {
232 | options.searchParams = query;
233 | }
234 | return this.sendRequest(url, options);
235 | }
236 |
237 | post(url, body, options = {}) {
238 | return this.sendRequestWithBody(url, body, HTTP_METHOD.POST, options);
239 | }
240 |
241 | put(url, body, options = {}) {
242 | return this.sendRequestWithBody(url, body, HTTP_METHOD.PUT, options);
243 | }
244 |
245 | patch(url, body, options = {}) {
246 | return this.sendRequestWithBody(url, body, HTTP_METHOD.PATCH, options);
247 | }
248 |
249 | delete(url, options = {}) {
250 | options.method = HTTP_METHOD.DELETE;
251 | return this.sendRequest(url, options);
252 | }
253 |
254 | sendRequestWithBody(url, body, method, options = {}) {
255 | this._normalizeBodyContentType(body, options);
256 | options.method = method;
257 | return this.sendRequest(url, options);
258 | }
259 |
260 | /**
261 | * Normalize body for the upcoming request
262 | * @param data - body data
263 | * @param options - to which the body data will be attached
264 | * @return {object}
265 | */
266 | _normalizeBodyContentType(data, options = {}) {
267 | if (this.useFormData) {
268 | options.form = data;
269 | options.json = undefined;
270 | } else {
271 | options.json = data;
272 | options.form = undefined;
273 | }
274 | // options.body = data;
275 | return options;
276 | }
277 |
278 | /**
279 | * Get final request options
280 | * @param url
281 | * @param options - custom options
282 | * @return {object<{url, options}>} final request options
283 | */
284 | _finalizeRequestOptions(url, options = {}) {
285 | let optionPrefix = options.prefix || this.options.prefix;
286 | if (typeof url === 'string' && isCustomAPIPrefix && optionPrefix) {
287 | url = url.replace(new RegExp(`^${optionPrefix}/?`), '');
288 | }
289 | if (!options.headers) {
290 | options.headers = {};
291 | }
292 | if (this.endPointHost) {
293 | options.headers.host = this.endPointHost;
294 | }
295 | return {
296 | url,
297 | options,
298 | };
299 | }
300 |
301 | _isPlainTextBody(contentType) {
302 | if (!contentType) return true;
303 | return !!(
304 | contentType.startsWith('text/') ||
305 | contentType.startsWith('application/json')
306 | );
307 | }
308 | }
309 |
310 | exports.HttpClient = HttpClient;
311 |
--------------------------------------------------------------------------------
/__tests__/server/koa.router.js:
--------------------------------------------------------------------------------
1 | const shell = require('shelljs');
2 | const path = require('path');
3 | const fs = require('fs');
4 | const util = require('util');
5 | const supertest = require('supertest');
6 | const cheerio = require('cheerio');
7 | const makeDir = require('make-dir');
8 | const getPort = require('get-port');
9 | makeDir.sync(path.join(__dirname, '../../build'));
10 | const { startJSONServer, XAccessToken } = require('../../mocks/server');
11 | const { genMD5 } = require('../../utils/hash');
12 | const testConfig = {
13 | NODE_ENV: 'development',
14 | NODE_PROXY: true,
15 | HTTP_PROXY: '',
16 | PROXY_DEBUG_LEVEL: 0,
17 | STATIC_ENDPOINT: '',
18 | LOG_PATH: '',
19 | STATIC_PREFIX: '/static',
20 | PREFIX_TRAILING_SLASH: true,
21 | APP_PREFIX: '',
22 | CUSTOM_API_PREFIX: true,
23 | ENABLE_HMR: false,
24 | ENABLE_SSR: false,
25 | INLINE_STYLES: false,
26 | CSS_MODULES: false,
27 | HMR_PORT: 12333,
28 | API_ENDPOINTS: {
29 | defaultPrefix: '/api-proxy',
30 | '/api-proxy': 'http://127.0.0.1:3001',
31 | '/api-proxy2': 'http://127.0.0.1:3002',
32 | },
33 | };
34 |
35 | let jsonServerPort;
36 | let server2Port;
37 | let config;
38 | let app;
39 | let endPoints;
40 | let defaultEndpointKey;
41 | let defaultPrefix;
42 | const configPath = path.join(__dirname, '../../build/app-config.js');
43 | process.env.NODE_CONFIG_PATH = configPath;
44 |
45 | beforeAll(async () => {
46 | jsonServerPort = await getPort();
47 | server2Port = await getPort();
48 | testConfig.API_ENDPOINTS = {
49 | defaultPrefix: '/api-proxy',
50 | '/api-proxy': `http://127.0.0.1:${jsonServerPort}`,
51 | '/api-proxy2': `http://127.0.0.1:${server2Port}`,
52 | };
53 |
54 | fs.writeFileSync(configPath, `module.exports=${util.inspect(testConfig)}`);
55 | console.log('building assets...');
56 | shell.exec(`NODE_CONFIG_PATH=${configPath} npm run build:dev`, {
57 | silent: true,
58 | });
59 | config = require('../../config/env');
60 | app = require('../../app');
61 | endPoints = config.getApiEndPoints('API_ENDPOINTS');
62 | defaultEndpointKey = config.getDefaultApiEndPointKey();
63 | defaultPrefix = endPoints[defaultEndpointKey];
64 | });
65 |
66 | describe('normal routes', () => {
67 | let server;
68 | beforeAll(async () => {
69 | const koaApp = await app.create();
70 | // server = supertest(koaApp.callback());
71 | // server = supertest.agent(app.listen(koaApp));
72 | server = supertest.agent(koaApp.callback());
73 | });
74 |
75 | /*afterAll(async () => {
76 | await wait(500);
77 | return new Promise((resolve) => {
78 | server.app.close(() => {
79 | console.log('server closed');
80 | resolve();
81 | });
82 | });
83 | });*/
84 |
85 | test('get home page', async () => {
86 | // const response = await supertest(requestHandler).get('/');
87 | const response = await server.get('/');
88 | const $ = cheerio.load(response.text);
89 | expect(response.status).toEqual(200);
90 | expect(response.header['cache-control']).toBe('no-cache');
91 | expect($('#app').length).toBe(1);
92 | });
93 |
94 | test('multipart upload', async () => {
95 | const response = await server
96 | .post('/upload')
97 | .attach('image', path.join(__dirname, '../../src/assets/static/logo.svg'))
98 | .field({
99 | name: 'jason',
100 | });
101 | expect(response.status).toEqual(200);
102 | expect(response.body).toHaveProperty('body.name');
103 | expect(response.body).toHaveProperty('files.image');
104 | });
105 |
106 | /*test('get github branches', async () => {
107 | // const response = await supertest(requestHandler).get('/github');
108 | const response = await server.get('/github');
109 | const $ = cheerio.load(response.text);
110 | const branches = $('#app .github-wrapper > ul > li');
111 | // console.log('branches.length: ', branches.length);
112 | expect(branches.length).toBeGreaterThan(0);
113 | });*/
114 | });
115 |
116 | describe('request proxying', () => {
117 | let server;
118 | // let proxyServer2;
119 | // let jsonServer;
120 | let profileUrl;
121 | const newPostId = String(Date.now());
122 | beforeAll(async () => {
123 | await startJSONServer(jsonServerPort);
124 | const apps = await Promise.all([app.create(), app.create()]);
125 | server = supertest.agent(apps[0].callback());
126 | supertest.agent(app.listen(apps[1], server2Port));
127 | profileUrl = `${defaultPrefix}/profile`;
128 | });
129 |
130 | /*afterAll(done => {
131 | console.log('closing jsonServer...');
132 | jsonServer.close(() => {
133 | console.log('close jsonServer done');
134 | done();
135 | });
136 | });*/
137 |
138 | test('check passed headers and returned headers', async () => {
139 | const response = await server
140 | .get(profileUrl)
141 | .set(XAccessToken, 'some_token');
142 | // console.log('response.header: ', response.header);
143 | expect(response.header).toHaveProperty(
144 | `${XAccessToken}-back`,
145 | 'some_token',
146 | );
147 | expect(response.header).toHaveProperty('x-powered-by', 'Express');
148 | });
149 |
150 | test('get profile', async () => {
151 | const response = await server.get(profileUrl);
152 | // console.log('response.body: ', response.body);
153 | // console.log('response.header: ', response.header);
154 | expect(response.status).toEqual(200);
155 | expect(response.body).toHaveProperty('name', 'jason');
156 | });
157 |
158 | test('get posts', async () => {
159 | const response = await server
160 | .get(`${defaultPrefix}/posts`)
161 | .query({ id: 1 });
162 | expect(response.body.length).toEqual(1);
163 | expect(response.body[0]).toHaveProperty('id', 1);
164 | });
165 |
166 | test('post a post', async () => {
167 | const response = await server.post(`${defaultPrefix}/posts`).send({
168 | id: newPostId,
169 | title: `koa-json-server_${Date.now()}`,
170 | author: 'jason2',
171 | });
172 | const response2 = await server
173 | .get(`${defaultPrefix}/posts`)
174 | .query({ id: newPostId });
175 | expect(response.status).toEqual(201);
176 | expect(response.ok).toEqual(true);
177 | expect(response2.body[0]).toHaveProperty('id', newPostId);
178 | });
179 | test('put a post', async () => {
180 | const response = await server
181 | .put(`${defaultPrefix}/posts/${newPostId}`)
182 | .send({
183 | title: `json-server_${Date.now()}`,
184 | author: 'jason',
185 | });
186 | const response2 = await server
187 | .get(`${defaultPrefix}/posts`)
188 | .query({ id: newPostId });
189 | expect(response.ok).toEqual(true);
190 | expect(response2.body[0]).toHaveProperty('author', 'jason');
191 | });
192 | test('patch a post', async () => {
193 | const response = await server
194 | .patch(`${defaultPrefix}/posts/${newPostId}`)
195 | .send({
196 | author: 'jason2',
197 | });
198 | const response2 = await server
199 | .get(`${defaultPrefix}/posts`)
200 | .query({ id: newPostId });
201 | expect(response.ok).toEqual(true);
202 | expect(response2.body[0]).toHaveProperty('author', 'jason2');
203 | });
204 | test('delete a post', async () => {
205 | const response = await server.delete(`${defaultPrefix}/posts/${newPostId}`);
206 | const response2 = await server
207 | .get(`${defaultPrefix}/posts`)
208 | .query({ id: newPostId });
209 | expect(response.ok).toEqual(true);
210 | expect(response2.body).toHaveLength(0);
211 | });
212 |
213 | /**
214 | * app-config.js config:
215 | * API_ENDPOINTS: {
216 | defaultPrefix: '/api-proxy',
217 | '/api-proxy': 'http://127.0.0.1:3001',
218 | '/api-proxy2': 'http://127.0.0.1:3002',
219 | },
220 | */
221 | test('upload proxying', async () => {
222 | const response = await server
223 | .post('/api-proxy2/upload?a=b')
224 | .attach('image', path.join(__dirname, '../../src/assets/static/logo.svg'))
225 | .field({
226 | name: 'jason',
227 | });
228 | expect(response.status).toEqual(200);
229 | expect(response.body).toHaveProperty('body.name');
230 | expect(response.body).toHaveProperty('files.image');
231 | });
232 | test('download proxying', async () => {
233 | const fileBuffer = fs.readFileSync(
234 | path.join(__dirname, '../../build/app/assets/static/favicon.ico'),
235 | );
236 | const originalFileHash = genMD5(fileBuffer);
237 | return new Promise((resolve, reject) => {
238 | const writePath = path.join(__dirname, '../../build/favicon.ico');
239 | const writeStream = fs.createWriteStream(writePath);
240 | writeStream.on('finish', () => {
241 | const downloadHash = genMD5(fs.readFileSync(writePath));
242 | expect(downloadHash).toBe(originalFileHash);
243 | resolve();
244 | });
245 | writeStream.on('error', (err) => {
246 | reject(err);
247 | });
248 | server
249 | .get('/api-proxy2/static/assets/static/favicon.ico')
250 | .pipe(writeStream);
251 | });
252 | });
253 |
254 | test('proxying 400 response', async () => {
255 | const response = await server.get('/api-proxy2/400');
256 | expect(response.status).toEqual(400);
257 | expect(response.body).toHaveProperty('msg', '400');
258 | });
259 |
260 | test('proxying 400 response with post', async () => {
261 | const response = await server
262 | .post('/api-proxy2/400')
263 | .send({ name: 'jason' });
264 | expect(response.status).toEqual(400);
265 | expect(response.body).toHaveProperty('msg', '400');
266 | expect(response.body.data).toEqual({ name: 'jason' });
267 | });
268 |
269 | test('proxying 500 response', async () => {
270 | const response = await server.get('/api-proxy2/500');
271 | expect(response.status).toEqual(500);
272 | });
273 | });
274 |
--------------------------------------------------------------------------------
/src/modules/Request.js:
--------------------------------------------------------------------------------
1 | import isEmpty from 'lodash.isempty';
2 | import {
3 | api,
4 | formatRestfulUrl,
5 | numberOfRestParams,
6 | } from '../../api/api-config';
7 | import {
8 | HEADER,
9 | BODY_TYPE,
10 | isJSONResponse,
11 | HTTP_METHOD,
12 | } from '../../services/http-config';
13 | import env from './env';
14 |
15 | const CONTENT_TYPE_JSON = BODY_TYPE.JSON;
16 | const CONTENT_TYPE_FORM_URL_ENCODED = BODY_TYPE.FORM_URL_ENCODED;
17 |
18 | const defaultOptions = {
19 | credentials: 'same-origin',
20 | };
21 |
22 | function jsonResponseHandler(data) {
23 | return Promise.resolve(data);
24 | }
25 |
26 | /**
27 | * Send api requests
28 | * @param {object<{
29 | * noPrefix: boolean,
30 | * apiPrefix: string,
31 | * form: boolean
32 | * }>} options - you can provide other options, which will be passed to fetch api
33 | * @param {boolean} options.noPrefix - if there is prefix for the instance
34 | * @param {string} options.apiPrefix - prefix for the instance if "noPrefix" is false
35 | * @param {boolean} options.form - if true, body is "x-www-form-urlencoded", otherwise "json"
36 | * @return {Request}
37 | */
38 | class Request {
39 | constructor(options = {}) {
40 | if (!(this instanceof Request)) {
41 | return new Request(options);
42 | }
43 |
44 | this.jsonResponseHandler = jsonResponseHandler.bind(this);
45 |
46 | //no api prefix for the instance
47 | this.noPrefix = !!options.noPrefix;
48 | //set default api prefix
49 | this.apiPrefix = options.apiPrefix || (this.noPrefix ? '' : env.apiPrefix);
50 |
51 | const ops = { ...defaultOptions };
52 |
53 | this.formURLEncoded = !!options.form;
54 |
55 | ops.headers = {
56 | [HEADER.CONTENT_TYPE]: this.formURLEncoded
57 | ? CONTENT_TYPE_FORM_URL_ENCODED
58 | : CONTENT_TYPE_JSON,
59 | };
60 |
61 | if (!isEmpty(options) && !isEmpty(options.headers)) {
62 | ops.headers = Object.assign({}, ops.headers, options.headers);
63 | delete options.headers;
64 | }
65 | //set custom fetch options for the instance
66 | this.options = Object.assign(ops, options);
67 | }
68 |
69 | static isPlainUrl(url) {
70 | return 'string' === typeof url;
71 | }
72 |
73 | /**
74 | * Send request now
75 | * @param {string|object} pathname - if provided object, see demo in "api-config.js"
76 | * @param {object} options
77 | * {
78 | * noPrefix: true, //if there is prefix for this single request, default based on the instance's "noPrefix"
79 | * qs: {}, //extra query string for the request
80 | * restParams: [Array|Object], //params in pathname, @see formatRestfulUrl
81 | * ...fetch_api_related_options,
82 | * }
83 | * @see https://github.com/github/fetch
84 | * @see https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch
85 | * @return {Promise}
86 | */
87 | async sendRequest(pathname, options = {}) {
88 | let url = pathname;
89 | url = Request.isPlainUrl(url) ? url : url.path;
90 | const originalUrl = url;
91 | //normalize rest params
92 | url = this.normalizeRestfulParams(url, options);
93 | //normalize prefix
94 | if (!options.noPrefix && !this.noPrefix) {
95 | url = this.getUrlWithPrefix(url);
96 | options.hasOwnProperty('noPrefix') && (options.noPrefix = undefined);
97 | }
98 | //normalize query string
99 | if (!isEmpty(options.qs)) {
100 | url = this.addQueryString(url, options.qs, undefined, false);
101 | }
102 | //normalize headers
103 | const headers = {};
104 | const defaultHeaders = this.options.headers;
105 | Object.assign(headers, defaultHeaders, options.headers);
106 | options.headers = undefined;
107 | const apiOptions = Object.assign({}, this.options, options, { headers });
108 | if (apiOptions.multipart) {
109 | delete apiOptions.headers[HEADER.CONTENT_TYPE];
110 | }
111 | const response = await fetch(url, apiOptions);
112 | if (!response.ok) {
113 | console.error(
114 | `[koa-web-kit]:[API-ERROR]-[${response.status}]-[${originalUrl}]`,
115 | );
116 | return Promise.reject(response);
117 | }
118 | if (response.status === 204) {
119 | return Promise.resolve();
120 | }
121 | if (isJSONResponse(response)) {
122 | return response
123 | .json()
124 | .catch((err) => {
125 | console.error(err);
126 | return {};
127 | })
128 | .then((data) => this.jsonResponseHandler(data, apiOptions));
129 | }
130 | return Promise.resolve(response);
131 | }
132 |
133 | /**
134 | * Add query to the current url
135 | * @param {string} url - current url
136 | * @param {object} query - query object which will be added
137 | * @param {string=} baseUrl - baseUrl
138 | * @param {boolean=} noHost - return the url without the host, default true
139 | * @return {string} - new url string
140 | */
141 | addQueryString(url, query, baseUrl = location.origin, noHost = true) {
142 | if (isEmpty(query)) return url;
143 | const obj = new URL(url, baseUrl);
144 | for (const key of Object.keys(query)) {
145 | obj.searchParams.append(key, query[key]);
146 | }
147 | if (!noHost) {
148 | return obj.toString();
149 | }
150 |
151 | return `${obj.pathname}${obj.search}${obj.hash}`;
152 | }
153 |
154 | /**
155 | * Get method
156 | * @param {string|object} url api url config, when in object:
157 | * ```
158 | * {
159 | * path: 'url',
160 | * prefix: '/proxy-1', //prefix for the url
161 | * }
162 | * ```
163 | * @param {object=} querystring - query strings in object
164 | * @param {object=} options
165 | * @return {Promise}
166 | */
167 | get(url, querystring = {}, options = {}) {
168 | const getOptions = Object.assign(
169 | {
170 | method: HTTP_METHOD.GET,
171 | qs: querystring,
172 | },
173 | options,
174 | );
175 | return this.sendRequest(url, getOptions);
176 | }
177 |
178 | post(url, data = {}, options = {}) {
179 | return this.sendRequestWithBody(url, data, HTTP_METHOD.POST, options);
180 | }
181 |
182 | put(url, data = {}, options = {}) {
183 | return this.sendRequestWithBody(url, data, HTTP_METHOD.PUT, options);
184 | }
185 |
186 | patch(url, data = {}, options = {}) {
187 | return this.sendRequestWithBody(url, data, HTTP_METHOD.PATCH, options);
188 | }
189 |
190 | delete(url, querystring = {}, options = {}) {
191 | const getOptions = Object.assign(
192 | {
193 | method: HTTP_METHOD.DELETE,
194 | qs: querystring,
195 | },
196 | options,
197 | );
198 | return this.sendRequest(url, getOptions);
199 | }
200 |
201 | /**
202 | * Send request with http body, will normalize body before sending
203 | * @param url
204 | * @param body
205 | * @param method
206 | * @param options
207 | * @returns {Promise}
208 | */
209 | sendRequestWithBody(url, body, method, options) {
210 | const sendOptions = Object.assign(
211 | {
212 | method,
213 | body: this.normalizeBodyData(body),
214 | },
215 | options,
216 | );
217 | return this.sendRequest(url, sendOptions);
218 | }
219 |
220 | /**
221 | * Upload files
222 | * @param {string} url - upload url
223 | * @param {Array|Object} files - files in array or in object where key is the file field name
224 | * @param {Object} fields - extra body data
225 | * @param {Object} options - other request options
226 | * @return {Promise}
227 | */
228 | upload(url, files, fields, options = {}) {
229 | const formData = new FormData();
230 | if (!isEmpty(fields)) {
231 | for (const key of Object.keys(fields)) {
232 | formData.append(key, fields[key]);
233 | }
234 | }
235 | if (Array.isArray(files)) {
236 | const fileFieldName = options.fileFieldName || 'files';
237 | let i = 0;
238 | for (; i < files.length; i++) {
239 | formData.append(fileFieldName, files[i]);
240 | }
241 | } else {
242 | for (const key of Object.keys(files)) {
243 | let value = files[key];
244 | if (!Array.isArray(value)) {
245 | value = [value];
246 | }
247 | value.forEach((v) => formData.append(key, v));
248 | }
249 | }
250 |
251 | const apiOptions = Object.assign(
252 | {
253 | method: HTTP_METHOD.POST,
254 | body: formData,
255 | multipart: true,
256 | },
257 | defaultOptions,
258 | options,
259 | );
260 | return this.sendRequest(url, apiOptions);
261 | }
262 |
263 | /**
264 | * Get the query from url
265 | * @param url
266 | * @param baseUrl
267 | * @return {object} - parsed query string
268 | */
269 | getQueryString(url = location.href, baseUrl = location.origin) {
270 | const obj = new URL(url, baseUrl);
271 | const query = {};
272 | for (const [key, value] of obj.searchParams.entries()) {
273 | if (query.hasOwnProperty(key)) {
274 | query[key] = [].concat(query[key], value);
275 | } else {
276 | query[key] = value;
277 | }
278 | }
279 | return query;
280 | }
281 |
282 | /**
283 | * Remove the hash from url
284 | * @param url
285 | * @param baseUrl
286 | * @return {string} - new url without the hash
287 | */
288 | stripUrlHash(url, baseUrl = location.origin) {
289 | const u = new URL(url, baseUrl);
290 | u.hash = '';
291 | return u.toString();
292 | }
293 |
294 | normalizeRestfulParams(url, options) {
295 | const restLength = numberOfRestParams(url);
296 | const restParams = !isEmpty(options.restParams) ? options.restParams : [];
297 | if (restLength > 0) {
298 | url = formatRestfulUrl(url, restParams);
299 | }
300 | return url;
301 | }
302 |
303 | formatFormUrlEncodeData(data) {
304 | const params = new URLSearchParams();
305 | for (let key in data) {
306 | if (data.hasOwnProperty(key)) {
307 | params.append(key, data[key]);
308 | }
309 | }
310 | return params.toString();
311 | }
312 |
313 | normalizeBodyData(data = {}) {
314 | return this.formURLEncoded
315 | ? this.formatFormUrlEncodeData(data)
316 | : JSON.stringify(data);
317 | }
318 |
319 | getUrlWithPrefix(urlConfig) {
320 | let ret = '';
321 | const plain = Request.isPlainUrl(urlConfig);
322 | if (plain) {
323 | ret += this.apiPrefix;
324 | } else {
325 | ret += urlConfig.prefix || this.apiPrefix;
326 | }
327 | ret += plain ? urlConfig : urlConfig.path;
328 | return ret;
329 | }
330 | }
331 |
332 | export { Request, api, formatRestfulUrl };
333 | export default new Request();
334 |
--------------------------------------------------------------------------------