feat: support proxy

lionelhorn · Aug 12, 2022 · 0002b76 · 0002b76
1 parent d997c61
commit 0002b76
Show file tree

Hide file tree

Showing 5 changed files with 27 additions and 3 deletions.
diff --git a/server/lib/proxy.js b/server/lib/proxy.js
@@ -26,6 +26,12 @@ function pipeRequest(ctx, options) {
         const { headers } = res;
 
         delete headers['set-cookie'];
+
+        headers['Access-Control-Allow-Credentials'] = 'true';
+        headers['Access-Control-Allow-Headers'] = '*';
+        headers['Access-Control-Allow-Methods'] =
+          'OPTIONS, GET, PUT, POST, DELETE,GET, PUT, DELETE, POST, GET, OPTIONS';
+        headers['Access-Control-Allow-Origin'] = '*';
       })
       .pipe(ctx.res);
     req.on('error', err => {

diff --git a/src/target/config.ts b/src/target/config.ts
@@ -22,9 +22,9 @@ if (!endWith(serverUrl, '/')) {
 if (!startWith(serverUrl, 'http')) {
   const protocol = location.protocol === 'https:' ? 'https:' : 'http:';
   if (!startWith(serverUrl, '//')) {
-    serverUrl = `//${serverUrl}`
+    serverUrl = `//${serverUrl}`;
   }
-  serverUrl = `${protocol}${serverUrl}`
+  serverUrl = `${protocol}${serverUrl}`;
 }
 
 let embedded = false;

diff --git a/src/target/connectServer.ts b/src/target/connectServer.ts
@@ -7,6 +7,17 @@ import { getFavicon } from './util';
 let isInit = false;
 
 export default function () {
+  const proxy = `${serverUrl}proxy`;
+  chobitsu.domain('Page').setProxy({
+    proxy,
+  });
+  chobitsu.domain('Debugger').setProxy({
+    proxy,
+  });
+  chobitsu.domain('CSS').setProxy({
+    proxy,
+  });
+
   const ws = new Socket(
     `${serverUrl.replace(/^http/, 'ws')}target/${id}?${query.stringify({
       url: location.href,

diff --git a/test/demo.html b/test/demo.html
@@ -19,7 +19,11 @@ <h2 class="subtitle">Remote Debugging Tool</h2>
       <polygon points="0,0 0,5 80,5 80,0 60,5 20,5" style="fill: #fff" />
     </svg>
     <p class="github-link">View it on <a href="https://github.com/liriliri/chii">GitHub</a></p>
-    <p class="hint">Open index page to inspect this page!</p>
+    <p class="hint">
+      Open index page to inspect this page! <br /><br />
+      Also scan the qrcode below to test it on your phone.
+    </p>
+    <div class="qrcode"><img src="https://res.liriliri.io/chii/qrcode.png" /></div>
     <ul class="buttons">
       <li id="start-btn" class="yellow" ontouchstart>Start Stuff</li>
       <li id="clear-btn" class="red" ontouchstart>Clear Output</li>

diff --git a/test/style.css b/test/style.css
@@ -67,6 +67,9 @@ body {
 }
 .hint {
   color: #555;
+}
+.qrcode {
+  text-align: center;
   margin-bottom: 50px;
 }
 .buttons {