【问题标题】:dropzone.js image upload to different server (cross domain)dropzone.js 图片上传到不同的服务器(跨域)
【发布时间】:2014-01-09 02:44:24
【问题描述】:

这是我上传图片的代码,如果我将表单操作作为同一服务器,它工作正常

如果我对不同的服务器采取行动,则无法正常工作

html:

<div id="dropzone">
                                <form action="http://localhost:8080/stardom/api/v1/image" class="dropzone">
                                    <input type="hidden" name="album_id" value="" id="album_id" />
                                    <div class="fallback">
                                        <input name="file" type="file" multiple="" />
                                    </div>
                                </form>
                            </div>

js:

$(".dropzone").dropzone({
                paramName: "file", // The name that will be used to transfer the file
                maxFilesize: 2, // MB
                acceptedMimeTypes : 'image/*',
                addRemoveLinks : false,
                dictDefaultMessage :
                '<span class="bigger-150 bolder"><i class="icon-caret-right red"></i> Drop files</span> to upload \
                <span class="smaller-80 grey">(or click)</span> <br /> \
                <i class="upload-icon icon-cloud-upload blue icon-3x"></i>'
            ,
                dictResponseError: 'Error while uploading file!',

                //change the previewTemplate to use Bootstrap progress bars
                previewTemplate: "<div class=\"dz-preview dz-file-preview\">\n  <div class=\"dz-details\">\n    <div class=\"dz-filename\"><span data-dz-name></span></div>\n    <div class=\"dz-size\" data-dz-size></div>\n    <img data-dz-thumbnail />\n  </div>\n  <div class=\"progress progress-small progress-success progress-striped active\"><span class=\"bar\" data-dz-uploadprogress></span></div>\n  <div class=\"dz-success-mark\"><span></span></div>\n  <div class=\"dz-error-mark\"><span></span></div>\n  <div class=\"dz-error-message\"><span data-dz-errormessage></span></div>\n</div>",
                complete : function(){

                    if (this.getUploadingFiles().length === 0 && this.getQueuedFiles().length === 0) {
                        loadImages();
                    }

                }
              });

问题:如何让 dropzone.js 将文件上传到不同的服务器?

【问题讨论】:

    标签: javascript jquery node.js cross-domain dropzone.js


    【解决方案1】:

    如果您要做任何事情,ServerA 将内容提供给浏览器并且浏览器想要将信息发送到 ServerB,并且您正在通过 javascript/ajax 执行此操作,您将需要告诉接收服务器 B它应该接受来自它不只是服务的服务器的数据发布。通常这是使用 访问控制允许来源“*” 在您的 .htaccess 文件中。

    我对此有一些经验,但不是很多。我已经在不需要担心 XSS 的内部平台应用程序上使用它。希望有帮助。抱歉这么晚了。

    【讨论】:

    • 我正在使用节点,我的代码中已经有Access-Control-Allow-Origin "*",但是我已经得到了解决方案,我将其更新为答案
    【解决方案2】:

    我使用了这段代码,它成功了。

    //CORS middleware
    var allowCrossDomain = function(req, res, next) {
        res.header('Access-Control-Allow-Origin', '*');
        res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, X-Requested-With, Cache-Control, Accept, Origin, X-Session-ID');
        res.header('Access-Control-Allow-Methods', 'GET,POST,PUT,HEAD,DELETE,TRACE,COPY,LOCK,MKCOL,MOVE,PROPFIND,PROPPATCH,UNLOCK,REPORT,MKACTIVITY,CHECKOUT,MERGE,M-SEARCH,NOTIFY,SUBSCRIBE,UNSUBSCRIBE,PATCH');
        res.header('Access-Control-Allow-Credentials', 'false');
        res.header('Access-Control-Max-Age', '1000');
    
        next();
    }
    server.use(allowCrossDomain);
    

    【讨论】:

      猜你喜欢
      • 2011-08-23
      • 2014-06-30
      • 2011-06-01
      相关资源
      最近更新 更多