How to send custom form data to FineUploader Azure Success endpoint? - fine-uploader

I am using FineUploader 5.13.0 with the Azure Blob Storage end point.
I have it successfully uploading files directly to blob storage, and also successfully hitting my web server success endpoint when the upload is concluded.
However, I am looking for a way to include custom data in the post to the success endpoint.
This bit in the documentation seems to imply that it is possible.
Under the section "Optional server-side tasks" for "uploadSuccess.endpoint", it says it will send
"Any parameters/form fields you have associated with the file".
However, I just cannot seem to figure out how to do that.
This issue seems to refer to it, but doesn't give enough info.
https://github.com/FineUploader/fine-uploader/issues/1313
Note, I am not referring to the feature to hook into existing HTML forms as explained on this documentation page:
"Integrating with Existing HTML Forms"
https://docs.fineuploader.com/branch/master/features/forms.html

You might be looking for FineUploader's Request params. This allows you to add extra form data.
Eg:
new qq.FineUploader({
// elided
request: {
params: {
testing: "THIS IS A TEST"
}
}
});
This will show up in the multi-part body of the request:

Related

Upload pdf using ajax and servlet [duplicate]

Can I send a file as multipart by XMLHttpRequest to a servlet?
I am making a form and submitting it as multipart, but somehow I am not getting a response for successfully uploading it. I do not want the page to be refreshed, so it has to take place by Ajax.
That's only possible with the XHR FormData API (previously known being part of as "XHR2" or "XHR Level 2", currently known as "XHR Advanced Features").
Given this HTML,
<input type="file" id="myFileField" name="myFile" />
you can upload it as below:
var formData = new FormData();
formData.append("myFile", document.getElementById("myFileField").files[0]);
var xhr = new XMLHttpRequest();
xhr.open("POST", "myServletUrl");
xhr.send(formData);
XHR will take care about proper headers and request body encoding and the file will in this example be available on the server side as form-data part with the name myFile.
You need to keep in mind that FormData API is not supported in older browsers. At caniuse.com you can see that it's currently implemented in Chrome 7+, Firefox 3.5+, Safari 5+, Internet Explorer 10+ and Opera 12+.
In case you're using jQuery, then you might be tempted to use its $.val() function as below:
formData.append("myFile", $("#myFileField").val());
But this is incorrect as it doesn't return the whole File object, but merely the file name as String which is utterly useless as it doesn't contain the file contents.
If you don't want to use document.getElementById() for some reason, then use one of the following instead:
formData.append("myFile", $("#myFileField").prop("files")[0]);
formData.append("myFile", $("#myFileField")[0].files[0]);
An alternative is to use the jQuery Form plugin. Your entire form, when written and functioning properly without any line of JavaScript code, will then instantly be ajaxified with just the following line:
$("#formId").ajaxForm(function(response) {
// Handle Ajax response here.
});
It also supports file uploads as well by a hidden iframe trick. See also this jQuery Form documentation for an in-depth explanation. You may only need to change the servlet code to be able to intercept on both normal (synchronous) and Ajax (asynchronous) requests. See also this answer for a concrete example: Simple calculator with JSP/Servlet and Ajax
Either way, the uploaded file should then be available in the doPost() method of a #MultipartConfig servlet as follows:
Part myFile = request.getPart("myFile");
Or if you're still on Servlet 2.5 or older, use Apache Commons FileUpload the usual way. See also this answer for a concrete example: How can I upload files to a server using JSP/Servlet?
It's not possible to send multipart/form-data with XMLHttpRequest (though it is possible in modern browsers, with XHR2. See BalusC's answer).
A common way to achieve what you want is to use a regular form, but in an iframe instead. This way, only the iframe is refreshed on upload.

How to import grafana dashboard json file manually

I have exported the dashboard in json format.
I want to import the json file manually to create the same dashboard in new grafana instance.
While googling i got some related information but finding difficulties to implement successfully.
From the site Grafana API link i got the code snippet like,
POST /api/dashboards/db HTTP/1.1
Accept: application/json
Content-Type: application/json
Authorization: Bearer eyJrIjoiT0tTcG1pUlY2RnVKZTFVaDFsNFZXdE9ZWmNrMkZYbk
{
“dashboard”: {
“id”: null,
“uid”: null,
“title”: “Production Overview”,
“tags”: [ “templated” ],
“timezone”: “browser”,
“schemaVersion”: 16,
“version”: 0
},
“folderId”: 0,
“overwrite”: false
}
The above code snippet looks like we can create new dashboard with existing json file but i have no idea of how to implement this code snippet successfully.
Somebody guide me how to achieve this?
There are two techniques to copy the current dashboard -
if you want to export this
Go to Current Grafana Dashboard
Select the Share button on the top
Select the Export Button and Copy the JSON or save it as JSON
Create new Grafana dashboard and copy this JSON model to
Click on the Setting button on the top
Click on JSON Model - from left panel
Past the JSON & Save the dashboard and run
Please let me know if you have any issue.
I found and answer to your question - how to import a dashboard in grafana by api - in this post on the community board of Grafana:
https://community.grafana.com/t/how-create-dashboard-and-panel-via-api/10947
Haven't tried this out yet though (we are planning on doing something like this as well).
I will quote the original question in this post:
Hi All,
I know how to create a dashboard via API but I don’t find instructions to how to create panels within that dashboard still via API. Any idea?
the part of the message that explains the answer:
And the response that contains the answer to the question:
The panels need to be defined within the JSON that you submit in your POST request.
The example in the docs doesn’t spell this out, beyond
dashboard – The complete dashboard model
To get hands-on with this, you can (1) create a new dashboard with some panels manually, (2) export that dashboard’s definition as JSON, (3) put the exported dashboard definition inside the “dashboard” field of a new JSON object, (4) POST the resulting JSON object to the API endpoint. This will create a copy of your original dashboard. From there on, you can edit the JSON model you’re posting in order to modify or add any panels you desire.
So to your original question, if you want to add a panel to an existing dashboard you can obtain its definition via the API, add the panel to the JSON object, and push the updated model. (keep the same id/uid and set "overwrite": true)"
Note that (now?) grafana has a nice import function too:

Retrieving XML data from a ReST service across domains with Dojo

I am trying to write a browser-based Javascript client for a ReST application which responds with XML (so it seems JSONP is out of the questions).
I am trying to retrieve the data using dojo.io.script.get but the parameter that is passed to the callback function is an object from which it seems I cannot retrieve the XML data of the response.
dojo.io.script.get({url:"http://enterpriseapp.enterprisedomain/path/to/rest/collection",
load:function (data) {
// 'data' does not contain the actual response (which is XML)
}
});
What is the correct way to retrieve this data?
The dojo.io.script.get method will inject a <script> from the specified web address. The data content from this script will be passed to your load function; hence, the content must validate as Javascript. You can't load XML into a script tag.
If you want to load XML, you'll need to use dojo.xhrGet; however, this will not allow requests to 3rd party urls. The advantage of using dojo.io.script.get is that you can use different origin address' than the page loading them.
dojo.xhrGet({
handleAs: "xml",
load: function(dom){
// do something with the DOM XML object
},
error: function(error){
}
});
See: dojo.xhrGet Documentation
If you are trying to load the XML from another website it's a bit of a dead-end. You can use the Access-Control-Allow-Origin header if you have access to the sending server.
Another solution that I have used is to write a proxy script (in PHP or other server language) to mirror the XML on the correct domain. You'll need to be careful if you do this to include good checks so that your server code is not abused by someone for proxying.
See the following Stackoverflow conversation for more about Access-Control-Allow-Origin:
jQuery XML REST Access-Control-Allow-Origin

Retrieving JSON from an external API with backbone

I'm new to backbone.js and I've read other solutions to similar problems but still can't get my example to work. I have a basic rails api that is returning some JSON from the url below and I am trying to access in through a backbone.js front end. Since they are one different servers I think I need to use a 'jsonp' request. I'm currently doing this by overriding the sync function in my backbone collection.
Api url:
http://guarded-wave-4073.herokuapp.com/api/v1/plans.json
sync: function(method, model, options) {
options.timeout = 10000;
options.dataType = 'jsonp';
options.url = 'http://guarded-wave-4073.herokuapp.com/api/v1/plans.json'
return Backbone.sync(method, model, options);
}
To test this I create a new 'plans' collection in my chrome console using "plans = new Plans()" and then "plans.fetch()" to try and get the JSON.
When I call plans.models afterwards I still have an empty array and the object that returns from plans.fetch() doesn't seem to have any json data included.
Any ideas where I'm going wrong?
I have had the same problem before. You should not have to override your sync method.
Taken from Stackoverflow Answer
"The JSONP technique uses a completely different mechanism for issuing HTTP requests to a server and acting on the response. It requires cooperating code in the client page and on the server. The server must have a URL that responds to HTTP "GET" requests with a block of JSON wrapped in a function call. Thus, you can't just do JSONP transactions to any old server; it must be a server that explicitly provides the functionality."
Are you sure your server abides to the above? Test with another compatible jsonp service (Twitter) to see if you receive results?
Have you tried overriding the fetch method as well?
You should add ?callback=? to your api url in order to enable jsonp

post function of jquery

I am running this code :
$.post('https://graph.facebook.com/me',{},
function(msg){
console.log( "Data Saved: " + msg );
}
);
and I am only getting Data Saved : as output in firebug nothig else is coming and call to the url is also not showing why ?
You can't post to another domain (or protocol, or port). More specifically, you can but you can't see the response that comes back for security reasons. This is part of the same origin policy browsers implement to keep your data from being posted/exploited on remote domains that aren't the same as the page you went to.
Picture for example I loaded http://www.yoursite.com and it tried to repeatedly post (as me remember) to https://www.mybank.com, using my stored cookies, etc...you see how you really wouldn't want that to happen...that's why it's disallowed and the response you get back will be null instead of actually seeing the content.
In this case you're looking for one of their API calls using JSONP (callback=? on the URL in jQuery), which works by creating a <script> tag...an entirely different thing altogether. In your case you're looking for something like this:
$.getJSON('https://graph.facebook.com/me?callback=?', function(msg){
console.log(msg);
});
Though, that's not a valid API call by itself (e.g. you need an access token at least), you'll need to use the method you're actually looking for instead.
Bit of a tangent, but since this is so misunderstood, let's take another more popular example to illustrate the dangers if this was allowed. Think about all those services you stay logged into, Facebook, Twitter, etc. This is another facet of the same origin policy, not allowing your cookies, etc to be used is you do try and post...why is this? If my page could just post to Facebook or Twitter already logged in as you, man I could easily broadcast whatever message I wanted...you can see how this would be useful....and immediately used for evil as well.

Resources