前言:
最近有需求处理docx文件,并讲内容显示到页面,对world进行在线的阅读,这样我这里就使用flask+Document对docx文件进行处理并显示,下面直接上代码:
Document处理:
首先下载Document的库文件,先直接安装最新版的python-docx,如果不行则换成1.1.0版本:
pip install python-docx
pip install python-docx==1.1.0
处理docx代码如下:
def ReadVADocx(ProjectName,DocxName):docxfilepath = vaReportDir + "\\" + ProjectName + "\\" + DocxNameparagraphs = ReadDocx(docxfilepath)return paragraphsdef ReadDocx(docxfilepath):doc = Document(docxfilepath)paragraphs = list()pattern = re.compile('rId\d+')for graph in doc.paragraphs:level = graph.style.name.split(' ')[-1]if level == "Normal":level = Noneelif level == "Preformatted":level = Noneparagraph = {'text': graph.text,'level': level,'images': ""}paragraphs.append(paragraph)for run in graph.runs:if run.text == '':contentID = pattern.search(run.element.xml)if contentID:contentID = contentID.group(0)try:contentType = doc.part.related_parts[contentID].content_typeexcept KeyError as e:print(e)continueif not contentType.startswith('image'):continueimgData = doc.part.related_parts[contentID].blobimage_base64 = base64.b64encode(imgData).decode('utf-8')paragraph = {'text': run.text,'level': run.style.name.split(' ')[-1] if run.style.name.startswith('Heading') else None,'images': image_base64}paragraphs.append(paragraph)
上述代码会对docx文件进行遍历,并将对应的内容和等级放入数组中
下面是调用代码:
@app.route('/ViewVADocx', methods=['GET'])
def ViewVADocx():try:DocxName = request.args.get('docx')ProjectName = request.args.get('name')paragraphs = engine.ReadVADocx(ProjectName,DocxName)return render_template("viewdocx.html", n_getname=ProjectName, n_user=user,paragraphs=paragraphs)except Exception as e:return render_template('error-500.html')
html编写:
然后就是需要讲对应的内容在页面进行展示,下面列出html代码:
{% extends "mould.html" %}{% block head %}
{% endblock %}{% block body %}<!--body wrapper start--><div class="wrapper"><div class="floating-box" id="floatingBox">↑回到顶部↑</div><!--Start Page Title--><div class="page-title-box"><h4 class="page-title">{{ n_getname }}:扫描节点线</h4><div class="clearfix"></div></div><!--End Page Title--><!--Start row--><div class="row"><div class="col-md-12"><div class="white-box"><h2 style="font-weight: bold;">快速导航:</h2>{% for paragraph in paragraphs %}{% if paragraph.level == "1" %}<p><a href="#Section{{ loop.index0 }}" class="hover-link" style="font-weight: bold;">{{ paragraph.text }}</a>{% elif paragraph.level == "2" %}<p style="text-indent: 25px;"><a href="#Section{{ loop.index0 }}" class="hover-link2" style="font-weight: bold;">{{ paragraph.text }}	</a></p>{% endif %}{% endfor %}</div>{% for paragraph in paragraphs %}{% if paragraph.level %}{% if paragraph.level == "Title" %}
<!-- <h2 align="center">{{ paragraph.text }}</h2>-->{% elif paragraph.level == "1" %}</div><div class="white-box"><h{{ paragraph.level }} id="Section{{ loop.index0 }}" style="font-weight: bold;">{{ paragraph.text }}</h{{ paragraph.level }}>{% else %}<h{{ paragraph.level }} id="Section{{ loop.index0 }}">{{ paragraph.text }}</h{{ paragraph.level }}>{% endif %}{% else %}{% if paragraph.images %}<p><img src="data:image/png;base64,{{ paragraph.images }}" alt="Image"></p>{% else %}<p style="color: black;">{{ paragraph.text }}</p>{% endif %}{% endif %}{% endfor %}</div></div></div>{% endblock %}{% block list %}<style>.hover-link {font-size: 20px;}.hover-link:hover {color: red;font-size: 30px;}.hover-link2 {font-size: 15px;}.hover-link2:hover {color: red;font-size: 20px;}</style><style>/* CSS 样式,用于定义悬浮框的外观 */.floating-box {position: fixed;bottom: 20px;right: 20px;width: 80px;height: 50px;background-color: #ff9900;color: #fff;text-align: center;line-height: 50px;cursor: pointer;}</style><script>// JavaScript 代码var floatingBox = document.getElementById('floatingBox');// 点击事件监听器floatingBox.addEventListener('click', function() {window.scrollTo({ top: 0, behavior: 'smooth' });});</script>
{% endblock %}
其中添加了样式和回到顶部等小功能,方便浏览,最后的使用效果如下:
后记:
代码只做了docx文件的内容展示,包括文字和图片,并对等级进行了划分,没有对docx的修改功能,感兴趣的可以自己研究下