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服务器端的更多相关文章

  1. Resumable.js – 基于 HTML5 File API 的文件上传

    Resumable.js 是一个 JavaScript 库,通过 HTML5 文件 API 提供,稳定和可恢复的批量上传功能.在上传大文件的时候通过每个文件分割成小块,每块在上传失败的时候,上传会不断 ...

  2. 鸿蒙的js开发部模式16:鸿蒙布局Grid网格布局的应用一

    鸿蒙入门指南,小白速来!从萌新到高手,怎样快速掌握鸿蒙开发?[课程入口]目录:1.Grid简介2.使用Grid布局实现的效果3.grid-row-gap和grid-colunm-gap属性4.< ...

  3. node.js系列(实例):原生node.js+formidable模块实现简单的文件上传

    /** * 原生node.js结合formidable模块实现图片上传改名 * @Author:Ghost * @Date:2016/07/15 * @description: * 1.引入模块htt ...

  4. 使用JS实现页面中动态添加文件上传输入项

    1. 编写JSP <%@ page language="java" import="java.util.*" pageEncoding="UTF ...

  5. js+ajax+springmvc实现无刷新文件上传

    话不多说直接上代码 <%@ page language="java" contentType="text/html; charset=UTF-8" pag ...

  6. 原生JS版和jQuery 版实现文件上传功能

    <!doctype html> <html lang="zh"> <head> <meta charset="utf-8&quo ...

  7. 【JS】ajax 实现无刷新文件上传

    一.摘要 最近在做个东西,需要实现页面无刷新文件上传,目前看到的方法有两种 1) 通过隐藏iframe 实现页面无刷新,适用于不关心上传结果 <form target="hiddenF ...

  8. 文件上传漏洞演示脚本之js验证

    文件上传漏洞演示脚本之js验证 0 0       716   关于文件上传漏洞,想必玩web安全的同学们都有接触,之前本站也发布过一篇文章介绍文件上传漏洞的各种绕过方法,但是只是有文档却没有演示代码 ...

  9. AjaxUpLoad.js使用实现文件上传

    AjaxUpLoad.js的使用实现无刷新文件上传,如图. 图1 文件上传前 图2 文件上传后 1.创建页面并编写HTML [html] view plaincopy   上传文档: <div  ...

随机推荐

  1. 2019 China Collegiate Programming Contest Qinhuangdao Onsite F. Forest Program(DFS计算图中所有环的长度)

    题目链接:https://codeforces.com/gym/102361/problem/F 题意 有 \(n\) 个点和 \(m\) 条边,每条边属于 \(0\) 或 \(1\) 个环,问去掉一 ...

  2. SP3267 DQUERY - D-query 莫队板子题

    题意可见:https://www.luogu.com.cn/problem/SP3267 可在vj上提交:https://vjudge.net/problem/SPOJ-DQUERY 题意翻译 给出一 ...

  3. streamlink 安装使用

    CentOS 安装: pip install streamlink 使用: #查看视频信息 streamlink $URL #下载视频 streamlink $URL best streamlink ...

  4. 1.ASP.NET Core 管道、中间件、依赖注入

    自定义中间件(基于工厂) 自定义中间件(注入到第三方容器)

  5. 国产网络损伤仪 SandStorm -- 只需要拖拽就能删除链路规则

    国产网络损伤仪SandStorm可以模拟出带宽限制.时延.时延抖动.丢包.乱序.重复报文.误码.拥塞等网络状况,在实验室条件下准确可靠地测试出网络应用在真实网络环境中的性能,以帮助应用程序在上线部署前 ...

  6. 牛客网-n的约数【dfs】

    题目描述:戳这里 解题思路:这题思路好想,n最多也就是20个不同的素数相乘,把所有可能的素数找到,然后枚举素数个数就行了. n = p1^q1 + p2^q2 + p3 ^q3 + ... + pi ...

  7. hdu 6242 Geometry Problem

    Geometry Problem Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 262144/262144 K (Java/Other ...

  8. C# Dictionaries

    Dictionaries 字典 在C# 里是用接口 IDictionary来实现的,最常用的字典就是Dicrtionary<tkey,tvalue>,键值对的形式,和index,item ...

  9. BZOJ 3676 回文串(回文树)题解

    题意: 一个回文的价值为长度 * 出现次数,问一个串中的子串的最大回文价值 思路: 回文树模板题,跑PAM,然后计算所有节点出现次数. 参考: 回文串问题的克星--Palindrome Tree(回文 ...

  10. 如何在 VSCODE 中高效使用 R 语言

    VSCODE 配置 R 一.功能特性展示 之前一直在用 Rstudio 来编写 R,也尝试用过 Pycharm 配置 R 环境. 但是由于现在需求要同时满足 Python,R 和网站要同时开发,为了避 ...