fineUploader Failed in the Request To endpoint and the cause in onError Callback is UnKnown Reason - fine-uploader

kindly i have to pages using fineUploader ,
the first page is working correctly but the second isn't : the response in debugging browser console is:
My Html Body will be existing here.
Simple upload request failed for 0
[Fine Uploader 5.11.8] Error when attempting to parse xhr response
text (Unexpected token < in JSON at position 0)
for the point one :(the request didn't reach the endpoint because i made a tester in the endpoint page if any script accessed it)
so the request in the first page is working and the same request with the same path in endpoint property isn't working in the second
i read many articles with the same error but all of them were not identifying correct endpoint path , which i did correctly and tested in the first Page.
var uploader = new qq.FineUploader({
debug: true,
element: document.getElementById('my-uploader'),
request: {
endpoint: "http://localhost/fineuploader/endpoint.php",
// endpoint: "http://localhost/fineuploader/endpoint.php",//commented to prove that i used //both of the relative and absolute paths
},
chunking: {
enabled: true,
concurrent: {
enabled: true
},
success: {
endpoint: "http://localhost/fineuploader/endpoint.php?done",
}
},
deleteFile: {
enabled: true,
endpoint: "http://localhost/fineuploader/endpoint.php"
},
retry: {
enableAuto: true,
showButton: true
},
form:{element:"FormId", },
callbacks: {
onError: function(id, name, errorReason, xhrOrXdr) {
alert(qq.format("Error on file number {} - {}. Reason: {}", id, name, errorReason));
},
});

The Answer of Mr Ray Nicholus Here was useful but i want to provide the solution in my case and my mistake, my problem was that in the first page i didn't provide action attribute in form tag and in the second i did , so when i provided in the second page the action of the form a different value than what is specified in
<form id="test" action="form.php">
request: {
endpoint: "http://localhost/fineuploader/endpoint.php",},
the requests were going to the action attribute value path(form.php) not for the above request value (endpoint.php).

It's really very simple, and there is no other answer to this question: either your endpoint is incorrect (and of course the response will be invalid too) or your endpoint is correct but your endpoint is not returning valid JSON. You'll need to look at the response closely to determine the issue.
In your case, your endpoint is returning HTML, not JSON. You'll have to fix this on your server.

Related

Fineuploader possible solution to force header return true if default server will not return following JSON Data

Not sure if it's possible to force fineuploader to fire true success upload in anyway. im facing the issue of submitting form to a url "http://119.29.222.368:8991/upload"(sample ip due to P&C) where it will return only Status : "OK" without Success : true.
Following is my code, pretty sure that it successfully submitted, but my UI will get error due to the API is not returning the value success.
var uploader = new qq.FineUploader({
element: document.getElementById("uploader"),
cors: {
allowXdr: 'true',
expected:'true'
},
request: {
method:'POST',
// endpoint: '/upload',
endpoint: 'http://119.29.222.368:8991/upload',
forceMultipart:'true',
inputName:'filename',
params: {
'token': <%- JSON.stringify(token) %>,
'path':"/images/feed/"
}
}
})
This was originally requested in github.com/FineUploader/fine-uploader/issues/1325. Follow the linked pull request at the end of that issue for updates. – Ray Nicholus 20 hours ago

Ext Data Session and bad server response ("[W] Ignoring server record: ...")

Our application handles and manages records changes on the client side. We use ExtJS5 Data Session mechanism.
A session tracks records that need to be updated, created or destroyed
on the server. It can also order these operations to ensure that newly
created records properly reference other newly created records by
their new, server-assigned id.
Let me introduce short use case.
User opens and fills a form. Behind the scene fields are binded to entity object which is tracked by session. When user clicks Submit then session is synchronized, i.e. Ext sends requests to the server and parse response. Here I've encountered a problem.
Server returns following object but Ext does not recognize it:
[{"success": false, errorMessage: "error"}]
Ext prints warning:
[W] Ignoring server record: {"success":false}
or
[W] Ignoring server record: {"success":true}
My question is how should look server response in order to indicate that record is not accepted/saved by backend?
The source code where above warning is printed: http://docs-origin.sencha.com/extjs/5.0/apidocs/source/Operation.html (in function doProcess)
Below I put snippet how I'm starting a batch operation (sync session):
var session = this.getViewModel().getSession(),
saveBatch = session.getSaveBatch();
saveBatch.on('complete', function (batch, operation, eOpts) {
// whole batch processing has been completed
/*...*/
});
saveBatch.on('exception', function (batch, operation, eOpts) {
// exception has been occurred (possible for each operation) (such as HTTP 500)
/*...*/
});
saveBatch.on('operationcomplete', function (batch, operation, eOpts) {
// single operation has been completed
// now, every operation is marked as successful
/*...*/
});
saveBatch.start();
update 26.09.2014
Sencha developer has suggested including an id of object in the response. so I've modified server response to:
[{"id": 10, "success": false}]
but this does not solve the problem.
I spend some time on debugging Ext.data.operation.Operation.doProcess method and I analyzed a sample code from sencha support. Ultimately I've found the solution.
There is my proxy config:
proxy: {
type: 'rest',
// ...
reader: {
type: 'json',
rootProperty: 'data',
totalProperty: 'totalCount',
successProperty: 'success',
messageProperty: 'errorMessage'
}
}
Server response when some error occured:
{
"success": false,
"errorMessage": "<error message>"
}
Server response when data was successfully saved:
The minimal form for delete or update record without changing data:
{
"success": true,
}
The extended form for creating or updating record with changing record data:
{
"success": true,
"data": [{
clientId: 5, // clientIdProperty
id: 5,
// [optional] fields to change, e.g.:
name: 'new name'
}]
}
I modified a demo which I have from sencha support:
https://fiddle.sencha.com/#fiddle/bem
in proxy config use data2.json for error and data3.json for success response.

S3 Upload Issue

I am trying to upload a file on S3. I have been verified everything couple of times and all looks correct to me, but whenever I am trying to upload file, getting error message saying
responseText =
InvalidArgumentPOST requires exactly one file upload per request.0file3670E4EE52B3BCD5b3rOF/9WJHymo1ZENIOlrct/ZusAJ50AnSIP0df3K3+DdEcAFolJDx8qU6DH2N1l
Can someone please help me to findout what I am doing wrong here?
<div id="s3-fileuploader" class="dropArea"></div>
<script type="text/javascript">
j$ = jQuery.noConflict();
//block and unblock UIbased on endpoint url
function setUI(){
j$('div.dropArea').unblock();
}
$(document).ready(function () {
$('#s3-fileuploader').fineUploader({
request: {
endpoint: "https://{!bucketname}.s3.amazonaws.com",
accessKey: "{!key}"
},
signature: {
//always included
"expiration": "{!expireStr}",
signature : "{!signedPolicy}",
policy: "{!policy}",
"conditions":
[
//always included
{"acl": "public-read"},
//always included
{"bucket": "{!bucketname}"},
//not included in IE9 and older or Android 2.3.x and older
{"Content-Type": "{!ContentType}"},
//always included
{"key": "{!key}"},
//always included
{"x-amz-meta-qqfilename": "{!URLENCODE('test.jpg')}"},
]
},
cors: {
expected: true, //all requests are expected to be cross-domain requests
sendCredentials: false, //if you want cookies to be sent along with the request
allowXdr: true
},
autoUpload: true,
multiple:false,
debug: true,
text: {
uploadButton: '<i class="icon-plus icon-white">Select Files</i> '
},
uploadSuccess: {
endpoint: "{!redirectURL}"
}
}).on('submit',function(event,id,name){
//set endpoint
console.log('https://{!bucketname}.s3.amazonaws.com');
$(this).fineUploader('setEndpoint','https://{!bucketname}.s3.amazonaws.com');
});
setUI();
});
</script>
</body>
The signature option is supposed to include information about your signature server. Instead you are apparently attaching an (invalid) policy document to this option. Furthermore, you do not create the police document, Fine Uploader creates it for you and passes it to your signature server for signing.
Also you should be using the fineUploaderS3 jquery plugin for this.
It looks like you have not read the documentation that describes how Fine Uploader S3 works. I suggest starting with the guides on the home page of http://docs.fineuploader.com.

extjs form.load using the url of different domain server to fetch the data and bind to fields

I want to load the form fields using json data.
I am using extjs 4.1 for ui and asp.net webapi to fetch the data.
My objective is to load the data and bind it to the field dynamically which form.load is used for if the name of field corresponds to the data.fieldnameproperty.
i have taken the below link as reference :
Ext JS: FormPanel not populating fields with JSON data
It loads the data if the Webapi is on the same project :
i.e.
projectname:
--ui folder
-- webapi controller folder
but in my case the data is coming from different domain 2 different project for ui and webapi. My form.load code is as below
formCmp.getForm().load({
url: 'http://localhost/WebApiCore/api/Values/',
method: 'GET',
headers: {'Content-type': 'application/json'},
// params: {
// empId: '111'
// },
success: function (form, action) {
console.log(action.result);
//Ext.Msg.alert("Load success", action.result);
},
failure: function (form, action) {
//Ext.Msg.alert("Load failed", action.result.errorMessage);
}
});
I get the error as "NetworkError: 405 Method Not Allowed - "http://localhost/WebApiCore/api/Values/?_dc=1340261175475" in firebug.
my project is running on "http://localhost:54118/PreHospital.htm"
I am not sure is it the problem of extjs not sending the cross domain request using form.load or the problem with webapi doesn't allow cross domain request.
I am not sure how to set extjs to send the jsonp request using form.load.
any kind of help is appreciated.
If you just have regular form fields on your Ext Form, it will actually do an AJAX call to submit this data. I don't think there is a way to force a form.load to do a JSONP request. You will probably need to do a manual JSONP request like you would a manual AJAX request.
Ext.data.JsonP.request({
url : websiteURL,
scope : this,
params : {
empId: '111'
},
success : function(jsonData) {
},
failure : function(jsonData) {
Ext.Msg.show({
title : 'Warning',
msg : message,
buttons : Ext.Msg.OK,
icon : Ext.Msg.WARNING
});
}
});

sencha touch - ajax call to server (url , extra parameter formation)

I am using this to get the result from server
controller.allVisitStore = new Ext.data.Store({
model: 'allVisit',
autoLoad : true,
proxy: {
type: 'ajax',
id: 'allvisit_app_localstore',
url: '/RadMobApp/api',
extraParams:{
action:'query',
queryName:'GET_ALL_VISIT',
authToken: localStorage.getItem("auth_token"),
patTicketId: localStorage.getItem("patientId"),
retFormat:'XML',
keyValuePair:'yes'
},
// the return will be XML, so lets set up a reader
reader: new Ext.data.XmlReader({
// records will have an "T4" tag
record: 'data'
})
}
});
but i am not getting any thing.But i formed this url in browser and checked this i got the correct result. now here i want to check is there any problem in the url formation.How to check the url formation with extra parameter which is pass through ajax. I have checked in Inspect element-> network -> api there is no any api request found there.Is anything wrong in my code. Thanks in advance...
Use Firebug for Firefox or Chrome's developer tools to see what's going on when that store attempts to load itself. My hunch is that your url is incorrect and should be url: '/api' because RadMobApp is probably your app root.

Resources