improve backend address detect

README.md

@@ -1,14 +1,14 @@
 ## PyWebIO
 
-PyWebIO，一个用于在浏览器上获取输入和进行输出的工具库。能够将原有的通过终端交互的脚本快速服务化，供其他人在网络通过浏览器使用；PyWebIO还可以方便地整合进现有的Web服务，非常适合于构建对UI要求不高的后端服务的功能原型。
+PyWebIO是一个用于在浏览器上获取输入和进行输出的工具库。通过浏览器来提供更多输入输出方式，能够将原有的通过终端交互的脚本快速服务化，供其他人在网络上通过浏览器访问使用；PyWebIO还可以方便地整合进现有的Web服务，非常适合于构建对UI要求不高的后端服务。
 
 特点：
 
-- 使用同步而不是基于回调的方式获取输入，无需在各个步骤之间保存状态，直观、方便
-- 代码侵入性小
-- 支持并发请求
-- 支持状态恢复
+- 使用同步而不是基于回调的方式获取输入，无需在各个步骤之间保存状态，使用更方便
+- 代码侵入性小，对于旧脚本代码仅需修改输入输出逻辑
+- 支持多用户与并发请求
 - 支持整合到现有的Web服务，目前支持与Tornado和Flask的集成
+- 同时支持基于线程的执行模型和基于协程的执行模型
 
 ## Install
 
@@ -126,7 +126,7 @@ if __name__ == "__main__":
 在 `http://localhost/bmi/` 页面上就可以计算BMI了
 
 ## Overview
-`PyWebIO`支持丰富的输入输出形式，可以运行一下命令进行速览：
+`PyWebIO`支持丰富的输入输出形式，可以运行以下命令进行速览：
 
 ```bash
 python3 -m pywebio.demos.zh.overview

pywebio/html/index.html

@@ -55,16 +55,6 @@
 <script src="https://cdn.jsdelivr.net/npm/bs-custom-file-input/dist/bs-custom-file-input.js"></script>
 
 <script>
-    // https://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript
-    function getParameterByName(name, url) {
-        if (!url) url = window.location.href;
-        name = name.replace(/[\[\]]/g, '\\$&');
-        var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
-            results = regex.exec(url);
-        if (!results) return null;
-        if (!results[2]) return '';
-        return decodeURIComponent(results[2].replace(/\+/g, ' '));
-    }
 
     /*
     * Check given `backend_addr` is a http backend
@@ -73,6 +63,11 @@
     *   is_http_backend('http://localhost:8080/io').then(function(http_backend){ });
     * */
     function is_http_backend(backend_addr) {
+        var url = new URL(backend_addr);
+        var protocol = url.protocol || window.location.protocol;
+        url.protocol = protocol.replace('wss', 'https').replace('ws', 'http');
+        backend_addr = url.href;
+
         return new Promise(function (resolve, reject) {
             $.get(backend_addr, {test: 1}, 'html').done(function (data) {
                 resolve(data === 'ok');
@@ -87,29 +82,25 @@
         bsCustomFileInput.init()
     });
 
-    function get_ws_addr() {
-        if (getParameterByName('_pywebio_ws_url')) {
-            return getParameterByName('_pywebio_ws_url');
-        } else {
-            var p = window.location.pathname.lastIndexOf('/');
-            var pathname = '';
-            if (p !== -1)
-                pathname = window.location.pathname.substring(0, p);
-            return "ws://" + window.location.host + pathname + "/io";
-        }
+    // 获取后端API地址
+    function get_backend_addr() {
+        const url = new URLSearchParams(window.location.href);
+        var uri = url.get('_pywebio_addr') || './io';
+        return new URL(uri, window.location.href).href;
     }
 
     CodeMirror.modeURL = "https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.52.2/mode/%N/%N.min.js";
 
     var md_body = $('#markdown-body');
 
-    const debug = getParameterByName('_pywebio_debug');
-    is_http_backend('./io').then(function (http_backend) {
+    const debug = new URLSearchParams(window.location.href).get('_pywebio_debug');
+    const backend_addr = get_backend_addr();
+    is_http_backend(backend_addr).then(function (http_backend) {
         var session;
         if (http_backend)
-            session = new WebIO.HttpWebIOSession('./io');
+            session = new WebIO.HttpWebIOSession(backend_addr);
         else
-            session = new WebIO.WebSocketWebIOSession(get_ws_addr());
+            session = new WebIO.WebSocketWebIOSession(backend_addr);
         var ctrl = new WebIO.WebIOController(session, md_body, $('#input-container'));
         session.start_session(debug);
     });

pywebio/html/js/form.js

@@ -862,6 +862,13 @@
         this.ws = null;
         this.debug = false;
 
+        var url = new URL(ws_url);
+        if (url.protocol !== 'wss:' && url.protocol !== 'ws:') {
+            var protocol = url.protocol || window.location.protocol;
+            url.protocol = protocol.replace('https', 'wss').replace('http', 'ws');
+        }
+        ws_url = url.href;
+
         var this_ = this;
         this.start_session = function (debug = false) {
             this.debug = debug;