当前位置:主页 > F徽生活 >[卡国17天传说11]ASP会员管理第十一章照片上传

[卡国17天传说11]ASP会员管理第十一章照片上传

发布时间:2020-06-09  作者:   分类:F徽生活  

第十一章 照片上传
在这个章节,我们要在会员资料加上照片上传的功能。
因为ASP本身并没有直接支援上传的组件,因此我们要先在做为伺服器的主机安装ASPUpload,这个一个专门为ASP开发的上传组件。
你可以在官网上取得30天的试用版

其实除了要收费的ASPUpload外,还有免费版的ASPsmartupload,也有无组件上传,就是不安装任何软体之下来完成上传的动作。
但试用过这些组件后,还是觉得ASPUpload比较容易上手,而且国内的空间大多支援ASPUpload这个组件,所以这个章节我们就用它来做範例。
下载完组件后直接安装,安装过程都是一直按下一步,如果是试用版的话,直接把序号留空白,可以试用30天。
[卡国17天传说11]ASP会员管理第十一章照片上传
首先,先来说明一下ASPUpload的一些方法
先建立Upload物件
Set Upload = Server.CreateObject
Upload.OverwriteFiles = False'同档名不覆写
Upload.SetMaxSize 1048576,True'档案大小为1MB
Upload.Save'将档案先传至伺服器记忆体
Upload.Files'表示上传档案的集合
为了方便往后调用,我们把ASPUpload写成函式
'ASPUpload上传组件
Sub ASPUpload
on error resume next
Dir = Server.MapPath'设定上传目录
FileExt = "JPG,GIF"'定义可上传的副档名
Set Upload = Server.CreateObject'建立ASPUpload组件
Upload.OverwriteFiles = False'同档名不覆写
Upload.SetMaxSize 1048576,True'档案大小为1MB
Upload.Save'将档案先传至伺服器记忆体
For Each File IN Upload.Files'检查副档名
Ext = replace,".","")
if instr = 0 then
response.Write;")
response.Write
response.End
end if
Next
For Each File IN Upload.Files'存档
File.SaveAs Dir & "/" & MakeId & File.Ext'另存成乱数档案
FileName = File.FileName'回传档案名
Next
Select Case err.number'检查是否有错误码
Case 0'上传成功
response.Write.value = '" & FileName & "';")
response.Write.src = '" & "UserPics/" &FileName&"';")
response.Write.style.display = 'none';")
response.Write;")
response.End
Case 8'超出大小
response.Write;")
response.Write
response.End
end Select
Set Upload = nothing
end sub
在程式的一开头 on error resume next 说明如果过程出现错误,则继续执行。
这样设定的原因是要让程式收集错误代码用来显示错误讯息,程式才不致于中断。
上面的函式中我们先创建ASPUpload的物件,设定属性
接着检查允许上传的副档名,若不符合则返回。
[卡国17天传说11]ASP会员管理第十一章照片上传
副档名符合则将档案以乱数存档,并返回档案名。
程式的最后,检查收集到的错误代码,如果不等于0则依据代码返回错误讯息提醒使用者重新上传。
ASPUpload的错误代码8,表示档案超出设定的大小。
写好函式后,接着在新增会员资料的页面加上以下的程式码




以上的程式码,我们使用了iFrame用来调用上传的页面,并设为不可见
当按下「上传图片」的按钮后,就将iFrame显示出来,并填入UploadFile.asp这个页面。
[卡国17天传说11]ASP会员管理第十一章照片上传
为什幺要用iFrame,而不直接在页面上使用Form呢?
简单来说明,因为档案的传输格式是串流的方式,和文字不同。如果混在一起的话,反而就取不到来其他的文字栏位了,所以我们独立用一个页面来上传图片,加上一些特效后,感觉起来就像在同一个页面一样。
可以看一下UploadFile.asp里Form的属性
多了ENCTYPE="multipart/form-data"表示资料是以档案的方式传输。
另外这边还加了一些特效,当滑鼠按绿色标题时,可以自由拖动。做法请各位看js/script.js的程式码。
接着选择图片后,按下「上传」按钮。
这里还有一个问题,就是我们如何知道图片是否有上传成功呢?
在上面ASPUpload的函式中,如果上传成功的话,就将「我没设大头贴」这张图换掉,这样一来使用者就很清楚是否有上传成功。
在修改会员的地方也是一样,图片上传后,也要改变原本的图片。
[卡国17天传说11]ASP会员管理第十一章照片上传
[卡国17天传说11]ASP会员管理第十一章照片上传
加上照片后感觉更专业了~
[卡国17天传说11]ASP会员管理第十一章照片上传

相关文章