diff --git a/Composer/packages/client/config/paths.js b/Composer/packages/client/config/paths.js
index e5397ef002..ce39322d30 100644
--- a/Composer/packages/client/config/paths.js
+++ b/Composer/packages/client/config/paths.js
@@ -75,8 +75,8 @@ module.exports = {
   appSrc: resolveApp('src'),
   appTsConfig: resolveApp('tsconfig.json'),
   yarnLockFile: resolveApp('yarn.lock'),
-  testsSetup: resolveModule(resolveApp, 'src/setupTests'),
-  proxySetup: resolveApp('src/setupProxy.js'),
+  testsSetup: resolveModule(resolveApp, 'setupTests'),
+  proxySetup: resolveModule(resolveApp, 'setupProxy'),
   appNodeModules: resolveApp('../../node_modules'),
   publicUrl: getPublicUrl(resolveApp('package.json')),
   servedPath: getServedPath(resolveApp('package.json')),
diff --git a/Composer/packages/client/setupProxy.js b/Composer/packages/client/setupProxy.js
new file mode 100644
index 0000000000..a75cd21360
--- /dev/null
+++ b/Composer/packages/client/setupProxy.js
@@ -0,0 +1,14 @@
+const proxy = require('http-proxy-middleware');
+
+const paths = require('./config/paths');
+const proxySetting = require(paths.appPackageJson).proxy;
+
+module.exports = function(app) {
+  const wsProxy = proxy('/lg-language-server', {
+    target: proxySetting.replace('/^http/', 'ws'),
+    changeOrigin: true,
+    ws: true,
+  });
+
+  app.use(wsProxy);
+};
diff --git a/Composer/packages/client/src/pages/language-generation/code-editor.tsx b/Composer/packages/client/src/pages/language-generation/code-editor.tsx
index 6531b9daa2..eaf43a114a 100644
--- a/Composer/packages/client/src/pages/language-generation/code-editor.tsx
+++ b/Composer/packages/client/src/pages/language-generation/code-editor.tsx
@@ -22,8 +22,6 @@ interface CodeEditorProps {
   line: number;
 }
 
-// lsp server port should be same with composer/server port.
-const lspServerPort = process.env.NODE_ENV === 'production' ? process.env.PORT || 3000 : 5000;
 const lspServerPath = '/lg-language-server';
 
 export default function CodeEditor(props: CodeEditorProps) {
@@ -137,7 +135,6 @@ export default function CodeEditor(props: CodeEditorProps) {
       errorMsg={errorMsg}
       lgOption={lgOption}
       languageServer={{
-        port: Number(lspServerPort),
         path: lspServerPath,
       }}
       onChange={_onChange}
diff --git a/Composer/packages/extensions/obiformeditor/src/Form/widgets/LgEditorWidget.tsx b/Composer/packages/extensions/obiformeditor/src/Form/widgets/LgEditorWidget.tsx
index c75ceb053d..b898618943 100644
--- a/Composer/packages/extensions/obiformeditor/src/Form/widgets/LgEditorWidget.tsx
+++ b/Composer/packages/extensions/obiformeditor/src/Form/widgets/LgEditorWidget.tsx
@@ -9,7 +9,6 @@ import debounce from 'lodash/debounce';
 
 import { FormContext } from '../types';
 
-const lspServerPort = process.env.NODE_ENV === 'production' ? process.env.PORT || 3000 : 5000;
 const lspServerPath = '/lg-language-server';
 
 const LG_HELP =
@@ -120,7 +119,6 @@ export const LgEditorWidget: React.FC<LgEditorWidgetProps> = props => {
       hidePlaceholder={true}
       helpURL={LG_HELP}
       languageServer={{
-        port: Number(lspServerPort),
         path: lspServerPath,
       }}
       height={height}