Direct ajax requests to a different path other than initially specified when sending the call

Question

Direct ajax requests to a different path other than initially specified when sending the call

My C# MVC project is hosted on abc.com. When making an Ajax call for a resource on Controller:Home and Method:ClientInfo, the URL looks like this:

url: '/Home/ClientInfo'

For testing purposes, I deployed the same project on xyz.com/web. The home page in this case is xyz.com/web. However, when Ajax calls are made for the resource Controller:Home and Method:ClientInfo with the same URL '/Home/ClientInfo', it returns a '404 Not Found' error because the URL should be something like this:

url: '/web/Home/ClientInfo'

One solution would be to manually edit all Ajax URLs throughout the project, but that doesn't seem like the right approach. I have a common layout - can I write JavaScript code there to route all URLs under the directory '/web', or is there another way?

*Note: I do not have control over the web.config of xyz.com to handle the calls and write rules.

Please provide suggestions.

javascript c#ajax asp.net-mvc asp.net-ajax

Answer 1

Answer №1

If you want to streamline your API routes in JavaScript, consider creating a separate file dedicated to exporting these routes for easy access and modification.

For instance using ES6

Create a file named routes.js with your API routes:

export const API = '/web/';
export const CLIENT_INFO_API = `${API}home/clientinfo`;

Then, when you need to utilize these routes in other files:

//Import the routes file
import * as ROUTES from 'routes.js';

//Access the routes
ROUTES.API
ROUTES.CLIENT_INFO_API

Alternatively, using ES5 syntax

Create a file named routes.js with your API routes:

var routes = {};
routes.API = '/web/';
routes.CLIENT_INFO_API = routes.API+'home/clientinfo';

module.exports = routes;

Then, when you need to use these routes in other files:

//Require in the routes file
const ROUTES = require('routes.js');

//Access the routes
ROUTES.API
ROUTES.CLIENT_INFO_API

Answer 2

If you want to streamline your API routes in JavaScript, consider creating a separate file dedicated to exporting these routes for easy access and modification.

For instance using ES6

Create a file named routes.js with your API routes:

export const API = '/web/';
export const CLIENT_INFO_API = `${API}home/clientinfo`;

Then, when you need to utilize these routes in other files:

//Import the routes file
import * as ROUTES from 'routes.js';

//Access the routes
ROUTES.API
ROUTES.CLIENT_INFO_API

Alternatively, using ES5 syntax

Create a file named routes.js with your API routes:

var routes = {};
routes.API = '/web/';
routes.CLIENT_INFO_API = routes.API+'home/clientinfo';

module.exports = routes;

Then, when you need to use these routes in other files:

//Require in the routes file
const ROUTES = require('routes.js');

//Access the routes
ROUTES.API
ROUTES.CLIENT_INFO_API

Direct ajax requests to a different path other than initially specified when sending the call

Answer №1

Similar questions

Incorporating a protected Grafana dashboard into a web application

Developing a table with JavaScript by parsing JSON data

Remove several elements from an array within the state of a React component using values from a second array

Tips for creating a pop-up window on an ASP.NET web form

Using .NET to Monitor GTalk Instant Messages

React fails to acknowledge union types

TimeoutException Automatically Triggered by Selenium WebDriver in C#

Utilizing Jquery select2 to enhance user experience by organizing JSON data with optgroup and

Utilize an index to retrieve the data stored within a div that consists of numerous rows (divs)

Adjust the sliders according to the current time

Tips for structuring JavaScript code within ASP.NET MVC projects

Modify the Google Translate dropdown using programming techniques

The art of designing Mongoose and Router files

Implement a FOR loop in conjunction with an AJAX request

Skybox images failing to display

Can one interact with PDF forms using PHP or JavaScript?

Tablesorter fails to initialize following Ajax update of HTML content

Collect data from a third-party website that necessitates the activation of JavaScript

Using jQuery to select and animate several elements simultaneously without repeating the animation

What is the best way to make my navbar reach the edges of the screen?