Webpack dev server proxy (cvat-ai#3368)

* Added proxy to webpack dev server config

* Added CHANGELOG increased package version

* Added webpack.config to eslintignore

* Added webpack.config to eslintignore

* Changed ignore to wildcard

* Changed path checker to regexp

Author: ActiveChooN

.eslintignore

@@ -8,3 +8,4 @@ keys/
 logs/
 static/
 templates/
+*/webpack.config.js

CHANGELOG.md

@@ -18,6 +18,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Updated manifest format, added meta with related images (<https://github.com/openvinotoolkit/cvat/pull/3122>)
 - Update of COCO format documentation (<https://github.com/openvinotoolkit/cvat/pull/3197>)
+- Updated Webpack Dev Server config to add proxxy (<https://github.com/openvinotoolkit/cvat/pull/3368>)
 
 ### Deprecated
 

cvat-core/src/config.js

@@ -1,8 +1,8 @@
-// Copyright (C) 2019-2020 Intel Corporation
+// Copyright (C) 2019-2021 Intel Corporation
 //
 // SPDX-License-Identifier: MIT
 
 module.exports = {
-    backendAPI: 'http://localhost:7000/api/v1',
+    backendAPI: '/api/v1',
     proxy: false,
 };

cvat-ui/package-lock.json

@@ -1,11 +1,11 @@
 {
   "name": "cvat-ui",
-  "version": "1.20.5",
+  "version": "1.20.6",
   "description": "CVAT single-page application",
   "main": "src/index.tsx",
   "scripts": {
     "build": "webpack --config ./webpack.config.js",
-    "start": "REACT_APP_API_URL=http://localhost:7000 webpack-dev-server --config ./webpack.config.js --mode=development",
+    "start": "webpack-dev-server --env.API_URL=http://localhost:7000 --config ./webpack.config.js --mode=development",
     "type-check": "tsc --noEmit",
     "type-check:watch": "npm run type-check -- --watch",
     "lint": "eslint './src/**/*.{ts,tsx}'",

cvat-ui/package.json

@@ -1,13 +1,12 @@
-// Copyright (C) 2020 Intel Corporation
+// Copyright (C) 2020-2021 Intel Corporation
 //
 // SPDX-License-Identifier: MIT
 
 import _cvat from 'cvat-core/src/api';
 
 const cvat: any = _cvat;
 
-cvat.config.backendAPI =
-    typeof process.env.REACT_APP_API_URL === 'undefined' ? '/api/v1' : `${process.env.REACT_APP_API_URL}/api/v1`;
+cvat.config.backendAPI = '/api/v1';
 
 export default function getCore(): any {
     return cvat;

cvat-ui/src/cvat-core-wrapper.ts

@@ -1,4 +1,4 @@
-// Copyright (C) 2020 Intel Corporation
+// Copyright (C) 2020-2021 Intel Corporation
 //
 // SPDX-License-Identifier: MIT
 
@@ -12,7 +12,7 @@ const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
 const Dotenv = require('dotenv-webpack');
 const CopyPlugin = require('copy-webpack-plugin');
 
-module.exports = {
+module.exports = (env) => ({
     target: 'web',
     mode: 'production',
     devtool: 'source-map',
@@ -30,6 +30,17 @@ module.exports = {
         inline: true,
         port: 3000,
         historyApiFallback: true,
+        proxy: [
+            {
+                context: (param) =>
+                    param.match(
+                        /\/api\/.*|git\/.*|opencv\/.*|analytics\/.*|static\/.*|admin(?:\/(.*))?.*|documentation\/.*|django-rq(?:\/(.*))?/gm,
+                    ),
+                target: env && env.API_URL,
+                secure: false,
+                changeOrigin: true,
+            },
+        ],
     },
     resolve: {
         extensions: ['.tsx', '.ts', '.jsx', '.js', '.json'],
@@ -134,4 +145,4 @@ module.exports = {
         ]),
     ],
     node: { fs: 'empty' },
-};
+});