call an api in C#

Question

call an api in C#

Anjali Agarwal 1,571

I have the following code:


namespace TwilioSendMessages.Controllers
{
    [Route("api/[controller]")]
    [ApiController]
    public class SMSController : ControllerBase
    {
        private readonly IWebHostEnvironment _webHostEnvironment;
        public readonly IConfiguration _configuration;
        private readonly ITwilioRestClient _client;
        public SMSController(IWebHostEnvironment webHostEnvironment, IConfiguration configuration, ITwilioRestClient client)
        {
            _webHostEnvironment = webHostEnvironment;
            _configuration = configuration;
            _client = client;
        }
          [Route("SendSMS")]
        [HttpPost]
        public IActionResult SendSMS(SmsMessage model)
        {
          
            var message = MessageResource.Create(
            to: new PhoneNumber(model.To),
            from: new PhoneNumber(model.From), 
            body: model.Message,
            client: _client); // pass in the custom client
            return Ok("Success");
        }
    }
}
namespace

when I tried to call the api on my local machine like this:



https://localhost:7262/api/SMS/SendSMS

it says the page is not working. I also tried calling the API this way. I get the same message saying the page is not working:


https://localhost:7262/api/SMSController

When I run the code directly. This page comes up:

User's image

When I run the code directly.This page comes up and I can type "To" , "From" and "Message" and it works. How can I call this API using the URL on my local machine.

Answer accepted by question author

0 additional answers

Your answer

Answer 1

Anonymous

Hi @Anjali Agarwal,

It's a post request. We can't make it works in browser. If you want to test it in web page, you have to create a html, and invoke this SendSMS function in javascript by using post method.

Another choice, you can use the tools like Postman to test your api.

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Best Regards

Jason

Anjali Agarwal 1,571 Reputation points

2024-03-19T05:23:34.0666667+00:00

Hi @jasonpan ,

Can I put HTTPGet method in the existing code. I am very new to API's or can ypu point me to an example where I can call post method in Javascript.

Anonymous

Hi @Anjali Agarwal,

Here is the sample code use fetch to send http request. It's a very simple demo, by the way your backend (api) should enable cors setting.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>HTTP Request Tool Similar to Postman</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
    <style>
        #responseBody {
            white-space: pre-wrap; /* Preserve formatting */
            word-wrap: break-word;
        }
    </style>
</head>
<body>
<div class="container mt-3">
    <h2>HTTP Request Tool</h2>
    <div class="form-group">
        <label for="requestType">Request Type</label>
        <select class="form-control" id="requestType">
            <option>GET</option>
            <option>POST</option>
        </select>
    </div>
    <div class="form-group">
        <label for="requestUrl">URL</label>
        <input type="text" class="form-control" id="requestUrl" placeholder="Enter URL">
    </div>
    <div class="form-group">
        <label for="requestHeaders">Headers (in JSON format)</label>
        <textarea class="form-control" id="requestHeaders" rows="2" placeholder='e.g., {"Content-Type": "application/json"}'>{"Content-Type": "application/json"}</textarea>
    </div>
    <div class="form-group">
        <label for="requestData">Request Data (for POST requests, in JSON format)</label>
        <textarea class="form-control" id="requestData" rows="3" placeholder="Enter data"></textarea>
    </div>
    <button class="btn btn-primary" id="sendRequest">Send Request</button>
    <h3 class="mt-3">Response</h3>
    <pre id="responseBody" class="border p-3"></pre>
</div>

<script>
document.getElementById('sendRequest').addEventListener('click', function() {
    const requestType = document.getElementById('requestType').value;
    const requestUrl = document.getElementById('requestUrl').value;
    const requestData = document.getElementById('requestData').value;
    const requestHeadersInput = document.getElementById('requestHeaders').value;
    let requestHeaders = {};

    try {
        requestHeaders = requestHeadersInput ? JSON.parse(requestHeadersInput) : {};
    } catch(e) {
        alert('Headers format error, please enter valid JSON');
        return;
    }

    const options = {
        method: requestType,
        headers: requestHeaders
    };
    
    if (requestType === 'POST') {
        try {
            options.body = JSON.stringify(JSON.parse(requestData));
        } catch(e) {
            alert('Request data format error, please enter valid JSON');
            return;
        }
    }
    
    fetch(requestUrl, options)
        .then(response => response.text())
        .then(data => {
            document.getElementById('responseBody').textContent = data;
        })
        .catch(error => {
            document.getElementById('responseBody').textContent = 'Request failed: ' + error;
        });
});
</script>
</body>
</html>

Best Regards

Jason

Share via

call an api in C#

0 additional answers

Your answer