python学习之文本文件上传
最近用python的flask框架完成了一个最基本的文本文件上传,然后读取。
前端用的Angular的ng2-file-upload完成文件上传,后端用flask接收上传的文件,接着做处理。
在交互的过程中发现,当文本的编码格式不是UTF-8的时候(python3 默认的编码是UTF-8),会产生decode错误。
错误信息:
1 | UnicodeDecodeError: 'utf-8' codec can't decode byte 0xca in position 0 : invalid continuation byte |
解决办法如下:
1 2 3 | files = request.files[ 'file' ].read() files_charset = chardet.detect(files) # 获取文件的编码格式 article = files.decode(files_charset[ 'encoding' ]) # 按照文件的的编码格式读取文件内容 |
前端Angular的ts如下:
import { Component, OnInit } from '@angular/core'; import { FileUploader } from 'ng2-file-upload'; import {Router} from '@angular/router'; import {HttpClient, HttpHeaders} from '@angular/common/http'; import {Observable} from 'rxjs/Observable'; @Component({ selector: 'app-file', templateUrl: './file.component.html', styleUrls: ['./file.component.scss'] }) export class FileComponent implements OnInit { info = '点击这里选择文件'; formData = new FormData(); dataSource: Observable<any>; uploader: FileUploader = new FileUploader({url: '/api/file'}); constructor( private router: Router, private http: HttpClient ) { } ngOnInit() { } selectedFileOnChanged(event) { // 单文件上传,选择文件后显示文件名 if ( this.uploader.queue.length > 0 ) { const file = this.uploader.queue[0]._file; const fileName = this.uploader.queue[0]._file.name; this.formData.append('file', file, fileName); if ( fileName == '' ) { this.info = '点击这里选择文件'; } else { this.info = fileName; } } else { this.info = '点击这里选择文件'; } } submit() {// 上传文件 const headers = new HttpHeaders(); headers.set('Content-Type', 'multipart/form-data');// 上传类型为文件 headers.set('Accept', 'application/json');// 接收json文件 this.dataSource = this.http.post('/api/file', this.formData, { headers: headers} ); this.dataSource.subscribe( data =>{ console.log(data);//接收数据 }); } destroy() {// 清空文件缓存 this.uploader.clearQueue(); } }
前端HTML页面如下:
<div class="row" xmlns=""> <div class="col-md-12"> <nb-card> <nb-card-header> <h4>选择需要分析的文件:</h4> </nb-card-header> <nb-card-body> <div class="row high" ngForm> <div class="col-md-3 col-lg-3 col-sm-3"> <a href="javascript:void(0);" class="file btn btn-hero-success btn-sm" (click)="destroy()"> <input type="file" ng2FileSelect [uploader]="uploader"
(change)="selectedFileOnChanged($event)" accept=".pdf,.doc,.docx,.txt"
name="file" /> {{ info }} </a> </div> <div class="col-md-2 col-lg-2 col-sm-2"> <button type="submit" class="btn btn-hero-success btn-sm" (click)="submit()">提交文件</button> </div> <div class="col-md-7 col-lg-7 col-sm-7"> <span class="tip">提示:单文件分析,可传doc,docx,pdf,txt等文本文件。</span> </div> </div> </nb-card-body> </nb-card> </div> <router-outlet></router-outlet> </div>
低调做人,高调做事。
标签:
——————python学习
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异
· 三行代码完成国际化适配,妙~啊~