Accessing a JSON file from a nearby location using JavaScript

I am currently working on an artistic project based on weather data, which will be hosted locally with the JSON file updating via FTP synchronization. This means that the JSON file will be sourced from the same computer where it is stored. The code snippet below shows how I'm currently sourcing the JSON file externally. I need assistance in altering it to source the file locally. Do I simply change the URL to the file pathway where it will be located and remove the GET and send parts?

var xhr = new XMLHttpRequest();

var URL = "http://api.openweathermap.org/data/2.5/weather?q={London}&appid=genericAPIpassword";

xhr.open("GET", URL, false);
xhr.send();

var weatherResponseStringify = JSON.stringify(xhr.responseText, "", 2);
var weatherResponseParse = JSON.parse(xhr.responseText);

Thank you for any help you can provide!

javascriptjson

Answer №1

const mySecretData = {
  code:1234,
  password:"abcd"
}

Keep it simple. If the data is stored in a separate file, you can include it using:

<script src="externalData.js" ></script>

Alternatively, consider using System.JS Import for asynchronous loading.

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

JavaScript failing to render AJAX request

I have a website that utilizes AJAX to fetch data in JSON format from the backend and then displays it on the page. The website is built using MVC .NET framework. Below is the function responsible for loading events from the backend: function initEvents( ...

javascriptajaxjson

ajax modal form editing

Encountered an issue with editing a form using modal ajax, where the edit form pops up but the data remains empty. The code snippet for my controller: public function edit() { $id=$this->uri->segment(3); $data=array( 'project' => $th ...

javascriptajaxcodeigniter

Please indicate the maximum number of digits allowed after the decimal point in the input

My input form uses a comma as the decimal separator: HTML: <form id="myform"> <label for="field">Required, decimal number:</label> <input class="left" id="field" name="field"> <br/> <input type="submit" va ...

javascriptjqueryhtmlregex

Encountered an issue with locating the module 'webpack-cli/bin/config-yargs' while attempting to run webpack-dev

Encountering an error while trying to start the webpack dev server with the command provided below. Despite suggestions that it could be due to outdated webpack versions, I am confident that all components are up to date: [email protected] [email ...

javascriptreactjstypescriptwebpackwebpack-dev-server

Utilizing nested dynamic attributes as grid columns within ExtJS applications

I recently experimented with the dynamic attributes approach in my prototype mongoDB application. This approach essentially structures data like this: { SKU: "Y32944EW", type: "shoes", attr: [ { "k": "manufacturer", "v": "ShoesForAll ...

c#jsonextjs

How to retrieve raw_post_data in Django test client?

In order to access raw_post_data in my views, I have been experimenting with the test client. I tried copying the raw_post_data string from a mock request, converting it using json.loads(), and setting it as the POST data for the test client. However, ev ...

djangojsondjango-views

Issue with React event hierarchy

How can I effectively manage state changes in a deep node that also need to be handled by a parent node? Let me explain my scenario: <Table> <Row prop={user1}> <Column prop={user1_col1} /> <Column prop={user1_col2} /> ...

javascriptreactjsfluxreactjs-flux

Struggling to deserialize the JSON data into a list of objects

Consider the provided JSON data stored in a file named database.json at the project's root: { "customers": [{ "id": 1, "name": "Bob" }, { "id": 2, "name": &q ...

c#json

The concept of CSS sprites and managing background positions

I have been working on integrating a star-rating widget that requires the use of a sprite file. The sprite file I am using looks like this: https://i.stack.imgur.com/ZSMMj.png This is how my HTML is structured: HTML <span id="star-ratings" class="c ...

javascripthtmlcss

I'm having trouble understanding how to utilize startAt and endAt in Firebase version 9

Trying to implement geo querying in my firestore db with the new version of firebase has been challenging. The code examples provided in the documentation reference an older version, making it difficult for me to understand how to use ".startAt" and ".endA ...

javascriptfirebasegoogle-cloud-firestore

Troubleshooting: PHP AJAX call to update MySQL database not working as expected

Having some trouble updating a field in my database using PHP and AJAX. The data being sent is correct, but the PHP script responsible for handling the update isn't working as intended. Currently, all I see is the "else" response in the conditional ...

phpajaxdatabasejsonsql-update

Having issues installing Parcel through npm - Encountered an error while parsing package.json information

After creating a package.json file using the command npm init in my project folder, I proceeded to run npm i parcel --save-dev which resulted in an error message: C:\Users\XPRESS\Desktop\starter>npm i parcel --save-dev npm ERR! code ...

javascriptnode.jsjsonnpm

Listen for the 'open' event on a node HTTP server

This question pertains to a previous inquiry I had about node httpServer encountering the EADDRINUSE error and moving to the next available port. Currently, my code looks like this: var port = 8000; HTTPserver .listen(port, function() { console.lo ...

javascriptnode.js

What are the steps to resolve the issue of encountering the error message "Unrecognized custom element: <bot-ui>"?

I'm having some trouble setting up a chatbot screen with the "botui" and "vue-cli". Whenever I try to display the screen, I encounter an "Unknown custom element: " error. Below is the code snippet that I am using. Can you please help me figure out ...

javascriptvue.js

What is the best way to align these div elements within a table cell?

I am encountering an issue with the placement of elements. What I am striving for is something like this: https://i.stack.imgur.com/VSFXE.png where a div with several other divs inside is positioned at the top of the td, and another div is at the bottom o ...

javascriptjquerycssfirefox

Is there a way to include e.preventDefault() within an ajax call?

After the user clicks the submit button on my form, the handleSubmit function is triggered. However, I am having trouble calling e.preventDefault() inside my AJAX call due to its asynchronous nature. How can this issue be resolved? class FormRegister ex ...

javascriptajaxreactjs

angular 4 observable is yielding an [object Object]

My frontend is built using Angular 4, while my backend consists of Laravel 5.5 serving as the restful API. When interacting with the backend, everything works smoothly as I am able to send curl requests and receive back the expected JSON response with 2 ke ...

javascriptjsonangularobservablesubscription

Ways to avoid unintentional removal of contenteditable unordered lists in Internet Explorer 10

How can I create a contenteditable ul element on a webpage while avoiding the issue in Internet Explorer 10 where selecting all and deleting removes the ul element from the page? Is there a way to prevent this or detect when it happens in order to insert ...

javascriptjqueryhtmlcontenteditable

"Using jQuery to enable ajax autocomplete feature with the ability to populate the same

I am encountering a problem with jQuery autocomplete. It works perfectly fine with one textbox, but when I create multiple textboxes using jQuery with the same ID, it only works for the first textbox and not the others. My question is how can I create mult ...

javascriptjqueryajaxautocomplete

The server cannot process the content type 'application/json;charset=UTF-8' as it is not supported

As a newcomer to the Spring World, I am venturing into my first Jquery journey. I am attempting to retrieve JSON data from a JSP page using an Ajax call to the controller. Unfortunately, I encountered an error: org.springframework.web.HttpMediaTypeNotSuppo ...

javajqueryjsonspring-mvc