传照片

SAPUI5上传图片或者其他文件 front-end

由 匿名 (未验证) 提交于 2019-12-02 23:57:01
由于本地环境有set-cookie的问题，所以这里不使用eclipse，使用web ide进行开发测试。 1 在neo-app.json文件中引入destination。可以使用manifest.json的视图管理器加入对应server的odata service,这样可以不用手动追加。 <mvc:View controllerName="ZDEMO_UPLOAD.ZDEMO_UPLOAD.controller.App" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:l="sap.ui.layout" xmlns:u="sap.ui.unified" displayBlock="true"> <Shell id="shell"> <App id="app"> <pages> <Page id="page" title="{i18n>title}"> <content> <l:VerticalLayout> <u:FileUploader id="idfileUploader" name="myFileUpload" tooltip="Upload your file to the local server" uploadComplete="handleUploadComplete"/> <Button text="Upload

vue项目富文本编辑器vue-quill-editor之自定义图片上传

由 匿名 (未验证) 提交于 2019-12-02 23:49:02
1、如果按照官网富文本编辑器中的图片上传是将图片转为base64格式的，如果需要上传图片到自己的服务器，需要修改配置。 /*富文本编辑图片上传配置*/ const uploadConfig = { action: '', // 必填参数 图片上传地址 methods: 'POST', // 必填参数 图片上传方式 token: '', // 可选参数 如果需要token验证，假设你的token有存放在sessionStorage name: 'img', // 必填参数 文件的参数名 size: 500, // 可选参数 图片大小，单位为Kb, 1M = 1024Kb accept: 'image/png, image/gif, image/jpeg, image/bmp, image/x-icon' // 可选 可上传的图片格式 }; // toolbar工具栏的工具选项（默认展示全部） const toolOptions = [ ['bold', 'italic', 'underline', 'strike'], ['blockquote', 'code-block'], [{'header': 1}, {'header': 2}], [{'list': 'ordered'}, {'list': 'bullet'}], [{'script': 'sub'}, {'script'

如何把上传图片时候的文件对象转换为图片的url !

由 匿名 (未验证) 提交于 2019-12-02 23:47:01
getObjectURL(file) { var url = null; if (window.createObjectURL != undefined) { url = window.createObjectURL(file); } else if (window.URL != undefined) { url = window.URL.createObjectURL(file); } else if (window.webkitURL != undefined) { url = window.webkitURL.createObjectURL(file); } return url; }, 以上，我们通过将文件对象传入，即可返回图片的url .

vue图片上传

由 我们两清 提交于 2019-12-02 23:44:44
今天来跟大家分享一下vue图片上传，以及一些样式的设计 如图是一个上传按钮，当上传成功后按钮被上传的图片缩略图替代 效果 =》 代码 1 　　　　　//elementui按钮 　　　　　　　　　<el-button 2 class="fileParent" 3 type="success" 4 icon="el-icon-plus" 5 style="background:#273C48" 6 @change="uploadFile" 7 > 8 <input class="file" type="file" @change="uploadFile" multiple="multiple" />//上传框 9 <img :src="tempImg" v-if="tempImg" alt />//缩略图 10 </el-button> 1 async uploadFile(event) { 2 let file = event.target.files[0]; //获取input的图片file值 3 let param = new FormData(); // 创建form对象 4 param.append("imgFile", file); //对应后台接收图片名 5 await uploadPicture(param).then(res => {/

vue 上传图片 问题

由 匿名 (未验证) 提交于 2019-12-02 23:32:01
在main.js 挂载全局方法 Vue.prototype.MYUPFile = function(pm_file, pm_id, pm_cbfunc_obj){ /* 回传的回调函数,是 func_callback(errtext, {'url':'','type':'','original':''}) // if(this.row.jiassfzfj > '' && this.row.jiassfzfj.length > 5){ this.avatar = this.row.jiassfzfj; } //<input type="file" accept="image/gif,image/jpeg,image/jpg,image/png" @change="changeImage($event)" class="uppic"> 让input放到img上,z-index比img大 <input type="file" @change=changeImage(e) { //上传图片 var file = e.target.files[0] var reader = new FileReader() var that = this reader.readAsDataURL(file) reader.onload = function(e) { that.avatar = this

在上传图片到服务端项目中，微信小程序在真机调试时调用wx.uploadFile提示“fail url not in domain list”时的处理办法

由 匿名 (未验证) 提交于 2019-12-02 23:32:01
项目文件路径 微信小程序所在路径为 E:\WGY\微信小程序\FaultPatrol 项目下的audio页 服务器后端是在E:\WGY\后端学习\WebAPI_TEST\UploadImage路径下。 微信小程序端上传图片到服务端的一些要点: 1,服务端修改AppStart文件夹下的WebApiConfig.cs文件内的默认路由为 config.Routes.MapHttpRoute( name: "DefaultApi", routeTemplate: "api/{controller}/{action}/{id}", //修改的此处，增加了action defaults: new { id = RouteParameter.Optional } ); 2，Http接口输出数据的格式修改 参考路径WebApi接口 - 响应输出xml和json https://www.cnblogs.com/webenh/p/6205582.html var format = GlobalConfiguration.Configuration.Formatters; //默认输出方式为xml和json，清除XML则只有json了。清除默认xml format.XmlFormatter.SupportedMediaTypes.Clear(); //通过参数设置返回格式 format

微信小程序-图片上传chooseImage 预览图片previewImage，视频上传chooseVideo，显示隐藏

由 匿名 (未验证) 提交于 2019-12-02 23:05:13
首先，看一下效果。 ps: 显示视频按钮控制是否显示视频，未选择图片的情况下，是不显示图片占据空间，就是为隐藏。 Wxml： Wxss: / 上传图片多行变一行显示 / .img_style{ flex-direction: row; display: flex; } / 上传块大小 / .img_bg{ width: 240rpx; height: 240rpx; } / 上传图片 / .up_pictures{ width: 200rpx; height: 200rpx; margin: 30rpx 30rpx auto 30rpx; } / 上传按钮 / .button_bg{ flex-direction: row; display: flex; } button{ width: 30%; margin-top: 10rpx; margin-bottom: 10rpx;} / 上传视频 / .video{ width: 90%; height: 240rpx; margin-left: 5%; margin-right: 5%; } / 视频框隐藏 / .hide{ display: none; } / 视频框显示 / .show{ display: block; } Js: Page({ data:{ imgs: [], //选择图片 video: [], //选择视频

base64图片上传

由 匿名 (未验证) 提交于 2019-12-02 23:03:14
图片上传 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <link rel="stylesheet" href="css/reset.css" /> <link rel="stylesheet" href="css/grzl.css" /> <title>个人资料</title> <style> .form-btn { margin-top: 12rem; } </style> </head> <body> <!--header--> <div class="header"> <i class="header-calendar" id="return"></i> <h3><span>个人资料</span></h3> </div> <form> <ul class="tab-nav"> </ul> <div class="form-btn"> <input type="button" value="保存" id="form-btn" /> </div> </form> <script type="text

微信小程序如何上传图片至服务器（node.js实例分享）

由 匿名 (未验证) 提交于 2019-12-02 22:56:40
一、前台处理 (1)首先在wxml中为按钮绑定上传图片事件 <button bindtap="upImgClick">上传图片</button> <image src='{{imgUrl}}'></image> //显示图片 (2)在页面对应的.js文件的data中添加存储图片数据库地址的变量（imgUrl）以便展示，添加上传图片的方法:利用微信的wx.chooseImage接口获取图片的临时地址filepath，将临时地址传入后台，并接收后台传递的服务器地址，赋给imgUrl .js文件. upImg.js var util = require('../../utils/util.js') Page({ data: { imgUrl:'', }, //上传图片 upImgClick: function (e){ wx.chooseImage({ count: 1, //一次上传图片数量 sizeType: ['compressed'], //图片大小 sourceType: ['album', 'camera'], success: function (res) { util.showBusy('正在上传') var filePath = res.tempFilePaths[0] //获取图片路径 // 上传图片 wx.uploadFile({ url: config

基于vue的移动端图片上传

由 匿名 (未验证) 提交于 2019-12-02 22:56:40
1、上传效果（含添加和删除设计图）： 2、html代码 //使用前，先把组件引入 <updatefile : multiple = "true" : max = 6 : list = "imgList" ref = "upload" ></updatefile> //multiple:是否支持多选 //max:最多上传几张 //list:编辑反显使用 4、组件代码(使用了mint-ui提示 和less预处理器) < template > < div > < div class = "fileCon" > < div class = "list" > < div v - for = "(item,index) in list" : key = "index" > < div class = "close" @click = "close(index)" ></ div > < img : src = "item" /> </ div > < div class = "add" v - show = "maxStatus" @click = "chooseType" > < div class = "add-image" > </ div > </ div > </ div > </ div > < input id = "upload_file" type = "file"
订阅 传照片