如何在不修改外部应用程序的情况下修改外部应用程序生成的网页?



我有以下问题:我有一个前端应用程序a,它进行身份验证,设置反向代理,然后转发到我不控制的单独应用程序B。

我想为B应用程序的结果页面添加装饰,例如添加一个按钮"注销",但我不能修改B的代码或模板。

有什么我不知道的魔术来得到这个结果吗?

正如评论中讨论的那样,您的情况留给您几个选择:

  • 将应用程序b封装在<iframe>

<iframe>中加载应用程序b,同时在顶部的固定位置保持自定义导航条。如果<iframe>与应用程序b托管在相同的位置,这将是可能的。这将避免篡改应用程序b的原始代码,同时仍然给你改变用户体验的自由。

的例子:

<iframe src="https://mdn-samples.mozilla.org/snippets/html/iframe-simple-contents.html" width="400" height="300"> <p>Your browser does not support iframes.</p> </iframe>

(这个的变体):

<object data="http://www.web-source.net" width="600" height="400">
    <embed src="http://www.web-source.net" width="600" height="400"> </embed>
     Error: Embedded data could not be displayed.
</object>

或者,这是一个有一些可行解决方案的重大相关问题:使用HTML5替代iframe

  • 在应用程序b中插入自定义JavaScript/CSS

如果您可以控制应用程序b的代码,则可以包含一个小的JavaScript文件,该文件可以自动插入一些绝对元素以增强用户体验。它可以避免破坏原始代码,但这并不是一个真正干净的解决方案

  • 修改现有代码

这是一个选项,但如果你不喜欢编辑它,就不应该这样做。因为你很可能会在上面浪费很多时间。

祝你的申请顺利!

最新更新