公司引进高拍仪,想拍完照片点上传按钮直接上传图片。高拍仪接口能提供照片的本地路径,现在的问题是不用file控件选择,只有路径,不知道如何上传到服务器,求解决方案。

方法:

使用泽优Web图片上传控件(img2)帮助解决图片手动上传的问题,使用img2后可以自动上传本地路径下面的图片,不需要用户再手动选择图片。

优势:

1.不需要通过AJAX上传BASE64,直接上传本地图片文件数据。

2.AJAX上传BASE64存在跨域问题,img2不存在跨域问题,可以灵活指定文件存储服务器。或者采用分布式存储方式。

原理

1.img2提供了接口addFile和addFolder,可以直接加载本地路径下面的图片或目录。

2.添加后可以调用post方法开始上传图片。

3.不需要开发人员编写上传代码,img2提供了asp,jsp,php,asp.net常用语言的上传代码,下载即用,整合方便,代码清晰简单。

泽优Web图片上传控件(img2)

加载图片

自动加载本地目录

<scripttype="text/javascript">

var imgUp = new ImageUploader();

imgUp.LoadTo("img-uper");

imgUp.ent.loadCmp = function () {

setTimeout(function () {

imgUp.addFolder("F:\\ftp");//自动加载本地目录下的所有图片

}, 1000);

};

</script>

自动加载本地路径下的图片文件

<scripttype="text/javascript">

var imgUp = new ImageUploader();

imgUp.LoadTo("img-uper");

imgUp.ent.loadCmp = function () {

setTimeout(function () {

imgUp.addFile("F:\\ftp\\test.jpg");//

}, 1000);

};

</script>

服务端jsp上传代码

publicvoid SaveFile(FileItem upFile) throws IOException

{

String fileName = upFile.getName();

//如果控件是以UTF-8编码方式提交的数据则使用下面的方式对文件名称进行解码。

fileName = fileName.replaceAll("\\+","%20");

//客户端使用的是encodeURIComponent编码

fileName = URLDecoder.decode(fileName,"UTF-8");

this.m_fileName = fileName;

this.CreateFolder();

String filePath = this.m_folder + this.m_fileName;

InputStream stream = upFile.getInputStream();

byte[] data = newbyte[(int)upFile.getSize()];//128k

stream.read(data);

stream.close();

RandomAccessFile raf = newRandomAccessFile(filePath,"rw");

//定位文件位置

raf.write(data);

raf.close();

}

asp.net文件上传代码

using System;

using System.Web;

using System.IO;

namespace WebApplication1

{

publicpartialclassupload : System.Web.UI.Page

{

protectedvoid Page_Load(object sender, EventArgs e)

{

var remark = HttpUtility.UrlDecode(remark);

if (Request.Files.Count > 0)

{

string folder = Server.MapPath("/upload");

//自动创建上传文件夹

if (!Directory.Exists(folder))

{

Directory.CreateDirectory(folder);

}

HttpPostedFile file = Request.Files.Get(0);

//utf-8编码时需要进行urldecode

string fn = HttpUtility.UrlDecode(file.FileName);//guid,crc,md5,ori

System.Diagnostics.Debug.WriteLine(fn);

string ext = Path.GetExtension(fn).ToLower();

if (ext == ".jpg"

|| ext == ".gif"

|| ext == ".png"

|| ext == ".bmp"

|| ext == ".tif")

{

string filePath = Path.Combine(folder, fn);

file.SaveAs(filePath);

//返回json格式

string res = "{\"id\":\""+id+"\",\"success\":1,\"url\":\"/upload/"+fn+"\"}";

Response.Write(res);

}

}

}

}

}

php文件上传代码

<?php

ob_start();

//201201/10

$timeDir = date("Ym")."/".date("d");

$pathSvr = dirname(__FILE__)."/upload/$timeDir/";

$curDomain = "http://".$_SERVER["HTTP_HOST"];

//相对路径 http://www.ncmem.com/upload/2012-1-10/

$pathRel = "$curDomain/img/upload/$timeDir/";

//自动创建目录。upload/2012-1-10

if(!is_dir($pathSvr))

{

mkdir($pathSvr,0777,true);

}

//如果PHP页面为UTF-8编码,请使用urldecode解码文件名称

//$fileName = urldecode($_FILES['img']['name']);

//如果PHP页面为GB2312编码,则可直接读取文件名称

$nameSvr  = $_FILES['img']['name'];

$nameSvr  = urldecode($nameSvr);

$tmpName  = $_FILES['img']['tmp_name'];

//$uid      = $_POST["UserID"];

$id       = $_POST["id"];

$width    = $_POST["width"];

$height   = $_POST["height"];

$remark   = $_POST["remark"];//utf-8则需要进行URL解码,gbk不用解码

$cateName = $_POST["cname"];

$cateVal  = $_POST["cvalue"];

//取文件扩展名jpg,gif,bmp,png

$path_parts = pathinfo($nameSvr);

$ext = $path_parts["extension"];

//只允许上传图片类型的文件

if(    0 == strcasecmp($ext,"jpg")

|| 0 == strcasecmp($ext,"jpeg")

|| 0 == strcasecmp($ext,"png")

|| 0 == strcasecmp($ext,"gif")

|| 0 == strcasecmp($ext,"bmp") )

{

//xxx/2011_05_05_091250000.jpg

$savePath = $pathSvr . $nameSvr;

//另存为新文件名称

if (!move_uploaded_file($tmpName,$savePath))

{

exit('upload error!' . "文件名称:" .$nameSvr . "保存路径:" . $savePath);

}

}

//输出图片路径

//$_SERVER['HTTP_HOST']localhost:81

//$_SERVER['REQUEST_URI'] /FCKEditor2.4.6.1/php/test.php

$reqPath = str_replace("upload.php","",$_SERVER['REQUEST_URI']);

$fn = $pathRel.$nameSvr;

$res = "{\"id\":\"$id\",\"success\":1,\"url\":\"$fn\"}";

echo $res;

header('Content-type: text/html; charset=utf-8');

header('Content-Length: ' . ob_get_length());

?>

泽优web图片上传控件(img2)采用HTTP协议上传,支持asp,jsp,php,asp.net等任何Web开发语言。且提供js-sdk,能够方便的集成到任何项目中。

详细介绍:http://blog.ncmem.com/wordpress/2019/09/05/泽优web图片上传控件img2产品介绍/

web高拍仪图片上传的更多相关文章

  1. 如何在Web页面里使用高拍仪扫描上传图像

    如何在Web页面里使用高拍仪扫描上传图像 市场上所有的高拍仪都支持扫描图片并保存到本地,一般公司都会提供控件.开发人员只需要在页面集成就可以进行拍照和扫描.只不过一般扫描的图片是保存在本地固定的文件夹 ...

  2. 如何在Web页面里面使用高拍仪扫描上传图像

    问题: 在网页上,客户端访问的时候,可以扫描图象(通过扫描仪),并放到网页上,上传到服务器,如何实现?就是提供扫描仪的驱动程序,并使用扫描仪来扫描图象 ,有没有此类的ActiveX控件 回复: 目前大 ...

  3. 详细阐述Web开发中的图片上传问题

    Web开发中,图片上传是一种极其常见的功能.但是呢,每次做上传,都花费了不少时间. 一个"小功能"花费我这么多时间,真心不愉快. So,要得认真分析下原因. 1.在最初学习Java ...

  4. 部署新浪SAE web.py Session及图片上传等问题注意事项

    1.以下几条代码解决编码问题 import sysreload(sys)sys.setdefaultencoding('utf-8') 2.图片上传问题 需要开通sina的Storage服务,随便建个 ...

  5. 关于web项目中的图片上传、并在前端显示问题(tomcat中配置文件上传虚拟路径)

    一.数据库存储 直接把图片的二进制码存到数据库,可参考blog:http://blog.csdn.net/hope2jiang/article/details/590733 直接存图片在mysql上面 ...

  6. 用Web Service实现客户端图片上传到网站

    由于项目需要,通过本地客户端,把图片上传到网站.通过webservice. 这是客户端代码: private void btnimg_Click(object sender, EventArgs e) ...

  7. 【转】关于web项目中的图片上传、并在前端显示问题(tomcat中配置文件上传虚拟路径)

    一.数据库存储 直接把图片的二进制码存到数据库,可参考blog:http://blog.csdn.net/hope2jiang/article/details/590733 直接存图片在mysql上面 ...

  8. 一个简单的安卓+Servlet图片上传例子

    例子比较 简单,服务端为Java Web Servlet,doPost方法中接收图片并保存,然后将保存的图片名返回给客户端,关键代码: @SuppressWarnings("deprecat ...

  9. web 图片上传实现本地预览

    在说上传之前先说说如何替换or美化浏览器自带的简陋上传按钮(自定义自己的上传按钮 如:img): 1.将自定义上传按钮上方添加 input file 框,实现input实现透明处理. 2.对自定义上传 ...

随机推荐

  1. Jmeter之CSV Data Set Config

    在很多情况下,需要针对测试数据做参数化操作,Jmeter提供了很好用的CSV Data Set Config插件. 一.界面显示 二.界面说明 1.名称:标识,建议设置为该组件是提供什么功能 2.注释 ...

  2. EL表达式.jsp指令等

    1.JSP标准指令:<%@ 标准指令(属性 )%><%@ page %><%@ include %><%@ taglib %> 2.JSP程序代码元素: ...

  3. oracle--优化思路

  4. C++学习笔记(五)--指针、NULL、引用

    1. C++中已经定义了NULL为0:#define NULL 0 指针p可以指向空值NULL即 p = NULL;表示该指针变量不指向任何变量. 注意:指针未初始化与指针为NULL不同, p = N ...

  5. SpringBoot 使用Mybatis+MySql

    pom配置 <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http: ...

  6. webpack4 es6转换

    在webpack里用es6语法, ie浏览器不识别,为了让浏览器识别,需要用到bebal转换; bebal,英文是通天塔 的意思, 我们常说的巴比伦也是这个词;我估计是当初设计者是想用它作为一个沟通e ...

  7. 手写ORM持久层框架(转)

    工程结构: 本文测试的数据库为: 其中student的表结构为: 表数据: 配置文件 DB2.properties driver=com.mysql.jdbc.Driver url=jdbc\:mys ...

  8. body传参?parameter传参?Request Payload?Query String Parameter?

    今天,是有委屈的一天:今天,是有小情绪的一天.所以,我们要对今天进行小结,跟它做一个了断! 今天,后端来一个接口,告诉我"要用post请求,parameter形式传参".over. ...

  9. IDEA错误: 找不到或无法加载主类 com.xxx.freight.dofreight.doFreight解决办法

    1.右键点击工程,选择open Module Settings或点击File选择Project Structure,进入页面 2.选择Artifacts->JAR->From module ...

  10. [WPF自定义控件库] 关于ScrollViewer和滚动轮劫持(scroll-wheel-hijack)

    原文:[WPF自定义控件库] 关于ScrollViewer和滚动轮劫持(scroll-wheel-hijack) 1. 什么是滚动轮劫持# 这篇文章介绍一个很简单的继承自ScrollViewer的控件 ...