Is there a way to debug a production website without uploading the map file to the server due to privacy concerns since it is public?
Please advise if this is possible. Thank you!
Is there a way to debug a production website without uploading the map file to the server due to privacy concerns since it is public?
Please advise if this is possible. Thank you!
Currently, it seems that no web browsers support loading source maps on demand directly from local files. Therefore, the only option is to somehow host the sourcemaps online for accessibility.
An effective solution might involve implementing a .htaccess file (or an equivalent method for servers other than Apache) that limits access to the sourcemap and original source files to clients within your own network.
It's important to understand that attempting to restrict access to sourcemaps solely for security purposes may provide a false sense of protection. JavaScript code is generally public, and even if it's obfuscated or encrypted, it can still be deciphered with relative ease. It's crucial to never include sensitive data in your JavaScript code, regardless of how you minify or encrypt it.
If you're looking for a solution, consider the following:
For a comprehensive guide on Multi-level Source Maps, check out The CSS Ninja website.
Incorporating UglifyJS2 allows you to specify an input source map, though this setup has not been locally tested.
Another option is hosting the file locally and updating your hosts file to redirect local.mydomain.com to localhost. This way, you can set
local.mydomain.com/js/my-orig-js-file.jsOne alternative is to store the map file and the minified js on the server while keeping the original js file locally. Then, make changes to your map file similar to the following:
{
"version":3,
"sources":["http://localhost/library.js"],
"names":["sample","terminal","record"],
"mappings":"AAAA,QAASA,YACRC,QAAQC,IAAI","file":"script.min.js"
}
One way to utilize local source map files in Chrome is by making them accessible through http(s).
The initial step involves using a localhost static server like 'serve' to host your map files.
You can achieve this by running the serve -s mapDirectory command to set up a localhost web server that serves the desired map files.
Afterwards:
For detailed instructions along with a video guide on how to accomplish this task, refer to: https://developer.chrome.com/docs/devtools/javascript/source-maps
Just starting out with Reactjs and looking to build an Autocomplete component that fetches API data on every input change to update the options. I've been using the Autocomplete component from Material UI but struggling to get it working as expected. ...
I'm feeling frustrated with a situation on my web page. I have a div that opens up in colorbox when clicked. Inside the div, there are links that should trigger an event in the code below. This event is meant to fill a hidden field and then click a se ...
I am trying to retrieve data from a document using Node.js and encountering an issue where the map operator is returning data with similar names twice. I am wondering if I can use filter instead of map to address this problem. Here is the code I am using t ...
Recently, I created a React+Webpack project and noticed that it takes 60 seconds to build the initial bundle, and only 1 second to append incremental changes. Surprisingly, this is without even adding my application code yet! It seems that the node_modules ...
I am trying to disable the observeChanges method on a collection when updating it. Does anyone have a solution for this? I came across the Meteor Docs which mentioned using reactive: false for the .find() method. Is there a similar option for the .update( ...
After running this command, I encountered an issue: $("#dateTime").text(new Date().toLocaleString()); The result displayed was 2/21/2020, 10:29:14 AM To make the time increase every second, I attempted this code: setInterval($("#dateTime").text(new Dat ...
My code is set up to create a unique diamond shape in Three.js: var material = new THREE.MeshPhongMaterial({color: 0x55B663, side:THREE.DoubleSide}); var geometry = new THREE.Geometry(); geometry.vertices.push(new THREE.Vector3(0, 1, 0)); geometry.v ...
Here is a piece of code that needs to call a callback which may return a promise. The goal is to resolve the promise and log an error if it fails, without the caller knowing about it or waiting for the promise to fulfill. However, not returning the promise ...
The current versions I am using are Plotly 2.14.0 (latest) and VueJs 3.2.37 (latest). I am attempting to plot with the type "scattergl", but encountering error messages in Chrome/Edge browsers: WebGL: INVALID_OPERATION: useProgram: program not valid WebGL ...
I am struggling with updating the current state of my component based on a result using a custom hook in React. Whenever I try to update it, I end up in an infinite loop rendering due to my usage of the useState() hook. I am still new to working with Rea ...
Every time I attempt to retrieve a value using typescript, I keep encountering the same error message: Unsafe return of an any typed value. This issue arises from a function within the @update method of a select element. <q-select ...
Despite multiple attempts and experimenting with different methods like user-agent and BeautifulSoup, I am unable to access the website. from selenium import webdriver from selenium.webdriver.chrome.options import Options opts = Options() opts.add_argum ...
I've been experimenting with creating a sankey diagram using d3 and react.js, and I'm using this example as a guide. I am new to React (just 2 days in) and encountering an error that says: ./src/components/SankeyComponent.js An import error occ ...
I am working on a Dygraph object creation script that includes a data variable. However, I want to avoid passing in this variable for older browsers. Here is the code snippet: function prime() { g = new Dygraph( document.getElementById("g"), d ...
Just to clarify, I am using an absolute positioned flex container for a grid layout. Inside this flex container, there is a relative positioned element with the class .tileWrapper that expands to fill the space after the animated .tile. When I click on th ...
Trying to convert JSON data into an HTML table, I encountered the following error: "Cannot read property '0' of undefined" <?php $idmatchs = "bGdzkiUVu,bCrAvXQpO,b4I6WYnGB,bMgwck80h"; $exploded = explode(",", $idmatchs); $count = count( ...
I am looking to use the same panel across multiple pages in a jQuery multipage HTML file. My goal is to have consistent code throughout all pages. However, I am encountering an issue with the positioning of external panels. Currently, it seems that extern ...
I need help iterating through an array of objects with a specific interface structure: export interface Incident { ID: string; userName1?: string; userName2?: string; userPhoneNumber?: string; crashSeverity: number; crashTime: number; } Here ...
Is there a way to access a variable as both a function and an object instance using TypeScript? log("something"); log.info("something"); I've attempted various methods, such as modifying the prototype, but nothing has proven succ ...
I am looking to incorporate Trumbowyg library into my React project, however, I have encountered an error stating that jQuery is not defined. I found information suggesting that jQuery needs to be made available as a global variable in the window object. ...