The URLs seem to have a tendency to randomly incorporate the controller's name

I am facing an issue with my controller class named HomeController and the client-side JavaScript code:

function upload(content) {
    var ajax = new XMLHttpRequest();
    ajax.open("POST", 'UploadImage', false);
    ajax.setRequestHeader('Content-Type', 'application/upload');
    ajax.send(content);
}

Sometimes, when using the URL

https://localhost/MyApp/Home/UploadImage
, the data uploads correctly. However, at other times it fails due to the absence of the controller name in the URL. The error shown in Chrome developer tools is:

POST https://localhost/MyApp/UploadImage 404 ()

By manually adding /Home to the URL in the code:

    ajax.open("POST", 'Home/UploadImage', false);

The behavior changes unpredictably - sometimes successfully using

https://localhost/MyApp/Home/UploadImage
and other times failing with:

POST https://localhost/MyApp/Home/Home/UploadImage 404 ()

Recompiling and restarting may switch this behavior, but I cannot determine a consistent pattern. This inconsistency also occurs with GET requests. Whether to include the controller name Home/ in URLs perplexes me. How can I ensure consistent behavior?

Answer β„–1

The reason for this is solely due to relative URLs.

It varies depending on the code or page you are currently using, so the solution would be to either

ajax.open("POST", '/Home/UploadFile', false);

or

ajax.open('POST', '@Url.Action("UploadFile","Home")', false);

Answer β„–2

InsertPicture is a relative URL path

location: localhost/ExampleApp/mypage.html => localhost/ExampleApp/InsertPicture
location:  localhost/ExampleApp/Home/mypage.html => localhost/ExampleApp/Home/InsertPicture

please use /ExampleApp/Home/InsertPicture or the full URL if on a different domain

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Using D3-GraphViz in Javascript along with an Angular template: A step-by-step guide

I am attempting to integrate d3-graphviz following the guidance provided here within an angular template, like in this example. The tutorial on the d3-graphviz website advises me to include the following code in the index.html file: <!DOCTYPE html> & ...

Trapped in the clutches of the 'Access-Control-Allow-Origin' snag in our Node.js application

Our nodeJS application is deployed on AWS Lambda, and we are encountering an authentication issue with CORS policy when trying to make a request. The error in the console states: Access to XMLHttpRequest at 'https://vklut41ib9.execute-api.ap-south-1 ...

Issue: The property 'top' cannot be read as it is null

I'm trying to access the top of my footer, but I keep encountering this error message: Cannot read property 'top' of null Here is the HTML code: <footer class="footer" role="complementary" id="myfooter"> </footer> And in jQuer ...

Error Encountered when Making Cross-Origin Ajax Request Using jQuery

I am currently working on implementing a cross-domain Ajax request to an API. Utilizing jQuery for making the call, I am attempting to extract specific items from the response. Below is the code for the request: $.ajax({ type: 'POST', u ...

Node and Express fail to set cookie when used with Nginx server

I am encountering an issue with setting a cookie in my Node app using Express. The cookie sets successfully in the local environment (http), but when deployed to production (https), although I can see the cookie in the response, it is not actually being se ...

Javascript Library Issue: "Implicitly Declared Type 'Any' Error"

I am currently in the process of developing a JavaScript library that will interact with an API. My goal is to create a module that can be easily published on npm and utilized across various frameworks such as Angular or React. Below is the code snippet fo ...

Update the modifications in the database for the entity I'm monitoring

I'm currently working on updating changes in the database for a tracked entity and then updating my entity accordingly. Here is the code snippet: var user = await _userRepository.GetByUserId(userId); _userRepository.Update(user); // _dbSet.Update(obj ...

Send URL when the button is clicked using Ionic framework

I've been working on an Ionic app that retrieves data from a JSON URL with two main pages. The challenge I'm facing is how to pass the URL from the 1st page to the 2nd page upon button click, so that the 2nd page can fetch the data and display i ...

Using Vue.js to eliminate duplicate values from a filtered array of objects

How can I eliminate duplicate data from a v-for loop in Vue.js? I have an array of clients and another array of categories. When filtering the categories based on clientIDs, I noticed that there are duplicates present. Please choose a client from the opti ...

Divide the array object based on the "@" symbol

i am in possession of the following array object let old_array = { "valone": "facebook", "notification": "new message! @[email protected] @[email protected]" } i aim to extract all users with @ sign into a new array like displayed below le ...

Tips for efficiently resolving and compiling a bug within an NPM package, ensuring it is accessible to the build server

This question may seem a bit unconventional. I am currently using an npm package that includes built-in type definitions for TypeScript. However, I have discovered a bug in these definitions that I am able to easily fix. My goal is to make this updated ve ...

Function Validation Modification

In my current scenario, the validation function I wish to utilize is dependent on a previous user choice within the form. Upon page load, a default validator is set up as follows: CustomValidator cv = new CustomValidator(); cv.ErrorMessage = "You must lea ...

Mapping through an undefined array in React causing an error: "map of undefined"

To display an image, title, and description in the browser, the data is stored in an array in a file named customData.js. Below is an example of the data structure: var DATA = [ { name: 'John Smith', imgURL: 'http://whi ...

Implementing Vue.js functionality to dynamically add or remove values from an array based on the state of a checkbox

I recently embarked on my journey to learn vue.js and I've encountered a challenging issue. I have dynamic data that I render using a 'v-for' loop. Additionally, I have an empty array where I need to store checked checkbox data and remove it ...

Retrieving a function from a JavaScript file located in a publicly accessible directory

Having trouble accessing a function from the JS file scripts.js within the public folder where my CSS file is also located. Despite following various tutorials like this, I keep encountering the error message Error: Cannot find module './scripts.js&ap ...

What are some creative ways to utilize postMessage instead of relying on nextTick or setTimeout with a zero millisecond delay?

I just came across a theory that postMessage in Google Chrome is similar to nextTick. This idea somewhat confused me because I was under the impression that postMessage was primarily used for communication between web workers. Experimenting with expressio ...

What is the best way to capture the inputs' values and store them accurately in my object within localStorage?

Is there a more efficient way to get all the input values ​​and place them in the appropriate location in my object (localStorage) without having to individually retrieve them as shown in the code below? Below is the function I currently use to update ...

A guide to obtaining the path and filename of an uploaded file in Node.js

I'm currently working on a web application using React and I'm looking to enable the uploading of docx/pdf files and converting them to pdf/docx. Due to security measures, it's not possible to access file paths directly in React. I've c ...

Using JavaScript/jQuery to send JSON data via POST request and download a file

I am currently developing a single-page web application using jQuery. It communicates with a RESTful web service through AJAX calls. My main goal is to achieve the following tasks: Send a POST request containing JSON data to a RESTful URL. If the reques ...

What is the most effective way to navigate to a different webpage?

I'm facing a challenge with redirecting to another page after inserting data. I've tried various methods, but nothing seems to work. Can anyone guide me on how to achieve this successfully? let express = require("express"); let app = ex ...