Issue in Loading JSON File in D3 on Local Computer using IE 11: "SCRIPT 5 Access is Denied" Error Caused by Same Origin Policy

Encountering an error loading this D3 visualization on Internet Explorer 11 in Windows 7:

SCRIPT 5 : Access is denied
d3.min.js, Line: 1, Column: 10922

According to information from msdn, the issue seems to be related to Same-Origin Policy despite having all necessary files - d3.min.js, flare.json, and html file - saved locally within the same directory. Attempts to adjust Security settings and adding 

<meta http-equiv="X-UA-Compatible" content="IE=edge" />
did not resolve the issue.

The visualization functions without errors on Firefox & Chrome but not in IE when accessing json data from external files as compared to including data directly in the html as a javascript variable like var data = {"name":"flare",...}.

Does this mean it's not feasible to run in IE?

EDIT-SOLUTION: The problem was localized to my local system. Uploading the files to a Sharepoint website allowed for successful execution.

javascriptjsoninternet-explorerd3.js

Answer №1

When you try to open the HTML file directly in the browser using file://, you may encounter an error due to restrictions on accessing files with different protocols, hosts, and ports. To avoid this error, always make sure to access the file through HTTP(S) when using AJAX, as the d3.json() function used for loading JSON files relies on AJAX. If the JSON file is hosted on a different domain, you may face CORS restrictions on the server side.

https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

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

What is the best way to interact with the crontab file using Node.js?

Currently working on an Electron application, I am in need of accessing and parsing the crontab file. Is there a way for Node.js (or another tool within Electron) to retrieve and read the primary crontab file? While exploring the cron-parser library, I d ...

javascriptnode.jscronelectron

(node.js) What is the correct way to invoke this middleware function?

Check out my Node.js question on Repl.it here I'm a beginner in Node.js and I'm struggling to call a function, receiving an error stating I got an Object instead of a middleware function. Apologies if my post doesn't meet all the requiremen ...

javascriptnode.jsexpress

Create a duplicate of the information stored within the $scope variable

Suppose there are multiple variables stored in a $scope and the objective is to create a new object that only includes those variables, excluding all the internal Angular-related data. The specific names of the $scope variables may not be known. This can ...

javascriptangularjs

Is it possible to optimize javascript & css bundling for a static website using webpack?

I have been working on organizing my javascript files for a static HTML website. Currently, they are scattered across different HTML files using the script tag. To streamline this, I have created a main.js file that requires all the other files. This main ...

javascriptjqueryhtmlcsswebpack

Vibrant Flutter image with a splash of color

I am currently working on developing an API that will display product images and colors. The goal is to have the image associated with a specific color appear when the user clicks on the corresponding color button using PageView.builder. I need help creati ...

jsonlaravelapibuttonflutter

Ways to determine whether a DOM textnode is a hyperlink

Is there a more foolproof method for determining if a DOM textnode represents a hyperlink? The code snippet below currently only checks if the node is directly enclosed in an anchor tag, which may not be sufficient if the <a> element is higher up i ...

javascriptdom

Having trouble with the functionality of a Chrome extension content-script JavaScript that is set to run at document_end

Currently, I am in the process of developing a Google Chrome extension that is designed to hide the "news" section located on the right-hand side of Facebook, along with the ads displayed on the right side. Additionally, the background color is meant to be ...

javascriptgoogle-chromegoogle-chrome-extensioncontent-script

Can PushState be used to Ajaxify CSS files?

Currently, I am in the process of developing a basic website and have decided to incorporate the Ajaxify library for seamless page transitions. One challenge I have encountered involves the combination of global CSS files (applied throughout the entire sit ...

javascriptjqueryhtmlcssajax

Guide to activating "Snapping" feature using the "Select" function in Openlayers 3

I have created an application using OpenLayers 3 that allows users to draw lines or points on a map and add tags to them. While the existing functions in OL3 are helpful for drawing and modifying features, I found it challenging to select the items I drew ...

javascriptopenlayers-3

The issue at hand involves Javascript, Ajax, latte, and Presenter where there seems to be a restriction on using GET requests for a file located

I have a query. I’ve been given the task of adding a new function to our web application. It was built on PHP by someone else, so it's proving quite challenging for me to debug as I am not familiar with this technology. I’m attempting to incorpor ...

javascriptajaxpresenternettelatte

The natural elements are so minuscule they are practically nonexistent

When referencing my DOM element using ViewChild in the code, I sometimes encounter an issue where the offsetHeight and offsetWidth are zero in the ngAfterViewInit hook. This leads me to believe that the element has not yet been rendered in the DOM. Are the ...

javascriptangulartypescriptionic-frameworkleaflet

Displaying information on a table using data from three separate JSON arrays within AngularJS

I have some JSON data: { tableList:["a","b"], dbList:["c","d"], score:[2 , 5] } I would like to display this data in a table using AngularJS like so: DB Table Score c a 2 d b 5 Can we utiliz ...

javascriptjqueryhtmlangularjs

"Exploring the New Features in React-Native 16 Alpha 12: Updating Prop Types

Upon creating a new project, my Expo XDE issued the following warning: 1:37:35 PM Warning: checkPropTypes has been moved to a separate package. React.checkPropTypes is no longer supported and will be completely removed in React 16. Use the prop-types ...

javascriptreactjsreact-nativereact-proptypes

Utilizing React hooks to capture the checkbox value upon change and transfer it to the submitForm function

I've got a functioning hook that monitors the onChange event of input fields, then spreads them into a variable and sends them to a Lambda function for sending an email with SendGrid. Everything is working fine. However, when I add an input type of c ...

javascriptreactjsreact-hooks

Getting the array's new length after a push operation in the application function

One of my app functions is responsible for storing data. It allows users to add new items and returns the length of the data array. I've observed a strange behavior where returning the data itself in a function includes the pushed items, but returnin ...

javascriptarraysfunction

What could be causing the data storage issue in the state?

Using axios, I am fetching data and storing it in a state variable useEffect(() => { getCartItems(); }, []); const [abc, setAbc] = useState([]); const getCartItems = async () => { let data = await CartApi.get(`/${store.getState().auth.user.id}/ ...

javascriptreactjsaxios

Inspecting JavaScript for any attachments

Before hitting the submit button, I need to verify if a file has been uploaded and display a warning message prompting the user to attach a file if it hasn't been done yet. I am looking for guidance on how to achieve this using JavaScript, Prototype, ...

javascriptjqueryhtml

Guide to querying a specific JSON field using a select statement and incorporating the count function

Seeking to extract a specific section of the JSON field in PostgreSQL using the count function, aiming to retrieve media with the status of whether alt text is present or not. Data Tables: properties id cid property_name 1 11 abc 2 11 pqr 3 11 ...

jsonpostgresqlleft-join

Displaying content on a click event in AngularJS

I am facing an issue with the ng-show directive not working as expected when a user clicks on an icon. The desired behavior is that the parent div should initially display content, but when the play icon is clicked, the contents of the div should become ...

javascripthtmlangularjs

Styling a Kendo Dropdownlist with JavaScript

Incorporating Jquery Kendo Dropdownlist to showcase information in a list has been quite beneficial. My current objective is to introduce the mentioned styles (.k-list-container and .k-list-scroller) into the Dropdownlist via JavaScript. Moreover, I aim t ...

javascriptjquerycsskendo-uikendo-asp.net-mvc