Axio GET request in VueJS does not return a response body when using Amazon API Gateway

UPDATE: While Postman and browsers are able to receive valid response bodies from an Amazon API Gateway endpoint, other web applications are not. This is a basic GET request with no headers, and no authentication is needed for the API endpoint. The data is in JSON format.

Original Poster: I am using Axios for CRUD operations in a new VueJS application. Axios needs to query an API (Amazon API Gateway). Currently, I have a simple Vue component that retrieves data and prints it to the console upon response.

axios.get('https://myamazonurl.com/api/resource')
.then(response => console.log(response))
.catch(error => console.log(error))

The Amazon API does not require authentication and is public-facing. When I input the above URL into a browser or Postman, I receive the expected response. However, Axios returns a response without a body (the header is correct, including the correct response length value), but there is no content. When I substitute the URL with any other API, the response body is correct. Additionally, using jQuery/AJAX or fetch also results in a bodyless response when pointing to this specific API, while using them with a different API yields data.

Answer №1

After discovering that a browser extension was causing CORS issues and suppressing warnings/errors, I made adjustments to the CORS policy in my API Gateway which successfully resolved the problem.

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

Revamping Vue file with real-time updates using Laravel Echo Pusher Notifs

Over the last few days, I've been attempting to create a template that auto-reloads whenever there are new updates in the "Notifications" section. This could be due to a new entry being added or a notification being marked as read. Currently, I' ...

Trouble with installing Enmap due to better-sqlite3 error

For a while now, I've been struggling to get enmap installed. Despite searching the web exhaustively, I haven't come across any solutions that work for me. Every time I try npm i enmap, I consistently encounter this frustrating error: One part o ...

Unable to execute a GET request using the Fetch API on Django REST Framework results in receiving an HTTP 304 error code

When attempting a GET request with the Fetch API (Node Fetch) module against a Django REST API, I am encountering a 304 error. I am unsure of how to resolve this issue as it seems to be related to requesting the same data repeatedly. Is there no way around ...

"The Vue component's data is successfully updating within a method using setInterval(), however, the changes are not reflected in the DOM

I have a function in my methods that gets triggered with a @click in the view. The function starts a timer, and although it seems to work fine in the DevTools, the timer only updates in the DevTools when I refresh the page. Moreover, in the view, the time ...

Mongoose consistently fails to properly save dates

I have created a Mongoose model and included a birthdate field in the following way: birthdate: { type: Date, required: [true, "Please enter a birthdate"], lowercase: true, validate: [isDate, "Please enter a valid birthdate&q ...

AngularJS controllers and $scope are essential components in structuring and

As a newcomer to Angular, I've spent some time reading up on scopes and controllers, but I still feel like something isn't quite clicking for me. Let's take a look at this code snippet: var myApp = angular.module("myApp", []); myAp ...

Caution: Highlighting Non-ASCII Characters in Your Django Form

Looking to implement client-side Ajax validation for my Django form. The goal is to alert users in real-time if any non-ascii characters are detected as they type in a field. Originally considered using python to check for ascii characters in the form&apo ...

Develop a JavaScript function to declare variables

I am currently attempting to develop a small memory game where the time is multiplied by the number of moves made by the player. Upon completion of all pairs, a JavaScript function is executed: function finish() { stopCount(); var cnt1 = $("#cou ...

Ways to display output on a single line using javascript

It seems like such a simple task, but no matter how I try, I cannot get proper spacing between my words. /s does not seem to work for me. Here is an example of what I have attempted: document.write('You have been alive' + */s userMsDays /s* + &ap ...

Tips for successfully passing multiple properties to a function in React

<DeleteForeverIcon className={classes.deleteHwIcon} onClick={() => { deleteHomework(value.name, value.class); }} /> I'm looking to modify the function deleteHomework so that it can receive two properties instead of just one. In add ...

Troubleshooting jQuery Sortable Issue with Table and Row Width in ASP.NET MVC View

I am facing an issue with jQuery UI sortable while trying to make my table grid sortable. Despite not getting any error messages, the sortable function is not working as expected. I have never utilized this method in a MVC (views/razor) project before. An ...

What steps are involved in creating an xlsx file using Express and Exceljs, and then sending it to the client?

I am currently working on separating controllers and services in my Express app. One of the services I have generates an XLSX file using ExcelJS. I'm looking for a way to reuse this service without passing the response object to it. Is there a method ...

Creating a Multilevel Dropdown Menu: A Step-by-Step Guide

I am curious about how to create a multilevel dropdown menu using Bootstrap 5 and vanilla JavaScript. I created an example based on the Bootstrap 5 dropdowns component documentation, but it did not display when I clicked on it. The issue seems to be relat ...

Incorporating HTML elements into a Jade template

Can HTML elements be passed into a jade file? For example, I want to insert text into the p element and nest some content inside the code element within the p element. JSON with string data var news = { one : { title : "Using JSON", body : "Us ...

Trouble with reading from a newly generated file in a node.js program

Whenever I launch my results.html page, I generate a new JSON file and use express.static to allow access to the public folder files in the browser. Although my application is functioning properly, I find myself having to click the button multiple times f ...

Just easy highlighting using tags in Javascript

I have come across a code snippet that seems to be functioning well: <html> <head> <title>Testing JS Highlighting</title> <script type="text/javascript"> function highlight() { var t = ...

The ng-app feature is causing the script to run endlessly

Currently, I am troubleshooting an issue within my angular application that is built on the asp.net web application empty template. The problem arises when I utilize ng-app; if I leave it blank, the $routeProvider fails to initialize. However, if I specify ...

Is there a way to avoid getting a 404 error in Express when using multiple static directories?

I am working on serving files from two different folders to keep my admin and client content separate. The code I have set up initiates the two folders, but when Express looks for a file like example.css, it first checks the /static directory. If it doesn ...

Encounter a critical issue while making a JSON request using Kendo UI

I am facing an issue at my workplace where I need to integrate Angular.js with ASP.NET MVC. Currently, I am trying to build a simple application that features a Kendo UI grid on the front page. In my App.js file, I am fetching data from the Data Controller ...

JavaScript never forgets to validate the user input

Forgive me for my lack of experience, but I am new to this and seeking guidance. I am struggling to find a straightforward example on how to validate HTML input using JavaScript. Currently, I am working on a search function and need help in implementing ...