how to pass requestBody and requestParam in axios? - reactjs

I want to pass two parameters in axios post method one as requestBody and one as requestParam and also i need to pass authHeader as a header .
This is the axios method to post new senior with his image:
create(data,file) {
return http.post("/addSenior", data,{ headers: authHeader()});
}
and this is the controller with two parameters :
#PostMapping("/addSenior")
#ResponseBody
#Operation(security = {#SecurityRequirement(name = "bearer-key")})
public long addSenior(#RequestBody Senior s,#RequestParam("file") MultipartFile file) throws Exception{
FileDB attachment = null;
String downloadURl = "";
attachment = storageService.store(file);
downloadURl = ServletUriComponentsBuilder.fromCurrentContextPath()
.path("/download/")
.path(attachment.getId())
.toUriString();
return seniorServiceImpl.addSenior(s,attachment.getId());
}

Normally, when you need to send a file along with some other data in spring mvc, you can use #RequestPart instead of #RequestParam. In your case, you can use something like this:
public long addSenior(#RequestPart Senior s, #RequestPart("file") MultipartFile file)

Related

Call .NET Core API from AngularJS using $https - 400 Bad Request

I'm trying to call a .NET Core API from AngularJS. In the AngularJS I'm calling the method like this:
$http({
method: 'POST',
url: '/api/message/transaction/' + this.transaction.id,
data: { "transactionJson": "hello"}
})
.then(function (response) {
var r = response;
})
My .NET Core API method is like this:
[Route("~/api/message/transaction/{transactionId}")]
[HttpPost]
public async Task<ActionResult<DeviceEventsTransactionmsg>> PostTransaction([FromBody] string transactionJson)
{
I'm getting a 400 Bad Request response back from the server. How do I fix it?
I realised the type for the parameter must be a type that has a property named TransactionJson, so I need to define a new C# type:
public class TransactionData() {
public string TransactionJson
}
Then in the API method:
[Route("~/api/message/transaction/{transactionId}")]
[HttpPost]
public async Task<ActionResult<DeviceEventsTransactionmsg>> PostTransaction([FromBody] TransactionData transactionJson)
{
getting a 400 Bad Request response back from the server. How do I fix it?
To fix the issue, as your mentioned, one solution is modifying action parameter, like below.
public async Task<ActionResult<DeviceEventsTransactionmsg>> PostTransaction([FromBody] TransactionData transactionJson)
{
//...
//code logic here
TransactionData class
public class TransactionData
{
public string TransactionJson { get; set; }
}
Besides, we can also implement and use a custom plain text input formatter to make PostTransaction action method that accepts a string-type ACTION parameter work well.
public class TextPlainInputFormatter : TextInputFormatter
{
public TextPlainInputFormatter()
{
SupportedMediaTypes.Add("text/plain");
SupportedEncodings.Add(UTF8EncodingWithoutBOM);
SupportedEncodings.Add(UTF16EncodingLittleEndian);
}
protected override bool CanReadType(Type type)
{
return type == typeof(string);
}
public override async Task<InputFormatterResult> ReadRequestBodyAsync(InputFormatterContext context, Encoding encoding)
{
string data = null;
using (var streamReader = new StreamReader(context.HttpContext.Request.Body))
{
data = await streamReader.ReadToEndAsync();
}
return InputFormatterResult.Success(data);
}
}
Add custom formatter support
services.AddControllers(opt => opt.InputFormatters.Insert(0, new TextPlainInputFormatter()));
Test Result

Reactjs Axios File upload

I am trying to upload file to my .net core backend, file successfully uploads when i use postman or the swagger ui buh when i try using axios it keeps returning
request failed with status code 400
Here is my reactjs code snippet
const formData = new FormData();
formData.append("image", payload.img,);
formData.append("name", payload.name);
var config = {
headers: {
Authorization: `Bearer ${payload.token}`,
"content-type": "multipart/form-data",
},
};
let res = await axios.post(`${BASE_URL}/merchant/logo`, formData, config);
Please i have tried everything it seems not to be working I don't know what to do.
Here is my model class
public class Logo
{
public string name{ get; set; }
public IFormFile image{ get; set; }
}
here is my .Net core Action
var logoName = merchant.Identifier + "." + logoDto.Image.FileName.Split(".")[1];
string oldPath = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot/logo", merchant.Logo);
string path = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot/logo", logoName);
if (File.Exists(oldPath)) File.Delete(oldPath);
using (Stream stream = new FileStream(path, FileMode.Create))
{
await logoDto.Image.CopyToAsync(stream);
}
It is still not clear, but I want to share the corret method to realize it.
Ensure payload.img is a single file.
IF you use [ApiController], it needs to be formulated [FromForm].
[ApiController]
[Route("[controller]")]
public class ValController:Controller
{
[HttpPost("get")]
public IActionResult get([FromForm]Logo logo)
{
return Ok();
}
}

File upload using react + asp.net core 2 application not working

I am trying to do a file upload functionality, where my front end contains react and server is asp.net core 2. I tried with various combinations but my code is not working.(Getting error at server end and most likely getting content-type error). Following is the snippets for both front end and server:
React Code is:
const formData: any = new FormData();<br />
formData.append("File",data[0]); // data[0] contains the file object<br/>
return axios.post(SAVE_ATTACHMENT_DATA, formData,
{headers: { 'Content-Type':'multipart/form-data' }}
)
.then(resp => {
//
}, err => {
//
})
};
ASP.NET Core 2 Code is:
[HttpPost]
[Route("upload")]
public async Task<IActionResult> Upload()
{
var files = Request.Form.Files; // getting error here in "Form"
FileUploadViewModel model = new FileUploadViewModel(); // model been defined in another file
var file = model.File;
if (file.Length > 0)
{
string path = Path.Combine(#"temp\", "uploadFiles");
using (var fs = new FileStream(Path.Combine(path, file.FileName), FileMode.Create))
{
await file.CopyToAsync(fs);
}
model.source = $"/uploadFiles{file.FileName}";
model.Extension = Path.GetExtension(file.FileName).Substring(1);
}
return BadRequest();
}
Can some one please help me with the same.
It should work like this:
React Code
const formData = new FormData();
formData.append("file", data[0]);
return axios.post(SAVE_ATTACHMENT_DATA, formData)
ASP.NET Core 2:
[HttpPost]
[Route("upload")]
public async Task<IActionResult> Upload(IFormFile file)
{
if (file.Length > 0)
{
string path = Path.Combine(#"temp\", "uploadFiles");
using (var fs = new FileStream(Path.Combine(path, file.FileName), FileMode.Create))
{
await file.CopyToAsync(fs);
}
model.source = $"/uploadFiles{file.FileName}";
model.Extension = Path.GetExtension(file.FileName).Substring(1);
}
return BadRequest();
}
Important: The name of the file in React has to be the same as the parameter name in the .NET Core method or else the IFormFile will be null. For example formData.append('sameName', data[0]); in React and IFormFile sameName in .NET Core.
All you're doing in your action is newing up your model, which then, obviously isn't going to have any file uploads associated with it, because it was created manually by you and not from the post data. Instead, you should take your model as a param to your action, and then use that instance rather than creating your own:
[HttpPost]
[Route("upload")]
public async Task<IActionResult> Upload(FileUploadViewModel model)

Send a PDF as an attachment through Sendgrid

I'm using Sendgrid to send emails through an app on GAE. It's working fine, but I also want to be able to send PDFs as an attachment.
I'm not using Sendgrid.jar file in my project. I've just used Sendgrid.java. And this class has no methods by which i can add attachments. Can someone help me?
public static boolean sendEmail(String fromMail, String title, String toMail, String message) throws IOException {
Email from = new Email(fromMail);
String subject = title;
Email to = new Email(toMail);
Content content = new Content("text/html", message);
Mail mail = new Mail(from, subject, to, content);
Path file = Paths.get("file path");
Attachments attachments = new Attachments();
attachments.setFilename(file.getFileName().toString());
attachments.setType("application/pdf");
attachments.setDisposition("attachment");
byte[] attachmentContentBytes = Files.readAllBytes(file);
String attachmentContent = Base64.getMimeEncoder().encodeToString(attachmentContentBytes);
String s = Base64.getEncoder().encodeToString(attachmentContentBytes);
attachments.setContent(s);
mail.addAttachments(attachments);
SendGrid sg = new SendGrid("sendgrid api key");
Request request = new Request();
request.setMethod(Method.POST);
request.setEndpoint("mail/send");
request.setBody(mail.build());
Response response = sg.api(request);
if (response != null) {
return true;
} else {
return false;
}
}
Define above static method and call with relevant arguments as your program wants.
Here is the code of a servlet that sends a mail with a PDF as attachment, through Sendgrid:
#Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) {
....
ByteArrayOutputStream os = null;
try {
PDFGenerator pdfGenerator = new PDFGenerator(invoiceOut);
os = pdfGenerator.getPDFOutputStream();
} catch (Exception e) {
....
}
SendGrid sendgrid = new SendGrid(Constants.SENDGRID_API_KEY);
SendGrid.Email email = new SendGrid.Email();
email.addTo(....);
email.setFrom(....);
email.setFromName(....);
email.setSubject(....);
email.setHtml("......");
ByteBuffer buf = null;
if (os == null) {
//error...
} else {
buf = ByteBuffer.wrap(os.toByteArray());
}
InputStream attachmentDataStream = new ByteArrayInputStream(buf.array());
try {
email.addAttachment("xxxxx.pdf", attachmentDataStream);
SendGrid.Response response = sendgrid.send(email);
} catch (IOException e) {
....
throw new RuntimeException(e);
} catch (SendGridException e) {
....
throw new RuntimeException(e);
}
}
PDFGenerator is one of my classes in which getPDFOutputStream method returns the PDF as ByteArrayOutputStream.
I personally find it easier to directly construct the JSON request body as described in the API docs than to use Sendgrid's libraries. I only use the Sendgrid library for sending the request after I construct the JSON data myself.
When constructing the JSON data you need to specify at least a filename and the content (i.e., the PDF file). Make sure to Base64 encode the PDF file before adding it to the JASON data.
I'd include some code, but I do Python and not Java so not sure that would help.

Set parameters with HTTP POST in Apex

I'm trying to set POST content using Apex. The example below sets the variables using GET
PageReference newPage = Page.SOMEPAGE;
SOMEPAGE.getParameters().put('id', someID);
SOMEPAGE.getParameters().put('text', content);
Is there any way for me to set the HTTP type as POST?
Yes but you need to use HttpRequest class.
String endpoint = 'http://www.example.com/service';
String body = 'fname=firstname&lname=lastname&age=34';
HttpRequest req = new HttpRequest();
req.setEndpoint(endpoint);
req.setMethod('POST');
req.setbody(body);
Http http = new Http();
HTTPResponse response = http.send(req);
For additional information refer to Salesforce documentation.
The following apex class example will allow you to set parameters in the query string for a post request -
#RestResource(urlmapping = '/sendComment/*')
global without sharing class postComment {
#HttpPost
global static void postComment(){
//create parameters
string commentTitle = RestContext.request.params.get('commentTitle');
string textBody = RestContext.request.params.get('textBody');
//equate the parameters with the respective fields of the new record
Comment__c thisComment = new Comment__c(
Title__c = commentTitle,
TextBody__c = textBody,
);
insert thisComment;
RestContext.response.responseBody = blob.valueOf('[{"Comment Id":
'+JSON.serialize(thisComment.Id)+', "Message" : "Comment submitted
successfully"}]');
}
}
The URL for the above API class will look like -
/services/apexrest/sendComment?commentTitle=Sample title&textBody=This is a comment

Resources