操作方法：使用 Python 的 http.server 模块在本地测试 ArcGIS Survey123 生成的 HTML

摘要

可以使用 <iframe> HTML 元素将 ArcGIS Survey123 表单嵌入网站中。 ArcGIS Survey123 Web App 可以在调查的协作选项卡（调查 > 共享调查 > 共享此调查 > 嵌入）下为任何公开共享的调查生成 <iframe> HTML。然后，可以将生成的 <iframe> 元素复制/粘贴到网站的 HTML 中。

当使用 <iframe> 元素将 Survey123 表单嵌入网站中时，观察其显示或行为可能非常有用。但是，不会将包含 Survey123 生成的 <iframe> 的测试 HTML 文件作为文件加载到您的 web 浏览器中。相反，它必须通过 HTTP 提供服务。有关详细信息，请参阅 Mozilla 的有关在本地打开 HTML 文件的文档。

过程

如果安装了 Python，并且启用了 Windows 的 IIS Web 管理工具和万维网服务，则可以使用 Python 的 http.server 模块为自己提供带有 Survey123 生成的 <iframe> 元素的测试 HTML 文件。

首先使用诸如 Notepad++ 或 VS Code 等文本编辑器在您的计算机上创建一个 HTML 文件。

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Survey123 iframe test</title> </head> <body> </body> </html>

注： 将此文件保存在一个新文件夹中可以使后续步骤更加轻松。

创建此 HTML 文件后，将生成的 Survey123 <iframe> 元素复制/粘贴到 HTML 中，其中将 <style> 元素粘贴到 <head> 元素中，将 <div>/<iframe> 元素粘贴到 <body> 元素中

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Survey123 iframe test</title> <style> .embed-container { position: relative; height: 0; padding-bottom: 80%; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } small { position: absolute; z-index: 40; bottom: 0; margin-bottom: -15px; } </style> </head> <body> <div class="embed-container">   <iframe name="survey123webform" width="500" height="400" frameborder="0" marginheight="0" marginwidth="0" title="Bug Map Zoom Level" src="//survey123.arcgis.com/share/ae9c15b587494647b5186d69e81d042f" allow="geolocation https://survey123.arcgis.com; camera https://survey123.arcgis.com">   </iframe> </div> <script>var survey123webform = document.getElementsByName('survey123webform')[0]; window.addEventListener("message", e => { if (e.data) { var t = JSON.parse(e.data); "survey123:onFormLoaded" === t.event && t.contentHeight && (survey123webform.parentNode.style.height = t.contentHeight + "px") && (survey123webform.parentNode.style["padding-bottom"] = "unset") } });</script> </body> </html>

在 web 浏览器中查看 HTML 文件以测试嵌入调查的外观和行为。如前所述，与更加简单的 HTML 文件不同，无法通过其本地文件路径直接在浏览器中打开该文件，但是可以使用 Python 的 http.server 模块，通过 HTTP 将其提供给自己。
1. 打开命令提示符或 Python 命令提示符。
2. 使用 cd 命令导航至保存 HTML 文件的文件夹，例如：cd .\Desktop\Test
3. 在提示后粘贴 python -m http.server，然后按 Enter 键。
4. 在 web 浏览器中，打开 http://localhost:8000/，然后单击刚刚创建的 HTML 文件。它应该加载到您的浏览器选项卡中。
5. 完成检查该文件后，请返回命令提示符或 Python 命令提示符，然后按 Ctrl+C 以停止服务。

文章 ID: 000026171

发现关于本主题的更多内容

获取来自 ArcGIS 专家的帮助

联系技术支持部门

下载 Esri 支持应用程序

转至下载选项

操作方法：使用 Python 的 http.server 模块在本地测试 ArcGIS Survey123 生成的 <iframe> HTML

摘要

过程

接收通知并查找新问题或常见问题的解决方案

相关信息

发现关于本主题的更多内容