个人中心
gpt4 book ai didi

php - Redactor(所见即所得编辑器)/图片上传/经典ASP/JSON

转载 作者：可可西里 更新时间：2023-11-01 01:04:33 25 4
gpt4 key购买 nike

是的，在与各种所见即所得编辑器合作多年后，我实际上正在考虑购买 imperavi 的 redactor 所见即所得编辑器 (http://imperavi.com/redactor/)，但是我正在尝试使用跟踪版本和经典 ASP 以使用图像/脚本的文件上传功能，目前图片/文件上传功能是用PHP/JSON编写的，并且很想将它们重写为Classic ASP。

我会尽量在下面发布代码:

带有 REDACTOR WYSIYWG 的 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图片上传脚本 - (图片上传:'../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.

完成此操作后，我可以单击“插入图像”按钮并使用选择选项查看服务器上的实际图像。

现在我需要开始将上述内容重写为经典 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
%>

现在我被困在下一步去哪里，谢谢

如果您需要更多信息，请询问，我会尽快更新

伊万·赫肯伯格

更新:16/01/2013

我已按照'ulluoink'的说明将代码修改为以下内容，但是实际上传图像仍然没有运气。
<%
' 这是一个简化的示例，不包括上传图像的安全性。
' 这个例子只是演示了 Classic ASP 中的流程背后的逻辑
' 由 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")
        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 的错误处理，完全没有运气。

更新:16/01/2013

好的，所以在找到 image_upload.asp 页面时出现了错误，这很蹩脚；(，在安装 firebug 并将 404 错误重新验证到 image_upload.asp 后，我在 firebug 控制台中发现了一个新错误:

类型错误: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
%>

最佳答案 

'create instance of uploaded file
set File = objUpload.Files("file") 

' write json back to client
with response
  .codePage = 65001
  .charset = "utf-8"
  .contentType = "application/json"
end with

response.write "{ ""filelink"": """ & MySaveFolder & "/" & File.FileName & """ }"

你可以使用类似 this 的类对于 json 生成...

关于php - Redactor(所见即所得编辑器)/图片上传/经典ASP/JSON，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14293633/

25 4 0
文章推荐： iOS 识别多个异步调用的完成
文章推荐： java - 来自 == 运算符的 "Invalid assignment"错误
文章推荐： Java:获取 FontMetrics 实例的更友好的方式
文章推荐： PHP JSON 解析，缺少项目
可可西里
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com