【发布时间】：2012-12-26 22:45:36
【问题描述】：
是的，在与各种所见即所得编辑器合作多年后，我实际上正在考虑购买 imperavi 的编辑器所见即所得编辑器 (http://imperavi.com/redactor/)，但是我正在尝试使用试用版和经典 ASP 以使用脚本的图像/文件上传功能，目前图像/文件上传功能是用 PHP/JSON 编写的，并且很想将它们重写为 Classic ASP。
我会尽量把代码贴在下面：
带有编辑器所见即所得的 HTML 表单
<!DOCTYPE html>
<html>
<head>
<title>All uploads</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="../css/style.css" />
<link rel="stylesheet" href="../redactor/redactor.css" />
<script type="text/javascript" src="../lib/jquery-1.8.2.min.js"></script>
<script src="../redactor/redactor.js"></script>
<script type="text/javascript">
$(document).ready(
function()
{
$('#redactor_content').redactor({
imageUpload: '../demo/scripts/image_upload.php',
fileUpload: '../demo/scripts/file_upload.php',
imageGetJson: '../demo/json/data.json'
});
}
);
</script>
</head>
<body>
<div id="page">
<textarea id="redactor_content" name="content">
<h2>Hello and Welcome</h2>
<p>I never did quite grasp him, though he endeavored to explain it to me upon numerous occasions. I suggested telepathy, but he said no, that it was not telepathy since they could only communicate when in each others' presence, nor could they talk with the Sagoths or the other inhabitants of Pellucidar by the same method they used to converse with one another.</p>
<p>"What they do," said Perry, "is to project their thoughts into the fourth dimension, when they become appreciable to the sixth sense of their listener. Do I make myself quite clear?"</p>
<p>"You do not, Perry," I replied. He shook his head in despair, and returned to his work. They had set us to carrying a great accumulation of Maharan literature from one apartment to another, and there arranging it upon shelves. I suggested to Perry that we were in the public library of Phutra, but later, as he commenced to discover the key to their written language, he assured me that we were handling the ancient archives of the race.</p>
<p>During this period my thoughts were continually upon Dian the Beautiful. I was, of course, glad that she had escaped the Mahars, and the fate that had been suggested by the Sagoth who had threatened to purchase her upon our arrival at Phutra. I often wondered if the little party of fugitives had been overtaken by the guards who had returned to search for them. Sometimes I was not so sure but that I should have been more contented to know that Dian was here in Phutra, than to think of her at the mercy of Hooja the Sly One. Ghak, Perry, and I often talked together of possible escape, but the Sarian was so steeped in his lifelong belief that no one could escape from the Mahars except by a miracle, that he was not much aid to us—his attitude was of one who waits for the miracle to come to him.</p>
</textarea>
</div>
</body>
</html>
PHP 图像上传脚本 - (imageUpload: '../demo/scripts/image_upload.php')
<?php
// This is a simplified example, which doesn't cover security of uploaded images.
// This example just demonstrate the logic behind the process.
// files storage folder
$dir = '/home/web/sitecom/images/';
$_FILES['file']['type'] = strtolower($_FILES['file']['type']);
if ($_FILES['file']['type'] == 'image/png' || $_FILES['file']['type'] == 'image/jpg' || $_FILES['file']['type'] == 'image/gif' || $_FILES['file']['type'] == 'image/jpeg' || $_FILES['file']['type'] == 'image/pjpeg')
{
// setting file's mysterious name
$filename = md5(date('YmdHis')).'.jpg';
$file = $dir.$filename;
// copying
copy($_FILES['file']['tmp_name'], $file);
// displaying file
$array = array(
'filelink' => '/images/'.$filename
);
echo stripslashes(json_encode($array));
}
?>
数据 JSON 文件 - (imageGetJson: '../demo/json/data.json')
[
{ "thumb": "json/images/1_m.jpg", "image": "json/images/1.jpg", "title": "Image 1", "folder": "Folder 1" },
{ "thumb": "json/images/2_m.jpg", "image": "json/images/2.jpg", "title": "Image 2", "folder": "Folder 1" },
{ "thumb": "json/images/3_m.jpg", "image": "json/images/3.jpg", "title": "Image 3", "folder": "Folder 1" },
{ "thumb": "json/images/4_m.jpg", "image": "json/images/4.jpg", "title": "Image 4", "folder": "Folder 1" },
{ "thumb": "json/images/5_m.jpg", "image": "json/images/5.jpg", "title": "Image 5", "folder": "Folder 1" },
{ "thumb": "json/images/1_m.jpg", "image": "json/images/1.jpg", "title": "Image 6", "folder": "Folder 1" },
{ "thumb": "json/images/2_m.jpg", "image": "json/images/2.jpg", "title": "Image 7", "folder": "Folder 1" },
{ "thumb": "json/images/3_m.jpg", "image": "json/images/3.jpg", "title": "Image 8", "folder": "Folder 1" },
{ "thumb": "json/images/4_m.jpg", "image": "json/images/4.jpg", "title": "Image 9", "folder": "Folder 1" },
{ "thumb": "json/images/5_m.jpg", "image": "json/images/5.jpg", "title": "Image 10", "folder": "Folder 2" },
{ "thumb": "json/images/1_m.jpg", "image": "json/images/1.jpg", "title": "Image 11", "folder": "Folder 2" },
{ "thumb": "json/images/2_m.jpg", "image": "json/images/2.jpg", "title": "Image 12", "folder": "Folder 2" }
]
额外信息：
起初我无法让图像库显示任何图像，再次浏览stackoverflow后我发现：（Get IIS6 to serve JSON files (inc. POST,GET)?）它说：
默认情况下，W2K3 及更高版本中的 IIS 不会提供不是它所知道的 MIME 类型的文件（而是返回 404 错误）。
您需要将 MIME 类型添加到 IIS 以允许它为该类型的文件提供服务。您可以在站点级别或服务器级别进行设置。
为整个服务器设置这个：
Open the properties for the server in IIS Manager and click MIME Types
Click "New". Enter "JSON" for the extension and "application/json" for the MIME type.
完成此操作后，我可以单击“插入图像”按钮并使用选择选项查看服务器上的实际图像。
现在我需要开始将上面的内容重写到 Classic ASP 中。
出于这个问题的目的，我创建了一个名为“all_uploads_classic_asp.html”的新页面，它基本上是“all_uploads.html”的副本，并带有一些修改的代码，请参阅我对以下代码的更改：
原版：
<script type="text/javascript">
$(document).ready(
function()
{
$('#redactor_content').redactor({
imageUpload: '../demo/scripts/image_upload.php',
fileUpload: '../demo/scripts/file_upload.php',
imageGetJson: '../demo/json/data.json'
});
}
);
</script>
修正版：
<script type="text/javascript">
$(document).ready(
function()
{
$('#redactor_content').redactor({
imageUpload: '../demo/scripts/image_upload.asp',
fileUpload: '../demo/scripts/file_upload.asp',
imageGetJson: '../demo/json/data.json'
});
}
);
</script>
然后我创建了一个名为'image_upload.asp'的新页面，它与原始PHP版本'image_upload.php'位于同一目录中
经典 ASP 上传脚本
<%
' This is a simplified example, which doesn't cover security of uploaded images.
' This example just demonstrate the logic behind the process in Classic ASP
' Written by I.Hekkenberg (DevCentral)
' files storage folder and path
Dim MySaveFolder, MySaveFolderPath
MySaveFolder = "../demo/json/images/"
MySaveFolderPath = "d:\internet\root\www\devcentral.co.uk\wwwroot\demo\wysiwyg\demo\json\images\"
' Server / Script Timeout for storage larger images
Server.ScriptTimeout = 1200
Set objUpload = Server.CreateObject("Persits.Upload")
On Error Resume Next
objUpload.OverwriteFiles = False
objUpload.SetMaxSize 5242880 ' Limit files to 5MB
objUpload.SaveVirtual(MySaveFolder)
' display error message
If Err <> 0 Then
Response.Write "<br />ERROR file uploading: " & Err.Description & " | " & MySaveFolder
Err.Clear
' no error occured so continue as normal
Else
' ======================================================
' HELP NEEDED WITH REWRITTING THE BELOW INTO CLASSIC ASP
'
' // displaying file
' $array = array(
' 'filelink' => '/images/'.$filename
' );
' echo stripslashes(json_encode($array));
'
' ======================================================
End If
Set objUpload = Nothing
%>
现在我不知道下一步该去哪里了，谢谢
如果您需要更多信息，请询问，我会尽快更新
伊万·赫肯伯格
更新：2013 年 1 月 16 日
我已按照“ulluoink”的说明将代码修改为以下内容，但实际上传图像仍然没有运气。
' files storage folder and path
Dim MySaveFolder, MySaveFolderPath
MySaveFolder = "../demo/json/images/"
MySaveFolderPath = "D:\internet\root\www\devcentral.co.uk\wwwroot\demo\wysiwyg\demo\json\images\"
' Server / Script Timeout for storage larger images
Server.ScriptTimeout = 1200
Set objUpload = Server.CreateObject("Persits.Upload")
objUpload.OverwriteFiles = False
objUpload.SetMaxSize 5242880 ' Limit files to 5MB
objUpload.SaveVirtual(MySaveFolder)
' ======================================================
' HELP NEEDED WITH REWRITTING THE BELOW INTO CLASSIC ASP
'
' // displaying file
' $array = array(
' 'filelink' => '/images/'.$filename
' );
' echo stripslashes(json_encode($array));
'
' ======================================================
' Amended code by 'ulluoink'
' write json back to client
with response
.codePage = 65001
.charset = "utf-8"
.contentType = "application/json"
end with
For Each File in objUpload.Files
response.write "{ ""filelink"": """ & MySaveFolder & "/" & File.FileName & """ }"
Next
' ======================================================
Set objUpload = Nothing
%>
如果什么都没有发生或显示任何错误迹象，如何调试呢？我似乎也无法在日志文件中找到任何内容。
PS：以上代码已修改。我删除了经典 asp 的错误处理，一点运气都没有。
更新日期：2013 年 1 月 16 日
好的，所以找到image_upload.asp页面时出错了，这很蹩脚；（在安装firebug并将404错误修复到image_upload.asp后，我在firebug控制台中发现了一个新错误：
TypeError: rawString.match(...) 为空 [打破这个错误]
var jsonString = rawString.match(/{(.|\n)*}/)[0];
指的是redactor.js文件：(http://demo.devcentral.co.uk/wysiwyg/redactor/redactor.js)
uploadLoaded : function()
{
var i = $('#' + this.id)[0];
var d;
if (i.contentDocument)
{
d = i.contentDocument;
}
else if (i.contentWindow)
{
d = i.contentWindow.document;
}
else
{
d = window.frames[this.id].document;
}
// Success
if (this.uploadOptions.success)
{
if (typeof d !== 'undefined')
{
// Remove bizarre <pre> tag wrappers around our json data:
var rawString = d.body.innerHTML;
var jsonString = rawString.match(/\{(.|\n)*\}/)[0];
var json = $.parseJSON(jsonString);
if (typeof json.error == 'undefined')
{
this.uploadOptions.success(json);
}
else
{
this.uploadOptions.error(this, json);
this.modalClose();
}
}
else
{
alert('Upload failed!');
this.modalClose();
}
}
this.element.attr('action', this.element_action);
this.element.attr('target', '');
},
更新和最终结果：18/01/2013
再次在“ulluoink”的帮助下，他向我指出上传脚本中的路径让我很头疼，很明显 Firebug 调试工具将成为我在调试脚本时使用的工具，例如json，我对这个调试器一直给出答案的事实印象深刻，感谢 'ulluoink' 帮助我解决了这个问题。
下面我将发布我用来让它工作的最终代码：
最终编辑器 (WYSIWYG) - image_upload.asp
<%
' This is a simplified example, which doesn't cover security of uploaded images.
' This example just demonstrate the logic behind the process in Classic ASP
' Written by I.Hekkenberg (DevCentral)
' files storage folder and path
Dim MySaveFolder : MySaveFolder = "../json/images"
Server.ScriptTimeout = 1200
Set objUpload = Server.CreateObject("Persits.Upload")
objUpload.OverwriteFiles = False
objUpload.SetMaxSize 5242880 ' Limit files to 5MB
objUpload.SaveVirtual(MySaveFolder)
' code below provide by 'ulluoink'
' write json back to client
with response
.codePage = 65001
.charset = "utf-8"
.contentType = "application/json"
end with
For Each File in objUpload.Files
response.write "{ ""filelink"": ""json/images/" & File.FileName & """ }"
Next
' ======================================================
Set objUpload = Nothing
%>
【问题讨论】：
-
当我尝试上传图片时，我得到一个 http 404 错误 image_upload.asp not found... 你可以使用 firebug 来查看发生了什么
-
好的，已经安装了firebug，可以看到更多细节了，我已经解决了404错误，这是一个愚蠢的时刻，但是仍然没有运气，我发现了一个新错误
-
我收到此错误：Persits.Upload.1 error '800a0005' 系统找不到指定的路径。 /wysiwyg/demo/scripts/image_upload.asp，第 20 行
-
哇，在你提到让自己更多地参与到 firebug 调试器中之后，我必须说，从现在开始，生活会变得更轻松；-) 谢谢一百万，先生/女士，你会为此任务获得了我的赏金。
标签： php json asp-classic