作为iframes的替代方案,可以创建分屏管理区域



我正在开发一个管理面板,我希望在其中拥有一个文件导航系统,该系统应始终从主管理区域可用,并保持独立于主管理区域加载。

出了什么问题

在与仪表板交互时,由于方法是使用PHP的SSR,用户将执行页面请求来更新帖子、转到不同的视图等。因此,每个请求都必须重新加载文件导航区域,我不希望这样,因为后端PHP必须获取所有文件,并为每个请求反复构建文件树。

我想做以下

包装页(管理面板(在一个拆分的视口中包含两个iframe:

  • iframe MAIN
  • iframe FILE-NAVIGATOR

用户可以在不影响其他区域的情况下使用和导航视口的每一侧。

例如,在不离开主iframe上打开的编辑器的情况下浏览文件和文件夹。

或者保存编辑器内容并执行其他操作,而不必不断刷新和重新渲染文件导航区域。

两个iframe内容都将托管在同一个域下,因此它们之间的通信不会成为问题。

我想通过PHP走SSR路线,因为这个项目不值得构建现代SPA,而且我需要重用很多已经存在的PHP代码。

但是,我还是想把它做得尽可能好。

所以问题是

你知道是否有比iframe更清洁/更好的方法来实现这一点吗?

我有点担心所有支持iframe的浏览器,因为它实际上是一个老东西。

我认为您最好的选择是使用单页应用程序;如React或Angular。这将以某种方式迫使您将后端系统构建为API服务器,并让大部分繁重的UI提升为在客户端中运行的JavaScript。

不久前,我开始做一个辅助项目,那就是AmazonS3浏览器。应用程序在浏览器中运行,主要入口点在这里,但您可能有兴趣查看浏览器部分本身。

您会注意到,此处可访问的BucketBrowser组件由两部分组成:BucketListBucketContent,这与您想要实现的内容类似。

将其作为React(或Angular(和整洁的后端API工作的主要优势是分离关注点,并有机会为其他平台创建移动或本地客户端,以利用您的后端API。

我不是React专家,我分享的链接是一个实验的一部分,还没有准备好用于生产;但它将帮助你想象如何利用React实现你的想法。

使用SingleSPAhttps://single-spa.js.org/框架,并使用React创建Container应用程序。然后保持你的PhP代码原样,并将其显示为Container应用程序页面中的子页面。所有可以作为单独模块创建的新模块。这是一种FE微服务。我们使用React和Vuejs进行了尝试,但我相信它也适用于PHP。

您可以在自己的工作空间=虚拟桌面上打开与管理相关的东西

  • 这在Linux、Window以及其他操作系统上都受支持

下面的一些提示如何在Linux上做一些事情:

检查您的系统上配置了多少个工作区:

wmctrl -d 

如果你愿意,你可以设置不同的工作区计数:

wmctrl -d | wc -l
# or on follow way:
wmctrl -n 1

在当前活动工作区的前台打开一个程序,然后移动到第二个工作区:

wmctrl -s 1 ; xed & sleep 3; wmctrl -s 0;

在当前活动工作区的后台打开一个程序,然后转到您喜欢的工作区:

Thats possible too.

您可以在屏幕的背景图片上显示您想要的内容:

  • 在Linux系统上,您可以使用p.e.Conky

    • Conky:http://conky.sourceforge.net/
    • Conky Optionen:http://conky.sourceforge.net/config_settings.html
    • Conky Variablen:http://conky.sourceforge.net/variables.html
    • Conky颜色:http://helmuthdu.deviantart.com/art/CONKY-COLORS-244793180?
    • 湿地代码:http://edg3.co.uk/snippets/weather-location-codes/germany/
    • https://www.linuxmintusers.de/index.php?topic=33952.0
    • https://www.linuxmintusers.de/index.php?topic=11139.0
  • 在Windows系统上,您可以使用p.e.bginfo

在其他操作系统上也可能是这样。

最新更新