鸿蒙的js开发部模式18:鸿蒙的文件上传到python服务器端
1.首先鸿蒙的js文件上传,设置目录路径为:

构建路径在工程主目录下:

该目录的说明见下面描述:
视图构建如下:

界面代码:
<div class="container">
<div onclick="operatorloadone" class="divone"><text>上传文件</text></div>
</div>
js上传业务逻辑代码:
导入request模块 import request from '@system.request'; 执行upload方法:
import request from '@system.request';
import prompt from '@system.prompt';
export default {
data: {
title: 'World'
},
operatorloadone()
{
prompt.showToast({
message:"执行文件上传"
})
request.upload({
url: 'http://rwrg2k.natappfree.cc/upload',
method:"POST",
files: [
{
uri: 'internal://cache/path/to/file.txt',
name: 'file',
filename: 'file.txt',
},
],
data:[
{
name: 'file1',
value: '文本文件',
},
],
success: function(data) {
console.log(data);
},
fail: function() {
console.log('upload fail');
}
});
}
}
上传参数说明如下:


域名采用内网穿透工具:

python服务器端的代码如下:
from flask import Flask
from flask import jsonify
from flask import request
app=Flask(__name__)
'''因为是文件,所以只能是POST方式'''
@app.route("/upload", methods=["POST"])
def uploadFile():
print("获取上传文件信息")
"""接受前端传送来的文件"""
file_obj = request.files.get("file")
filename=request.form.get("file1")
print("获取文件的参数是:"+filename)
if file_obj is None:
# 表示没有发送文件
return jsonify("未上传文件")
'''
将文件保存到本地(即当前目录)
直接使用上传的文件对象保存
'''
file_obj.save('file.txt') # 和前端上传的文件类型要相同
file_obj.seek(0)
return jsonify("上传成功")
if __name__=="__main__":
app.run(debug=True,port=8500)
文件上传到python工程根目录下:

file_obj = request.files.get("file") 获取文件信息
filename=request.form.get("file1") 获取文件上传参数,post请求 request.form,如果是get请求,request.args. 区分get和post请求。
上传文件可能会较慢,耐心等待几秒,检查服务器端python工作台目录,查看日志信息:

还是古语说得好,十八般武艺,样样需精通!我们一起努力吧!
《鸿蒙的js开发模式》系列文章合集
作者:六合李欣
想了解更多内容,请访问51CTO和华为合作共建的鸿蒙社区:https://harmonyos.51cto.com
鸿蒙的js开发部模式18:鸿蒙的文件上传到python服务器端的更多相关文章
- Resumable.js – 基于 HTML5 File API 的文件上传
Resumable.js 是一个 JavaScript 库,通过 HTML5 文件 API 提供,稳定和可恢复的批量上传功能.在上传大文件的时候通过每个文件分割成小块,每块在上传失败的时候,上传会不断 ...
- 鸿蒙的js开发部模式16:鸿蒙布局Grid网格布局的应用一
鸿蒙入门指南,小白速来!从萌新到高手,怎样快速掌握鸿蒙开发?[课程入口]目录:1.Grid简介2.使用Grid布局实现的效果3.grid-row-gap和grid-colunm-gap属性4.< ...
- node.js系列(实例):原生node.js+formidable模块实现简单的文件上传
/** * 原生node.js结合formidable模块实现图片上传改名 * @Author:Ghost * @Date:2016/07/15 * @description: * 1.引入模块htt ...
- 使用JS实现页面中动态添加文件上传输入项
1. 编写JSP <%@ page language="java" import="java.util.*" pageEncoding="UTF ...
- js+ajax+springmvc实现无刷新文件上传
话不多说直接上代码 <%@ page language="java" contentType="text/html; charset=UTF-8" pag ...
- 原生JS版和jQuery 版实现文件上传功能
<!doctype html> <html lang="zh"> <head> <meta charset="utf-8&quo ...
- 【JS】ajax 实现无刷新文件上传
一.摘要 最近在做个东西,需要实现页面无刷新文件上传,目前看到的方法有两种 1) 通过隐藏iframe 实现页面无刷新,适用于不关心上传结果 <form target="hiddenF ...
- 文件上传漏洞演示脚本之js验证
文件上传漏洞演示脚本之js验证 0 0 716 关于文件上传漏洞,想必玩web安全的同学们都有接触,之前本站也发布过一篇文章介绍文件上传漏洞的各种绕过方法,但是只是有文档却没有演示代码 ...
- AjaxUpLoad.js使用实现文件上传
AjaxUpLoad.js的使用实现无刷新文件上传,如图. 图1 文件上传前 图2 文件上传后 1.创建页面并编写HTML [html] view plaincopy 上传文档: <div ...
随机推荐
- PAT(乙级)2020年秋季考试
比赛链接:https://pintia.cn/market/item/1302816969611366400 7-1 多二了一点 (15分) 题解 模拟. 代码 #include <bits/s ...
- AtCoder Beginner Contest 176
比赛链接:https://atcoder.jp/contests/abc176 A - Takoyaki #include <bits/stdc++.h> using namespace ...
- 简谈图论重要性&&图论总结
从外地学习回来,我对图论才有认识(以前就没接触过,非常尴尬),说实话,学好图论的重要性,就像学数学时在进行解析几何时,图极有可能是打开答案的最后秘钥,也就是数形结合,而懂的人永远明白,用图解决绝对比用 ...
- POJ-3984 迷宫问题 (BFS)
题意:有一个\(5\)X\(5\)的\(01\)图,输出从左上角走到右下角的最短路径. 题解:基础的bfs,这里困难的是如何输出这个最短路径,我们可以用一个结构体来存点和路径,我们每次向外去拓展的时候 ...
- P站风格的DevTools主题
Chrome插件地址:https://chrome.google.com/webstore/detail/material-devtools-theme-c/jmefikbdhgocdjeejjnne ...
- Leetcode(884)-索引处的解码字符串
给定一个编码字符串 S.为了找出解码字符串并将其写入磁带,从编码字符串中每次读取一个字符,并采取以下步骤: 如果所读的字符是字母,则将该字母写在磁带上. 如果所读的字符是数字(例如 d),则整个当前磁 ...
- hdu 4497 GCD and LCM (非原创)
GCD and LCM Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65535/65535 K (Java/Others)Total ...
- CSS 检测 IE 浏览器
CSS 检测 IE 浏览器 <!--[if IE]> <link href="ie.css" rel="stylesheet"> < ...
- how to install GitLab on Raspberry Pi OS
how to install GitLab on Raspberry Pi OS GitLab & Raspberry Pi refs https://about.gitlab.com/ins ...
- Array.fill & String.padStart & String.padEnd
Array.fill & String.padStart & String.padEnd Array.fill arr.fill(value[, start[, end]]) http ...