PlayFramework:控制器中的 Ajax + 拖放 + 文件上传 + 文件对象? [英] PlayFramework: Ajax + Drag n' Drop + File Upload + File object in controller?

问题描述

有谁知道通过 Ajax 上传文件并使用支持 PlayFramework 将文件上传转换为 File 对象的桌面拖放功能的方法吗?

我尝试了几种不同的方法，但没有任何方法可以正常工作.

解决方案

这是我成功的尝试:

编辑路由文件并添加

POST/upload Application.upload

我们的控制器是 Application，我将使用它来保持简单.

编辑您的应用程序控制器类

public static void upload(String qqfile) {如果(request.isNew){FileOutputStream moveTo = null;Logger.info("%s 文件名", qqfile);//我用来获取文件名的另一种方式String filename = request.headers.get("x-file-name").value();Logger.info("绝对发送%s", Play.getFile("").getAbsolutePath() + File.separator + "uploads" + File.separator);尝试 {InputStream 数据 = request.body;moveTo = new FileOutputStream(new File(Play.getFile("").getAbsolutePath()) + File.separator + "uploads" + File.separator + 文件名);IOUtils.copy(data, moveTo);} 捕捉(异常前){//捕获文件异常//稍后捕获 IO 异常renderJSON("{成功:false}");}}renderJSON("{success: true}");}

在 app/views/Application 文件夹/包中编辑您的 Application.html

#{extends 'main.html'/}#{set title:'多次上传'/}<div id="文件上传器"><noscript><p>请启用 JavaScript 以使用文件上传器.</p><!-- 或者在这里放一个简单的上传表单--></noscript><脚本>函数 createUploader(){var uploader = new qq.FileUploader({元素:document.getElementById('file-uploader'),动作:'/上传'，调试:真});}//一旦 DOM 准备好，就在你的应用程序中创建上传器//不要等待窗口加载window.onload = createUploader;

编辑你的主布局:位于 app/views 文件夹/包中的 main.html 并在 jQuery 之后添加这一行

<script src="@{'/public/javascripts/client/fileuploader.js'}" type="text/javascript"></script>

最后说明记得从 AJAX Upload Valums 下载脚本，享受吧！

您也可以在这里获取源.

我在不同的浏览器中测试过它至少对我有用.利雅得在游戏中的功劳！向我暗示 request.body

的邮件列表

P.S:我用的是我之前发表的评论

编辑已按照 T.J. 的指示添加了带有代码的答案.克劳德，我同意:)

Does anyone know of a way to upload a file via Ajax and using drag n' drop from the desktop that supports PlayFramework's ability to convert file uploads to a File object?

I've tried several different methods, and nothing works correctly.

解决方案

Here's my successful attempt:

Edit routes file and add

POST    /upload                                 Application.upload

Our controller is Application, I'll be using it to keep it simple.

Edit your Application controller class

public static void upload(String qqfile) {


if (request.isNew) {

    FileOutputStream moveTo = null;

    Logger.info("Name of the file %s", qqfile);
    // Another way I used to grab the name of the file
    String filename = request.headers.get("x-file-name").value();

    Logger.info("Absolute on where to send %s", Play.getFile("").getAbsolutePath() + File.separator + "uploads" + File.separator);
    try {

        InputStream data = request.body;


        moveTo = new FileOutputStream(new File(Play.getFile("").getAbsolutePath()) + File.separator + "uploads" + File.separator + filename);
        IOUtils.copy(data, moveTo);

    } catch (Exception ex) {

        // catch file exception
        // catch IO Exception later on
        renderJSON("{success: false}");
    }

}


renderJSON("{success: true}");
} 

Edit your Application.html in app/views/Application folder/package

#{extends 'main.html' /}
#{set title:'Multiple Uploads' /}

<div id="file-uploader">
    <noscript>
        <p>Please enable JavaScript to use file uploader.</p>
        <!-- or put a simple form for upload here -->
    </noscript>

    <script>
        function createUploader(){
            var uploader = new qq.FileUploader({
                element: document.getElementById('file-uploader'),
                action: '/upload',
                debug: true
            });
        }

        // in your app create uploader as soon as the DOM is ready
        // don't wait for the window to load
        window.onload = createUploader;
    </script>    
</div>

Edit your main layout: main.html, located in the app/views folder/package and add this line after jQuery

<script src="@{'/public/javascripts/client/fileuploader.js'}" type="text/javascript"></script>

Final notes Remember to download the script from AJAX Upload Valums, enjoy!

You can also grab the source here.

I tested it in different browsers it works for me at least. Credits to Riyad in Play! mailing list who hinted me about the request.body

P.S: I'm using the one I posted as a comment before

Edit The answer with code has been added as directed by T.J. Crowder, I agree :)

这篇关于PlayFramework:控制器中的 Ajax + 拖放 + 文件上传 + 文件对象?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！