I am using ckEditor with the file browser, filemanager plugin in it. What i am trying to achieve when i configure the CKeditor I am able to browse the file in a certain folder .. but when i try to upload the file through it I am getting an error of 400 Bad Request may be there is something which I need to do ?
Following is my code
[HttpPost]
CKEDITOR.replace('content_editor',{
customConfig: '/assets/back/dist/plugins/ckeditor/config.js',
"imageBrowser_listUrl" : "/webmaster/files/browser"
});
CKEDITOR.on('fileUploadRequest', function (evt) {
var fileLoader = evt.data.fileLoader,
formData = new FormData(),
xhr = fileLoader.xhr;
xhr.open( 'PUT', fileLoader.uploadUrl, true );
formData.append( 'upload', fileLoader.file, fileLoader.fileName );
fileLoader.xhr.send( formData );
// Prevented the default behavior.
evt.stop();
} );
Request Handler C# ASP.NET CORE 3.1
public async Task<IActionResult> UploadFromEditor([FromForm]IFormFile upload)
{
if (upload.Length <= 0) return null;
if (!upload.IsImage())
{
var NotImageMessage = "please choose a picture";
dynamic NotImage = JsonConvert.DeserializeObject("{ 'uploaded': 0, 'error': { 'message': \"" + NotImageMessage + "\"}}");
return Json(NotImage);
}
var fileName = Guid.NewGuid() + Path.GetExtension(upload.FileName).ToLower();
Image image = Image.FromStream(upload.OpenReadStream());
int width = image.Width;
int height = image.Height;
if ((width > 750) || (height > 500))
{
var DimensionErrorMessage = "Custom Message for error";
dynamic stuff = JsonConvert.DeserializeObject("{ 'uploaded': 0, 'error': { 'message': \"" + DimensionErrorMessage + "\"}}");
return Json(stuff);
}
if (upload.Length > 500 * 1024)
{
var LengthErrorMessage = "Custom Message for error";
dynamic stuff = JsonConvert.DeserializeObject("{ 'uploaded': 0, 'error': { 'message': \"" + LengthErrorMessage + "\"}}");
return Json(stuff);
}
var path = Path.Combine(
Directory.GetCurrentDirectory(), "wwwroot/uploads/images/conten_images",
fileName);
using (var stream = new FileStream(path, FileMode.Create))
{
upload.CopyTo(stream);
}
var url = $"{"/uploads/images/CKEditorImages/"}{fileName}";
var successMessage = "image is uploaded successfully";
dynamic success = await Task.Run(() => JsonConvert.DeserializeObject("{ 'uploaded': 1,'fileName': \"" + fileName + "\",'url': \"" + url + "\", 'error': { 'message': \"" + successMessage + "\"}}"));
return Json(success);
}
Extra Plugins code :
CKEDITOR.editorConfig = function( config ) {
config.filebrowserBrowseUrl = '/assets/back/dist/ckeditor/plugins/imagebrowser/browser/browser.html'
config.filebrowserUploadUrl = '/webmaster/files/UploadFromEditor';
config.extraPlugins = 'filetools';
config.extraPlugins = 'uploadimage';
config.extraPlugins = 'popup';
config.extraPlugins = 'imagebrowser';
config.filebrowserUploadMethod = 'xhr';
};
Please help me out here
here are the headers :
XHRPOSThttps://localhost:5001/webmaster/files/UploadFromEditor
[HTTP/2 400 Bad Request 73ms]
POST
https://localhost:5001/webmaster/files/UploadFromEditor
Status400
Bad Request
VersionHTTP/2
Transferred85.50 KB (0 B size)
content-length
0
date
Tue, 03 Nov 2020 09:13:50 GMT
server
Kestrel
X-Firefox-Spdy
h2
Accept
*/*
Accept-Encoding
gzip, deflate, br
Accept-Language
en-US,en;q=0.5
Connection
keep-alive
Content-Length
86268
Content-Type
multipart/form-data; boundary=---------------------------1063707225330149515660008029
Cookie
.AspNetCore.Session=CfDJ8ERqQf6e11lCnNAhOo0wjyavEQJqEJ7gsv1MXMI4QwPk9Px8mznruNuZcxnmuYGnGjs1GtOWQI4DVCXYKd%2FRbNNo62%2FtopzHy%2FxaW87rvNE13QikL84JT0m32Ie1LWSZR3AkxYAE5p4U7TEpN5FccezCSMDeUR9geLW3lSjFIJD4; .AspNetCore.Antiforgery.J7MIrShXchg=CfDJ8ERqQf6e11lCnNAhOo0wjyYadzIaShP7Nt-bl6orx5lTMtnVoGxw8noimjE32qvhp_f96p2Hx4_zK8hzdRIz12615ZdyisBTz6X9HPA39cgIvRTjmWmrWNcLlm4S2MvPAQrG9hofg1ANinWAOwKIyXc; ckCsrfToken=8qZ4KEfRjaBWRmI6coRoRbJrZd8DgYG18gAz86eN; .AspNetCore.Antiforgery.XfkU3LYWHPY=CfDJ8NfGIpF9PVtNgLP3wXt3ZoscmmPZ8ZskVSbYiI69p4lPZYB3mt9mFEqRuOV0Ajfi2f8NNbjcyEHtfta7RlEHTBhXdRfPonXD1sN2EIS2BvcjZCrN8sJXN4UMo_JlolirVt3VIcCTm-wGAtIzGq0150w
Host
localhost:5001
Origin
https://localhost:5001
Referer
https://localhost:5001/webmaster/News/Create
TE
Trailers
User-Agent
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:82.0) Gecko/20100101 Firefox/82.0
X-Requested-With
XMLHttpRequest
Cookie “.AspNetCore.Antiforgery.XfkU3LYWHPY” will be soon treated as cross-site cookie against “https://localhost:5001/webmaster/files/UploadFromEditor” because the scheme does not match. UploadFromEditor
Source map error: Error: request failed with status 404
Resource URL: https://localhost:5001/assets/back/dist/bootstrap/js/bootstrap.min.js
Source Map URL: bootstrap.min.js.map
Based on the details about your test request, it seems that you configured and enabled antiforgery token validation. If JavaScript client not set/include the token in request, which would cause 400 Bad Request error.
To fix it, as I mentioned in comment, we can apply IgnoreAntiforgeryToken Attribute to action method UploadFromEditor to skip antiforgery token validation.
Or set the token in request header to make the request can pass antiforgery token validation.
https://learn.microsoft.com/en-us/aspnet/core/security/anti-request-forgery?view=aspnetcore-3.1#javascript
Related
I'm trying to build a function to send email with pdf, I need to read the file from other server and then attach it to the email.
I have test it with txt and it works fine, but when I use pdf, it attach a file that cannot be open.
That's my code until now:
let dados = {
"para": "::EMAIL::",
"body": "Olá",
"assunto": "Teste",
"from": "::EMAIL::",
"anexo": "teste.pdf" // Name of the file I want to read from server
};
request.get("::URL_SERVER::" + dados.anexo, function (error, response, body) {
let anexo;
if (!error && response.statusCode == 200) {
anexo = body;
}
let ses_mail =
`From: 'AWS SES Attchament Configuration' <${dados.from}>
To: <${dados.para}>
Subject: ${dados.assunto}
MIME-Version: 1.0
Content-Type: multipart/mixed; boundary="NextPart"
--NextPart
Content-Type: text/html
${dados.body}
--NextPart
Content-Type: application/pdf; name="${dados.anexo}"
Content-Transfer-Encoding: base64
Content-Disposition:attachment
${anexo.toString("base64").replace(/([^\0]{76})/g, "$1\n")}
--NextPart`;
let params = {
RawMessage: {Data: ses_mail},
Source: `'AWS SES Attchament Configuration' <${dados.from}>`
};
let sendPromise = new AWS.SES({apiVersion: '2010-12-01'}).sendRawEmail(params).promise();
return sendPromise.then(
data => {
console.log(data);
return data;
}).catch(
err => {
console.error(err.message);
throw err;
});
});
It is possible to do it with axios? I only found how to download file on my research
I could do it, but I needed to change the lib I was using to sync-request.
My final code:
let anexo = null;
try {
anexo = request( "GET", "::URL::" + dados.anexo );
} catch (err) {
console.error(err, err.stack);
return criarResposta( 404, 'Anexo não encontrado' );
}
anexo = anexo.getBody();
//return criarResposta( 200, anexo.toString("base64") );
let ses_mail =
`From: 'AWS SES Attchament Configuration' <${dados.from}>
To: <${dados.para}>
Subject: ${dados.assunto}
MIME-Version: 1.0
Content-Type: multipart/mixed; boundary="NextPart"
--NextPart
Content-Type: text/html
${dados.body}
--NextPart
Content-Type: application/octet; name="arquivo.pdf"
Content-Transfer-Encoding: base64
Content-Disposition:attachment
${anexo.toString("base64")}
--NextPart`;
let params = {
RawMessage: {Data: ses_mail},
Source: `'AWS SES Attchament Configuration' <${dados.from}>`
};
sendPromise = new AWS.SES({apiVersion: '2010-12-01'}).sendRawEmail(params).promise();
try {
const data = await sendPromise;
console.log(data.MessageId);
return criarResposta( 200, 'OK' );
} catch (err) {
console.error(err, err.stack);
return criarResposta( 500, 'Erro interno' );
}
public async Task<T> PostFrom<T>(string baseAddress, string url, string requestbody)
{
T obj = default(T);
//Create the Uri string
string request = baseAddress + url;
WriteLog(request + " : " + "start");
try
{
//Create the Uri
var urirequest = new Uri(request);
//define MultipartFormDataContent
var multipart = new MultipartFormDataContent();
//Add Content-Type
multipart.Headers.Remove("Content-Type");
multipart.Headers.TryAddWithoutValidation("Content-Type", "multipart/form-data; boundary=" + financialAuth.Value.ContentType.boundary);
//Add AuthToken
multipart.Headers.Add("AuthToken", financialAuth.Value.AuthToken);
//start adding the Content-Disposition which i have 3 of them
//1st Content-Disposition form-data; name="SearchCriteria" "requestbody" is the json
if (!string.IsNullOrEmpty(requestbody))
{
var requestbodyContent = new StringContent(JsonConvert.SerializeObject(requestbody));
requestbodyContent.Headers.Add("Content-Disposition", "form-data; name=\"SearchCriteria\"");
multipart.Add(requestbodyContent, "SearchCriteria");
}
//2nd Content-Disposition form-data; name="Secret" "financialAuth.Value.Secret" is the string
var secretContent = new StringContent(financialAuth.Value.Secret);
secretContent.Headers.Add("Content-Disposition", "form-data; name=\"Secret\"");
multipart.Add(secretContent, "Secret");
//3rd Content-Disposition form-data; name="AppID" "financialAuth.Value.AppID" is the string
var appIdContent = new StringContent(financialAuth.Value.AppID);
appIdContent.Headers.Add("Content-Disposition", "form-data; name=\"AppID\"");
multipart.Add(appIdContent, "AppID");
//define the HttpRequestMessage of type post
var httpRequestMessage = new HttpRequestMessage(HttpMethod.Post, urirequest);
//assign the multipart of httpRequestMessage.Content
httpRequestMessage.Content = multipart;
//assign the urirequest of httpClient.BaseAddress
client.BaseAddress = urirequest;
WriteLog("start url" + request);
/* Here when I call the post web api I'm getting below error:
{{StatusCode: 500, ReasonPhrase: 'Internal Server Error', Version: 1.1, Content: System.Net.Http.HttpConnection+HttpConnectionResponseContent,
Headers: {
Cache-Control: no-cache
Pragma: no-cache
Server: Microsoft-IIS/8.5
X-AspNet-Version: 4.0.30319
Access-Control-Allow-Origin: *
Access-Control-Allow-Headers: Content-Type,authtoken
Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS
Date: Tue, 26 Feb 2019 14:59:51 GMT
Content-Type: application/json; charset=utf-8
Expires: -1
Content-Length: 36
}}
*/
HttpResponseMessage response = await client.SendAsync(httpRequestMessage).ConfigureAwait(false);
WriteLog("END url" + request);
if (response.IsSuccessStatusCode)
{
WriteLog(request + " : " + "Begin Result");
string result = await response.Content.ReadAsStringAsync();
obj = JsonConvert.DeserializeObject<T>(result);
WriteLog(request + " : " + "End Result");
}
}
catch (Exception ex)
{
WriteLog(request + " " + ex.Message);
}
return obj;
}
I just solved the error by commenting the below code:
// Add Content-Type
multipart.Headers.Remove("Content-Type");
multipart.Headers.TryAddWithoutValidation("Content-Type", "multipart/form-data; boundary=" + financialAuth.Value.ContentType.boundary);
It seems the content type will be created automatically by MultipartFormDataContent.
Thanks for looking into my issue.
Trying to make a REST call through SharePoint's SP.WebRequestInfo.
I'm getting the error "The remote server returned the following error while establishing a connection - 'Unauthorized'." trying to call https://graph.windows.net/[Client]/users?api-version=2013-11-0.
I've successfully retrieved a access token.
Can you help me out why i'm getting this error?
Here is the code i'm using:
var url = "https://graph.windows.net/xxx/users/?api-version=2013-11-08";
var context = SP.ClientContext.get_current();
var request = new SP.WebRequestInfo();
request.set_url(url);
request.set_method("GET");
request.set_headers({
"Authorization": token.token_type + " " + token.access_token,
"Content-Type": "application/json"
});
var response = SP.WebProxy.invoke(context, request);
context.executeQueryAsync(successHandler, errorHandler);
function successHandler() {
if (response.get_statusCode() == 200) {
var responseBody = JSON.parse(response.get_body());
deferred.resolve(responseBody);
} else {
var httpCode = response.get_statusCode();
var httpText = response.get_body();
deferred.reject(httpCode + ": " + httpText);
}
}
The code for retrieving the token is:
this.getToken = function (clientId, clientSecret) {
var deferred = $q.defer();
var resource = "https://graph.windows.net";
var formData = "grant_type=client_credentials&resource=" + encodeURIComponent(resource) + "&client_id=" + encodeURIComponent(clientId) + "&client_secret=" + encodeURIComponent(clientSecret);
var url = "https://login.windows.net/xxxxxx.onmicrosoft.com/oauth2/token?api-version=1.0";
var context = SP.ClientContext.get_current();
var request = new SP.WebRequestInfo();
request.set_url(url);
request.set_method("POST");
request.set_body(formData);
var response = SP.WebProxy.invoke(context, request);
context.executeQueryAsync(successHandler, errorHandler);
function successHandler() {
if (response.get_statusCode() == 200) {
var token = JSON.parse(response.get_body());
deferred.resolve(token);
} else {
var httpCode = response.get_statusCode();
var httpText = response.get_body();
deferred.reject(httpCode + ": " + httpText);
}
}
function errorHandler() {
deferred.reject(response.get_body());
}
return deferred.promise;
};
Erik, something is strange here - you are using the client credential flow from a JavaScript client - this reveals the secret issued to the client app to the user of the JS app.
The client credential flow also requires the directory admin to grant directory read permission to the client application - not sure if this was already configured - nevertheless it must only be used with a confidential client, not a public client like a JS app.
Azure AD does not yet implement the implicit_grant oauth flow using which a JS client app can acquire an access token on behalf of the user over redirect binding (in the fragment). This is a hugh-pro requirement that we're working on - stay tuned.
I'm trying to talk with 8tracks open API in Swift iOS app. I need to make POST authorization request to http://8tracks.com/sessions.jsonwith AFNetworking but everytime I get 422 Unprocessable Entity error..
I tried this endpoint on the web and it works fine. Here is code that I'm using (subclassing AFHTTPSessionManager):
init() {
super.init()
self.responseSerializer = AFJSONResponseSerializer()
self.requestSerializer = AFJSONRequestSerializer()
self.requestSerializer.setValue(API_KEY, forHTTPHeaderField: "X-Api-Key")
self.requestSerializer.setValue("3", forHTTPHeaderField: "X-Api-Version")
}
func login(username: String, password: String, success: (NSURLSessionDataTask!, AnyObject!) -> Void, failure: ((NSURLSessionDataTask!, NSError!) -> Void)?) {
let credentials = ["username": username, "password": password] as Dictionary
self.POST(
API_URL.stringByAppendingString("/sessions.json"),
parameters: credentials,
success: success,
failure: failure
)
}
Error looks as follows:
{ URL: http://8tracks.com/sessions.json } { status code: 422, headers {
"Accept-Ranges" = bytes;
"Access-Control-Allow-Origin" = "*";
Age = 0;
"Cache-Control" = "max-age=0, private, must-revalidate";
Connection = "keep-alive";
"Content-Length" = 125;
"Content-Type" = "application/json; charset=utf-8";
Date = "Wed, 25 Jun 2014 19:29:12 GMT";
Server = "nginx/1.4.3";
Status = "422 Unprocessable Entity";
Via = "1.1 varnish";
"X-Action" = "sessions/create";
"X-Backend" = rails;
"X-Cache" = MISS;
"X-Data-Request" = 1;
"X-Request-Id" = 3040c8bf79936b27075731f634bfd534;
"X-Requests-Left" = 99;
"X-Runtime" = "0.257240";
"X-UA-Compatible" = "IE=Edge,chrome=1";
} }, NSLocalizedDescription=Request failed: client error (422),
NSErrorFailingURLKey=http://8tracks.com/sessions.json}
It might have something to do with subclass AFHTTPSessionManager without a baseURL. I've tested the following code and it works.
let path = "/sessions.json"
let params = ["login": login, "password": password, "api_version": "3"]
let success = {(task: NSURLSessionDataTask!, response: AnyObject!) -> Void in
println(response)
}
let failure = {(task: NSURLSessionDataTask!, error: NSError!) -> Void in
println(error)
}
var client = AFHTTPSessionManager(baseURL: NSURL(string: "https://8tracks.com"))
client.POST(path, parameters: params, success: success, failure: failure)
I'm attempting to upload a file from PhoneGap to a server using the FileTransfer method. I need HTTP basic auth to be enabled for this upload.
Here's the relevant code:
var options = new FileUploadOptions({
fileKey: "file",
params: {
id: my_id,
headers: { 'Authorization': _make_authstr() }
}
});
var ft = new FileTransfer();
ft.upload(image, 'http://locahost:8000/api/upload', success, error, options);
Looking over the PhoneGap source code it appears that I can specify the authorization header by including "headers" in the "params" list as I've done above:
JSONObject headers = params.getJSONObject("headers");
for (Iterator iter = headers.keys(); iter.hasNext();)
{
String headerKey = iter.next().toString();
conn.setRequestProperty(headerKey, headers.getString(headerKey));
}
However, this doesn't seem to actually add the header.
So: is there a way to do HTTP basic auth with PhoneGap's FileTransfer, for both iPhone and Android?
You can add custom headers by adding them to the options rather than the params like so:
authHeaderValue = function(username, password) {
var tok = username + ':' + password;
var hash = btoa(tok);
return "Basic " + hash;
};
options.headers = {'Authorization': authHeaderValue('Bob', '1234') };
The correct location for the headers array is as an immediate child of options. options->headers. Not options->params->headers. Here is an example:
//**************************************************************
//Variables used below:
//1 - image_name: contains the actual name of the image file.
//2 - token: contains authorization token. In my case, JWT.
//3 - UPLOAD_URL: URL to which the file will be uploaded.
//4 - image_full_path - Full path for the picture to be uploaded.
//***************************************************************
var options = {
fileKey: "file",
fileName: 'picture',
chunkedMode: false,
mimeType: "multipart/form-data",
params : {'fileName': image_name}
};
var headers = {'Authorization':token};
//Here is the magic!
options.headers = headers;
//NOTE: I creaed a separate object for headers to better exemplify what
// is going on here. Obviously you can simply add the header entry
// directly to options object above.
$cordovaFileTransfer.upload(UPLOAD_URL, image_full_path, options).then(
function(result) {
//do whatever with the result here.
});
Here is the official documentation: https://github.com/apache/cordova-plugin-file-transfer
You can create a authorization header yourself. But you can also enter the credentials in the url like this:
var username = "test", password = "pass";
var uri = encodeURI("http://"+username + ':' + password +"#localhost:8000/api/upload");
See FileTransfer.js for the implementation (line 45):
function getBasicAuthHeader(urlString) {
var header = null;
// This is changed due to MS Windows doesn't support credentials in http uris
// so we detect them by regexp and strip off from result url
// Proof: http://social.msdn.microsoft.com/Forums/windowsapps/en-US/a327cf3c-f033-4a54-8b7f-03c56ba3203f/windows-foundation-uri-security-problem
if (window.btoa) {
var credentials = getUrlCredentials(urlString);
if (credentials) {
var authHeader = "Authorization";
var authHeaderValue = "Basic " + window.btoa(credentials);
header = {
name : authHeader,
value : authHeaderValue
};
}
}
return header;
}