plupload - send another request parameter with uploaded file - javascript

plupload creates nice ids in file object. How this id can be sent to the upload script?
The upload script has 3 variables in $_POST - file name, chunk number and total number of chunks.
How to add another parameter to plupload's POST request (in my case, the file.id)?

The first step would be to add a handler to the BeforeUpload event.
Then, if you are using multipart, you can change the uploader settings to dynamically set different multipart params:
plupload_instance.bind('BeforeUpload', function (up, file) {
up.settings.multipart_params = {fileid: file.id}
});
(warning: this example overrides any and all multipart_params, you can play it smarter than that by just setting fileid)
if you are not using multipart, your only options would be to pass the argument as a header, or to manually add the param to the URL for each file (these 2 options should also be done within BeforeUpload).
Note that when not using multipart, plupload will add the name and chunk params to the URL after any URL you already set for the uploader, for each file, so this is where extra params go.

Related

Next js - How to pass multiple parameters in url for api?

I am able to pass one parameter and get results from next js api
The docs are very helpful - https://nextjs.org/docs/api-routes/dynamic-api-routes
/api/posts/[postId].js
The above works but is there an option to pass another parameter like below?
/api/posts/[postId][userId].js
The folder name is currently [postId]. I tried renaming it to [postId][userId]
My code for api is
let postVotes = await req.db.collection('votesPosts').count({"post":req.query.postId,"user":req.query.userId})
Usually, routes don't handle multiple parameters in a single segment of the URL path. You can only have one parameter per segment:
/api/entity/{param1}/{param2}/sub/{param3}
Now in Next JS, you need to separate them too to have 2 segments with param:
/api/posts/[postId]/[userId]
Which would resolve to 2 possible files:
/api/posts/postId]/[userId]/index.js
if you do it with a parameter directory + index file, or
/api/posts/postId]/[userId].js
if you do it with a parameter file.
Doing it with directory + index file allow you to add fixed segments like:
/api/posts/postId]/[userId]/popular.js
/api/posts/postId]/[userId]/private.js
Then you can make your API call as you did it for 2 params.

Not getting file data in Extjs Ajax request

I have a form on form-window, and inside form window I have a form with many fields and one upload button. When try to submit form using Ajax.request I have got textfield value but can not get file data. Except filename.
var fd = Ext.getCmp('users-form').form;
var fileInput = document.getElementById('company_logo');
console.log(fd.getEl().dom.files);
params = {
name : fd.findField('name').getValue(),
login : fd.findField('login').getValue(),
email : fd.findField('email').getValue(),
password : fd.findField('password').getValue(),
password_repeat : fd.findField('password_repeat').getValue(),
id : fd.findField('id').getValue()
company_logo : fd.findField('logo').getValue()
}
console.log(params);
Ext.Ajax.request({
url: Scada.reqUrl('users', 'save'),
method: 'post',
params: {
data: Ext.encode(params)
},
success: function() {
console.log('in success');
},
failure: function() {
console.log('in failure');
}
});
Here logo is input type file. I want to send logo data with ajax request. Please help me to figure out the problem. Thanks
Not sure why you started a new question instead of editing Encode form data while fileupload true in Extjs Form Submit as this seems to be the same problem.
Assuming logo is your file upload field you are trying to get the file data using getValue does not actually return the file content (if you use modern there is a getFiles method which returns the selected file objects).
General problems with your approach:
As I stated in my original answer it is not a good idea to send files in a standard ajax request. In your case those problems are:
If you expect getValue to return file contents, you are potentially encoding binary data into a JSON string. This will maybe work but create a large overhead and as the only available JSON datatype that could handle this content is string your parser would have to guess that property company_logo contains binary data and needs to be somehow converted into some sort of file reference.
You are sending files without metadata, so when just adding the raw content into your JSON string you would not be able to detect the expected file type without testing the file in multiple ways
As far as I know you would not be able to access the file content in classic toolkit at all
Submitting the data as a form: In your original question you explained that you submit the form instead of doing Ajax requests which is generally the preferred way.
When you submit a form that contains a file upload field the form will automatically be submitted as multipart/form-data the raw files are added to the request body with it's original content while preserving metadata collected by the browser.
If you look at https://docs.sencha.com/extjs/7.0.0/modern/Ext.Ajax.html#method-request you would have to set isUpload to true and use the form proeprty instead of params, passing a reference to the parent form.

CKEditor uploadimage change name=upload

I use plugin uploadimage CKEditor.
How to properly configure the plugin to transfer its name to the field, rather than the standard application.
Upload URL:
config.filebrowserUploadUrl = '/uploadfiles.nsf/uploadfiles?CreateDocument';
plugin use:
<input type="file" name="upload">
It should be like this:
<input type="file" name="%%File.4325814d00377965.3570884048d1a3c44325812a003cb5ad.$Body.0.96">
Tell me which parameter is responsible for this
You can modify the default file upload behavior before sending the request as follows -
// Get CKEditor instance
var editor = CKEDITOR.instances.editor1;
// Modify CKEditor's default request data object on 'fileUploadRequest' event
editor1.on('fileUploadRequest', function(evt) {
// Copy contents of 'upload' image field to a new field with 'new_name'
var requestDataObject = evt.data.requestData;
requestDataObject['new_name']=requestDataObject['upload'];
// Delete old 'upload' image field from the request data object
delete requestDataObject['upload'];
} );
Here's the official documentation where they talk about editing the default request object with new headers and data items - https://ckeditor.com/docs/ckeditor4/latest/guide/dev_file_upload.html#editor-side-configuration.
Unfortunately, they leave it to you to figure out a way to modify the existing 'upload' field by simply saying -
Note that the default file to be uploaded is also a property of
evt.requestData named upload and it can be overwritten when
neccessary.
You can get your file's name in the response of your server.
see a example in php :
if (file_exists("img/" . $_FILES["upload"]["name"]))
{
echo $_FILES["upload"]["name"] ;
}
you can also see the documentation of CKEditor on upload file : http://docs.ckeditor.com/#!/guide/dev_file_upload

Customer parameter are not going through for file delete

I have setup to directly upload image to s3 bucket and I am using fine uploader for that.
I am trying to send filename as parameter (to end point) while deleting a file.
Given below is callback snippet .
onDelete: function(id) {
$(this).setDeleteFileParams({ filename: this.getName(id) });
}
It is working fine for newly uploaded files, but I already have files through initialList (Option) and when I try to delete them the filename param is not going through.
You are not using the jQuery wrapper correctly. This is one of many reasons why I have suggested avoiding jQuery and the jQuery wrapper, as the "vanilla" API is much more intuitive. You've left out some code, but it looks like you are actually declaring your event handler as a property of the callbacks config object, which means you can avoid the jQuery wrapper entirely.
onDelete: function(id) {
var name = this.getName(id);
this.setDeleteFileParams({filename: name}, id);
}
But this code is not necessary, as Fine Uploader S3 sends the name of the object in S3 as a "key" parameter with the delete request.

fineuploader how to override the provided UUID

We're trying to pass an unique ID into Fineuploader (4.2.2, JQUERY) and reuse that into the fineuploader.js to set the foldername of where the upload is stored.
We basicly found two option:
Set the request option uuidName, which should be a string. Passing this one will result in "null" in console and doesn't do the trick.
Create a params request option where we define a variable with a value.
Option 2 get passed though we've got no idea how we get this value and process it into fineuploader.js (and alter the qq.getUniqueId-function with this new var for example).
Anyone know how we can get this done?
Thanks so much!
EDIT:
Underneath the code which initiates the uploader, how do I get the fileID inside the fineuploader.js?
$(".fine-uploader").fineUploader({
request: {
endpoint: 'server/endpoint',
params: {
fileID: '12345'
}
}
If you would like to override the UUID Fine Uploader creates for a file, you can do so either by passing your new UUID client-side via the setUuid method, or your server can return a newUuid property with its value set to the new UUID in its JSON response.

Categories