将网页加载到iFrame Flask中

时间:2017-02-14 13:01:36

标签: python html twitter-bootstrap iframe flask

我对Flask很新。我想在网上创建一个移动应用程序模拟。我找到了一个我喜欢的bootstrap模板。我在python中实现了一个小的Flask应用程序作为服务器。

app.py

from flask import Flask, render_template
app = Flask(__name__)

@app.route('/')
def hello(name=None):
    return render_template('index.html', name=name)

if __name__ == '__main__':
    app.run()

这是index.html文件的正文

<body>
    <div class="main-row">
        <h1>Fortune Estates</h1>
        <div class="main_frame">
            <iframe class="frame-border scroll-pane" src="templates/main.html" frameborder="0"></iframe>
        </div>
    </div>
    <div class="copy-right">
        <p>&copy; 2016 Fortune Estates . All Rights Reserved | Design by <a href="http://w3layouts.com" target="_blank">W3layouts</a></p>
    </div>
    <script src="static/js/jquery.nicescroll.min.js"></script> 
    <script>
      $(document).ready(function() {

        var nice = $("html").niceScroll();  // The document page (body)

        $("#div1").html($("#div1").html()+' '+nice.version);

        $("#boxscroll").niceScroll(); // First scrollable DIV

      });
    </script>
</body>

当我启动烧瓶应用时,我收到此错误127.0.0.1 - - [14/Feb/2017 14:46:45] "GET /templates/main.html HTTP/1.1" 404 -

这是我的文件层次结构

.
+-- app.py
+-- templates 
|   +-- index.html
|   +-- main.html
|   ....
+-- static 
|   +--js
|   |   +--bootstrap.cs
|   |   ...
|   +--fonts
|   |   ...
|   +--css
|   |   ...
|   +--images
|   |

1 个答案:

答案 0 :(得分:1)

您正在引用index.html中位于同一目录中的main.html模板,请尝试使用src =&#34; main.html&#34;在iFrame中。

然后浏览器将发送另一个针对main.html文件的GET请求。您需要通过在Flask服务器中添加新功能从服务器端覆盖它:

from flask import Flask, render_template
app = Flask(__name__)

@app.route('/')
def hello(name=None):
    return render_template('index.html', name=name)


@app.route('/main.html')
def main():
    return render_template('main.html')

if __name__ == '__main__':
    app.run()