Installed Highstock 8.0.0 on an Amazon Linux server: Amazon Linux release 2 (Karoo)
Installed and execute Apache version:
Server version: Apache/2.4.41 ()
Server built: Oct 22 2019 22:59:04
Uploaded the highstock.zip and uncompressed it on /var/www/html
Installed node.js (v12.13.1) and set a test on port 3000.
I am able to browse it usnig my workstation Chrome v79.
Now when I test the index.htm provided by the highstock.zip, I get the browser displaying the
several graphics links on the menu page. I choose the first link (General -> "Stock chart with GUI")
nothinmg is displayed. Chose the second link (General -> "Single line series"), also nothing.
Then I switch and went to the end of the menu and teste the link "Flags and Indicators" -> "Flags shapes and colors" and it works just fine. Go up, the next link above "Flags placement", and it also works.
and thats abou it. All other links on main page just freeze and show a blank page.
Now thew only thing I could notice is that the js associated to the links that worked has just 3 js attachments:
<script src="../../code/highstock.js"></script>
<script src="../../code/modules/data.js"></script>
<script src="../../code/modules/exporting.js"></script>
Any adition to such list, which happens to all index.htm refered on the maisn menu page failed.
for instance if I try the link General -> "Single line series", and open its index.htm (..//examples/basic-line/index.htm) I notice it refers to the same 3 js as the above one plus
export-data.js:
<script src="../../code/highstock.js"></script>
<script src="../../code/modules/data.js"></script>
<script src="../../code/modules/exporting.js"></script>
<script src="../../code/modules/export-data.js"></script>
Thats about it. Any clue ?
Thanks
Problem solved.
Using Chrome development tool I trace the error message:
Access to XMLHttpRequest at 'https://www.highcharts.com/.../aapl-ohlcv.json' from origin 'http://xxx.yyy.zzz.www' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Installed Chrome extension "Allow CORS: Access-Control-Allow-Origin". Toggle it ON and graphics were displayed.
In parallel highcharts support replied:
...Default browser behavior is to block any content loaded from a domain that has CORS policy set up preventing requests from outside of the same domain.
This could be overridden by some CORS plugins, but the intention is to limit the data requests to our servers....
Hope this reply help others.
Related
I have a chrome extension that was working on the manifest version 2 without a problem. I had some javascript in the background that included web assembly and required wasm-eval. I have converted the extension to manifest version 3, which doesn't allow wasm-eval or unsafe-eval any more. What I did for a solution is I created a new window (mainpage.html) from the extension and this window includes an iframe (sandbox.html) and this iframe includes the web assembly code and communicates with the background service worker with postMessages.
I am wondering if there is a solution without opening a new window for my case. Something that will run the sandbox.html running in the background and the service worker can communicate with it. I tried to put the sandbox.html to the service worker, but the service worker doesn't accept html files running inside.
Popup script is not a solution because the user needs to click the extension icon to make it running. Content script worked but if the website has a content security policy that doesn't allow unsafe-eval, then it won't work. I need a more general solution.
There is something explained here with the Event pages for which I have no idea, and I believe it is deprecated as well. Service worker cannot have access to the DOM. https://developer.chrome.com/docs/extensions/mv3/sandboxingEval/
this is from the manifest.json
"sandbox": {
"pages": ["sandbox.html"]
}
this is what mainpage.html looks like
<iframe id="theFrame" src="sandbox.html" style="display: none;"></iframe>
<script src="mainpage.js"></script>
this is what the sandbox.html looks like
<script src="wasm_exec.js"></script>
<script src="wasm_startup.js"></script>
<script src="assign_result.js"></script>
<script src="event_listener.js"></script>
I came across dozens of pages and came to post a new question on this topic as I could not find the answers.
I have a Jenkins server running in a remote machine in the network and I access the application in my local machine to check the reports. The report is a html page and it has hyperlinks for screenshots (PNG file) and other html pages to analyze.
The problem is, when I use Internet Explorer 11 to view this Jenkins report from my local machine, I am not able to open the screenshots or link to other html pages from the main report. When I use Mozilla firefox the links and images opens fine.
More annoyingly, if I trigger the report from my local Eclipse Workspace directly, I am able to open the report from the Repository folder in IE11 itself with no issues.
Things I have did already with my browser and some of the information reg the report are mentioned below.
The Jenkins URL is added in the Trusted sites and pop ups are allowed in my local machine browser.
When I copy paste the URL for image hyperlink in the IE11, it opens the image properly.
In Internet options -> Advanced -> Multimedia, Show Pictures option is enabled.
Enable Protected Mode is disabled for all the zones.
Compatibility view settings changes did not have any impact on the issue.
In the Developer Tools Emulation, changing the Document mode did not have any impact on the issue.
The head tag in the Report html is specified below
<head>
<meta charset="UTF-8">
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
</head>
What could be the problem root cause for the issue I am facing?
I'm using these three CDN files, as recommended on getting started in JQM documentation:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
I'm perplexed why I'm getting a 404 Not found status under the Network tab in Chrome. Seems to be looking jquery mobile min.map file. I don't see this in Firefox.
Any thoughts as to why it's looking for this file?
Probably your Google Chrome DevTools has enabled the option "Enable source maps". Check your Settings menu, then General and Sources.
A source map file it's a way to map a combined/minified file back to an unbuilt state. When you build for production, along with minifying and combining your JavaScript files, you generate a source map which holds information about your original files. When you query a certain line and column number in your generated JavaScript you can do a lookup in the source map which returns the original location. Developer tools (currently WebKit nightly builds, Google Chrome, or Firefox 23+) can parse the source map automatically and make it appear as though you're running unminified and uncombined files.
More information here.
File not found : 404 will be shown only in browser developer tools. If developer tools are not opened the sourcemap file will not be accessed from browser
You can remove the 404 by removing the line
//# sourceMappingURL=jquery-1.x.xmin.map
from the top (or bottom as #ittradco mentioned in comment ) part of your jQuery file.
The top part of the jQuery file will look like this.
/*! jQuery v1.10.2 | (c) 2005, 2013 jQuery Foundation, Inc. | jquery.org/license
//# sourceMappingURL=jquery-1.x.x.min.map
*/
Just change that to
/*! jQuery v1.10.2 | (c) 2005, 2013 jQuery Foundation, Inc. | jquery.org/license */
Purpose of a source map
Basically it's a way to map a combined/minified file back to an unbuilt state. When you build for production, along with minifying and combining your JavaScript files, you generate a source map which holds information about your original files. When you query a certain line and column number in your generated JavaScript you can do a lookup in the source map which returns the original location. Developer tools (currently WebKit nightly builds, Google Chrome, or Firefox 23+) can parse the source map automatically and make it appear as though you're running unminified and uncombined files.
(Read more on this here)
I've run into a problem where I add a web app to my iPad home screen (iOS 5.0.1 iPad 2), and when I open it it appears to be caching something behind the scenes, independent of Safari.
I've cleared out everything from Safari that's available in Settings (Clear History and Clear Cookies & Data), and when I navigate to the web app with Safari I see the app in its current state. However if I open the home screen bookmark I get the app in a pre-changed state.
I've seen a lot of information about using a cache.manifest to cache resources for offline use, but I'm not sure if that's relevant to this since I would like the exact opposite: cache nothing.
I've gone to the level of not even testing external resources; if I change some arbitrary test string in the body element of my index.html, the home screen bookmark does not show the updated text.
Another workaround is to add ?v=1 to your Javascript and CSS links. For example:
<link rel="stylesheet" type="text/css" media="all" href="./css/ipad.css?v=1">
<script src="./js/ipad.js?v=1"></script>
It seems one doesn't have to update the number when your file has changed, as far as I can tell. Apparently, on an iPad 2 with the latest software update installed, it is enough to just hint at something dynamic.
Create a cache.manifest that instructs it never to cache resources referenced by the main html page:
CACHE MANIFEST
# Version 1.0000
NETWORK:
*
Use it in your index.html:
<!DOCTYPE html>
<html manifest="cache.manifest">
Now whenever you change that manifest file -- for example, by increasing the version number in that comment -- the browser will redownload index.html also.
Ensure your page gets reloaded when the cache is updated:
<script>
function updateSite(event) {
window.location.reload();
}
window.applicationCache.addEventListener('updateready', updateSite, false);
</script>
The Safari Developer Library has good documentation.
I think I found a workaround:
The new version of the site only appears when the index.html file changes.
(the first file to be loaded)
If you leave the index.html and only change some js in other files then the site doesn't load the new version.
For our iOS webclip apps we are using the following. So far no cache problems:
1- We have one cache manifest file called 'manifest.appcache.php'
<?php
header("Cache-Control: max-age=0, no-cache, no-store, must-revalidate");
header("Pragma: no-cache");
header("Expires: Thu, 01 Jan 1970 00:00:01 GMT");
header('Content-type: text/cache-manifest');
?>
CACHE MANIFEST
CACHE:
# Don't cache anything
FALLBACK:
# Nothing
NETWORK:
# Request everything from server
*
2 - In the HTML file we have:
<!DOCTYPE html>
<html lang="en" manifest="manifest.appcache.php">
<head>
...
I have an angular app I'm developing and ran into this issue when trying to test it on an iPad. By adding a meaningless query to the end of the url I was able to get a current version of all the assets.
www.somesite.com?meaninglessquery
You can force the open web app to reload without using the cache if you have the Safari Web Inspector open and pointing at your open web app. With the Web Inspector active, press SHIFT + COMMAND + R (on a Mac). You may need to refresh one more time to trigger the updated assets.
I've had luck with powering off the device.
I had changed the app manifest; but presumably, you need a refresh or something to get the browser to look for it.
Since I removed the browser chrome, there's no reset button. We tried "closing" the app (haha) and swiping the app away; but I presume iOS tends to keep things running anyway.
Shutting down did the trick to get it to refresh.
Maybe there's some gesture for refresh I don't know. Perhaps one should tuck a little "check for updates" refresh button into cached web apps.
The latest Safari (v12.0.1) developer tools has a "Ignore resource cache" button at the top right of the Network tab. Check that, then reload.
Already found this page with some helpful hints.
Problem is I need to debug a web application on a CMS using an iPad and Safari.
So far I haven't been able to make firebug-lite work. I am working in a secured environment having no internet acces, but can copy files using a USB-key.
I have copied firebug-lite.js to the local server and included the file in a script tag in the head:
<script type="text/javascript" src="http://my_server/js/firebug-lite.js"></script>
Unfortunatly when I open the page in the CMS I cannot see the firebug-lite-button on the page. Verifying the source code firebug-lite should have been loaded on the page. There is no way to get a right click menu to inspect anything.
What can I do to make firebug-lite work on the iPad? What am I doing wrong?
Start Firebug Lite already opened, as per http://getfirebug.com/firebuglite#Options :
<script type="text/javascript" src="proto://path/to/firebug-lite.js#startOpened=true"></script>
I think you won't be able to inspect elements, but you can navigate to the elements in the DOM tree provided by Firebug Lite.
It looks like Firebug-lite has problems with the iPad browser since late 2010.
The problem (ticket on official tracker) has not been yet solved.
Have you tested the problematic page in Safari/Chrome/Chromium for desktop? Since they use Webkit, the same system used with mobile Safari/Chrome, you may be able to duplicate the error and find its solution. You can open Chrome's debugger with right click, Inspect element.