Flask template中使用iframe

Flaks template中使用iframe嵌套新的網頁(new_page.html)的網頁到歷史網頁(old_page.html)中(減少新網頁的入口)

1,增加iframe tag

在old_page.html中適當位置增加iframe入口標簽:

<iframe src="{{url_for('upgrade.get_new_page')}}" style="width:100%;height:100%;min-height: 500px;outline: 1px; border: 0 solid #dddddd"></iframe>

注意:在flask template中 iframe默認是進行跳轉的,非靜態資源的加載,直接寫文件路徑一般是找不到的。需要經過flask路徑的跳轉。

為了避免出現意想不到的路徑訪問(項目是老而大的項目,路徑跳轉目前還未弄清楚),自己寫了個view來渲染要插入的頁面

2,通過view跳轉來渲染目標頁面

upgrade 藍圖中定義get_new_page,view代碼邏輯如下

new_page.html是在templates/my_page/下

def?get_new_page():return render_template("my_page/new_page.html")

最初是想通過在iframe的src中寫入目標頁面路徑地址“my_page/new_page.html”來進行頁面加載,發現會請求http://localhost:8443/mm/upgrade/my_page/new_page.html的地址內容來填充iframe,因為這個地址內容404,導致填充的內容是404結果頁面。所以猜測,iframe在flask的template中應該是通過路由跳轉機制來找頁面的。不能簡單通過加路徑地址來加載目標頁面。要跟目標頁面的路徑跳轉結合使用。

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/208742.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/208742.shtml
英文地址,請注明出處:http://en.pswp.cn/news/208742.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

django與數據庫交互關于當前時間的坑

背景 在線上服務中使用時間進行數據庫操作時發現異常&#xff0c;而在本地環境無法成功復現此問題&#xff0c;導致難以進行故障排查。 核心問題 view.py class XxxViewSet(viewsets.ModelViewSet):queryset Xxx.objects.with_status().order_by("status", &quo…

【數據結構】插入排序,希爾排序,選擇排序,堆排序,冒泡排序

1.插入排序 思路&#xff1a;插入排序將一個數插入一個有序的數組里面&#xff0c;將這個數和數組元素挨著比較&#xff0c;直到他插入到合適的位置。 動畫演示&#xff1a; 步驟&#xff1a;1.定義一個變量tmp保存要插入的數據 2.在循環中用tmp和有序數組中的元素比較&#…

談一談Linux下的進程和線程

文章目錄 進程線程進程與線程比較 進程 什么是進程&#xff1f; 概念上來說&#xff0c;進程是擔當OS資源分配的實體。通俗來說&#xff0c;進程是我們OS上一個在運行的程序。 我們的OS上不止有一個進程&#xff0c;當我們的某一個進程像是去磁盤上讀文件時&#xff0c;由于磁…

學習pytorch18 pytorch完整的模型訓練流程

pytorch完整的模型訓練流程 1. 流程1. 整理訓練數據 使用CIFAR10數據集2. 搭建網絡結構3. 構建損失函數4. 使用優化器5. 訓練模型6. 測試數據 計算模型預測正確率7. 保存模型 2. 代碼1. model.py2. train.py 3. 結果tensorboard結果以下圖片 顏色較淺的線是真實計算的值&#x…

國產化軟件突圍!懌星科技eStation產品榮獲2023鈴軒獎“前瞻優秀獎”

11月11日&#xff0c;2023中國汽車供應鏈峰會暨第八屆鈴軒獎頒獎典禮在江蘇省昆山市舉行。懌星科技憑借eStation產品&#xff0c;榮獲2023鈴軒獎“前瞻智能座艙類優秀獎”&#xff0c;懌星CEO潘凱受邀出席鈴軒獎晚會并代表領獎。 2023鈴軒獎“前瞻智能座艙類優秀獎” 鈴軒獎&a…

el-table 跨頁多選

步驟一 在<el-table>中:row-key"getRowKeys"和selection-change"handleSelectionChange" 在<el-table-column>中type"selection"那列&#xff0c;添加:reserve-selection"true" <el-table:data"tableData"r…

隊列排序:給定序列a,每次操作將a[1]移動到 從右往左第一個嚴格小于a[1]的元素的下一個位置,求能否使序列有序,若可以,求最少操作次數

題目 思路&#xff1a; 賽時代碼&#xff08;先求右起最長有序區間長度&#xff0c;再求左邊最小值是否小于等于右邊有序區間左端點的數&#xff09; #include<bits/stdc.h> using namespace std; #define int long long const int maxn 1e6 5; int a[maxn]; int n; …

阿里云磁盤在線擴容

我們從阿里云的控制面板中給硬盤擴容后結果發現我們的磁盤空間并沒有改變 注意&#xff1a;本次操作是針對CentOS 7的 &#xfeff;#使用df -h并沒有發現我們的磁盤空間增加 #使用fdisk -l發現確實還有部分空間 運行df -h命令查看云盤分區大小。 以下示例返回分區&#xf…

python3安裝redis

#!/usr/bin/python3import os import platform import argparse import shutil# 自定義變量 default_system "ubuntu" default_redis_version "6.2.6" default_install_path "/usr/local/redis" default_local_package_dir os.path.dirname(…

eve-ng鏡像模擬設備-信息安全管理與評估-2023國賽

eve-ng鏡像模擬設備-信息安全管理與評估-2023國賽 author&#xff1a;leadlife data&#xff1a;2023/12/4 mains&#xff1a;EVE-ng 模擬器 - 信息安全管理與評估模擬環境部署 references&#xff1a; EVE-ng 官網&#xff1a;https://www.eve-ng.net/EVE-ng 中文網&#xff1…

嵌入版python作為便攜計算器(安裝及配置ipython)

今天用別的電腦調試C&#xff0c;需要計算反三角函數時發現沒有趁手工具&#xff0c;忽然想用python作為便攜計算器放在U盤&#xff0c;遂想到嵌入版python 懶得自己配可以直接下載&#xff0c;使用方法見第4節 1&#xff0c;下載embeddable python&#xff08;嵌入版python&…

React中傳入props.children后, 為什么會導致組件的重新渲染?

傳入props.children后, 為什么會導致組件的重新渲染&#xff1f; 問題描述 在 react 中, 我想要對組件的渲染進行優化, 遇到了一個非常意思的問題, 當我向一個組件中傳入了 props.children 之后, 每次父組件重新渲染都會導致這個組件的重新渲染; 它看起來的表現就像是被memo包…

【1day】?萬戶協同辦公平臺 convertFile 任意文件讀取漏洞學習

注:該文章來自作者日常學習筆記,請勿利用文章內的相關技術從事非法測試,如因此產生的一切不良后果與作者無關。 目錄 一、漏洞描述 二、影響版本 三、資產測繪 四、漏洞復現

圖的鄰接鏈表儲存

噴了一節課 。。。。。。。、。 #include<stdio.h> #include<stdlib.h> #define MAXNUM 20 //每一個頂點的節點結構&#xff08;單鏈表&#xff09; typedef struct ANode{ int adjvex;//頂點指向的位置 struct ArcNode *next;//指向下一個頂點 …

C++ 內存分區模型

目錄 程序運行前 代碼區 全局區 程序運行后 new 在堆區開辟數據 delete釋放堆區數據 堆區開辟數組 內存分區模型 棧&#xff08;Stack&#xff09; 堆&#xff08;Heap&#xff09; 全局/靜態存儲區&#xff08;Global/Static Storage&#xff09; 常量存儲區&am…

力扣230. 二叉搜索樹中第K小的元素

深度優先搜索 思路&#xff1a; 二叉搜索樹的特性&#xff0c;通過中序遍歷得到有序序列&#xff0c;則遍歷到第K個節點的時候即為結果&#xff1b;使用棧通過深度優先遍歷進行中序遍歷&#xff1a; 先將節點和左子節點壓棧&#xff1b;然后棧頂上就是“最左”葉子節點&#x…

Linux DAC權限的簡單應用

Linux的DAC&#xff08;Discretionary Access Control&#xff09;權限模型是一種常見的訪問控制機制&#xff0c;它用于管理文件和目錄的訪問權限。作為一名經驗豐富的Linux系統安全工程師&#xff0c;我會盡可能以簡單明了的方式向計算機小白介紹Linux DAC權限模型。 在Linu…

jenkins中“Jenkins Plot Plugin”的使用方法,比較兩個excel的數據差異

Jenkins Plot Plugin是Jenkins的一個插件&#xff0c;它可以用于生成圖表和報表&#xff0c;以便更好地理解和分析構建和測試數據。下面是使用Jenkins Plot Plugin比較兩個Excel數據差異的步驟&#xff1a; 1.安裝Jenkins Plot Plugin&#xff1a;在Jenkins的插件管理頁面搜索…

使用 Axios 進行網絡請求的全面指南

使用 Axios 進行網絡請求的全面指南 本文將向您介紹如何使用 Axios 進行網絡請求。通過分步指南和示例代碼&#xff0c;您將學習如何使用 Axios 庫在前端應用程序中發送 GET、POST、PUT 和 DELETE 請求&#xff0c;并處理響應數據和錯誤。 準備工作 在開始之前&#xff0c;請…

電子學會C/C++編程等級考試2021年09月(五級)真題解析

C/C++等級考試(1~8級)全部真題?點這里 第1題:抓牛 農夫知道一頭牛的位置,想要抓住它。農夫和牛都位于數軸上,農夫起始位于點N(0<=N<=100000),牛位于點K(0<=K<=100000)。農夫有兩種移動方式: 1、從X移動到X-1或X+1,每次移動花費一分鐘 2、從X移動到2*X,每…