I am attempting to load the Glyphicons font files associated with Bootstrap 3 into JxBrowser, however, the network requests appear to be timing out and getting canceled by Chromium. See screenshot of devtools linked below. Observed with Java 1.8.0_121, JxBrowser 6.14.2 using JavaFX.
I do not encounter this problem from a dev environment, i.e. reading Bootstrap and the associated font files directly from the file system. It only occurs when attempting to load the files from an EXE, and more explicitly, whenever the request is initiated from CSS via a #font-face call. I attempted to preload the font from HTML using:
<link rel="preload" as="font" type="font/woff2" href="path/to/resource/in/exe">
That appears to have worked as can be seen from the 200 response also in the screenshot linked below. However, Bootstrap appears to be unaware the font loaded and attempts to load the font itself which subsequently fails.
https://imgur.com/a/w8wd0nr
According to the screenshot, the relative path points to a resource located inside a JAR archive. Please note that Chromium cannot load resources from an archive such as JAR. You have two options:
Extract the required resources to a directory and load them from this directory.
Implement a custom protocol handler that will intercept the URL requests to the jar:// resources, reads the content of the required resource using the standard Java API, and sends a response to the web page as it was sent from a web server. For more details, please see the example at https://github.com/TeamDev-IP/JxBrowser-Examples/blob/master/network/src/main/java/JarProtocolHandler.java
Related
I have created an MVC application and hosted it on a server.
Yesterday I noticed when a user clicks on a link it opens an advertisement in another window.
I tried to identify what is happening using Google Chrome’s Developer tool and found that src of my script tag is being modified automatically (image is attached).
Kindly help me to solve this problem.
In the above image, my src of .js file is modified
The actual src I have used in my code.
The first image contains the actual src in my code
The second image contains the tempered src
In the background, I was using fiddler and saw this message there.
This can be caused by an illegal HTTP response earlier on this reused server socket-- for instance, a HTTP/304 response which illegally contains a body.
This was due to 'Man in the middle' attack. I installed an SSL certificate and the problem is solved.
I'm hosting an ASP.NET website on Local IIS (not IIS Express), and as soon as I save a change to a .css file in Visual Studio, the change immediately appears in browser windows that use that file (or after mousing over the window in Chrome), without clearing caches and refreshing.
Why do the changes appear immediately?
Opening the .css file itself (not a page using the file) in the browser shows a more expected result: saving the file in Visual Studio does not change what I see in the browser until I refresh the .css file.
As it turns out, I had Browser Link enabled in Visual Studio, and with it, CSS Auto-Sync. This opens up a port on the local machine and uses SignalR to communicate with the browser window about 400 times per second, including any CSS changes needed.
For more information, see these topics:
.net localhost website consistently making get arterySignalR/poll?transport=longPolling&connectionToken= calls
How can I disable __vwd/js/artery in VS.NET 2013?
This probably happens due to caching. when you open the css itself, it retrieves a new copy from the server, but when you open a page that uses the css file, the css file is being cached as the page's resource and the browser just shows the cached resources until you force it to reload them.
a trick i learned to fix the issue, is to link the css file to the aspx page and include a random query string to the linking, that way it tricks the browser to think that its a new resource and reload it from the server anyway.
like this:
<link href="../stylesheets/MyCSS.css?<%=DateTime.Now%>"
rel="stylesheet" type="text/css" />
we use the aspx preprocessor directive <%=DateTime.Now%> to append the current time as a query string, to ensure the link is always different.
Dont forget the question mark between the css filename and the preprocessor directive
I'm having a problem using Vaadin (in Eclipse) and its associated styling engine Valo, and the TouchKit package. I mention all of these because I'm not sure which, if any, is causing the problem. The name of my custom theme (which imports Valo) is simply "touchkit".
I have the project running on a Tomcat server on localhost and accessible in my browser. I wanted to tweak some of the CSS so I edited the appropriate file WebContent/VAADIN/themes/touchkit/touchkit.scss. After editing this file, I recompile the theme and see the appropriate changes in the generated file styles.css. Then I go to load up the application in my browser, and things get weird.
I can load the page and, using Chrome's developer tools, see that the page requests styles.css for download, as expected. It gets a 200 OK response from the server, but when I view styles.css, it contains just a single \n. This is also true in Safari. Even using cURL to download styles.css yields the same result. In the Eclipse editor, and when I inspect it in the terminal, styles.css is ~12,000 lines long. Why can't my browser or cURL get that data?
I can view similar project demos on Vaadin's own site and the stylesheet (which should be almost identical to mine) is loaded correctly. Also, other Vaadin projects on my localhost server have their stylesheets loaded correctly (though they do not use Valo). Compiling the theme in Eclipse yields no errors. Because the issue presents itself across a variety of graphical and non-graphical clients, I'm starting to think the issue is with Tomcat. But I can get to the directory from which Tomcat serves files and styles.css is correct in that folder too. There's no apparent reason that Tomcat would be serving a blank file.
You may have guessed from the description, but I'm working on a Mac. Any help is appreciated!
PS Mods - I also asked this question over at Superuser since it wasn't 100% a programming question. However, I'm new at Superuser and couldn't create tags for Vaadin or Valo, so I'm asking here where there might be a better chance of getting an answer.
Hard to say, since your are doing everything fine. My best bet would be the tomcat implementation you are using, maybe there's something weird there. Try upgrading to latest if it's not or to a previous version.
FYI I'm using Tomcat 7.0.55.
PS: your attempts are in run/debug from eclipse or have you made a .war form the project and deployed it with the Tomcat-Manager?
Regards
add below to your gwt.xml, and touchkit is not valo aware see https://vaadin.com/forum/#!/thread/8264224/8264223
<set-configuration-property
name='touchkit.manifestlinker.additionalCacheRoot'
value='src/main/webapp/VAADIN/themes/MyTheme:../../../VAADIN/themes/MyTheme' />
I'm developing a Chrome extension that has an options page. And I am willing to style this page same as Chrome options page is styled. I found that there is a file
chrome://resources/css/widgets.css
that holds this style (it is listed in "Developer Tools > Sources"). However, if try to load it in my page either directly from HTML
<link rel="stylesheet" href="chrome://resources/css/widgets.css" type="text/css">
or from CSS
#import url("chrome://resources/css/widgets.css");
then get this error printed in the console:
"Not allowed to load local resource: chrome://resources/css/widgets.css
It looks like I'm missing some permissions in my manifest.json, but did not find anything suitable on the developer's pages (notice it lists "chrome://favicon/", but that's it).
Anyone knows a solution?
P.S. Yes, I have copied this file into my extension's folder, and I got what I want, but the smart and proper way using this file (IMHO) is loading it directly from Chrome resources.
Short answer: No, you can't access chrome://resources... from an extension.
First, it's blocked on purpose, thus why you see "Not allowed to load local resource." Second, you really shouldn't rely on Chrome's resources, which can change in any version.
In the head section of the sample html file from the html5boilerplate project, I notice this:
<link rel="stylesheet" href="css/style.css?v=2">
Note the v=2 request variables. I also notice that this is never done for javascript files.
What is the actual function of doing this ?
The ?v=2 might be to prevent reading from cache by the browser. It's used when loading dynamic content from a static file, like so:
changingListOfStuff.txt?randomUselessPropertyToTrickBrowser=123456789
This forces the browser to use this exact file, not a cached version of changingListOfStuff.txt previously downloaded and stored by the browser. Caching speeds up loading time, but might provide an older version of the file if it changes rapidly.
Read more about caching here: http://en.wikipedia.org/wiki/Web_cache
this is just telling the version of the url. This is done to make a fresh request to the server.In case of css as we know to achieve performance some headers are modified so that next time css is served by the browser history.But every time a css is modifed specifically in case of version releases. Browser should make new requests that would happen only when the url changes. So v=2 probaly means a new version is in and the url should freshly fetch the content from css.
This is called cache busting...you can read it here too
http://manikandanc.blogspot.com/2005/11/cache-busting-with-javascript.html
this will avoid client to get the version from browser. When you change the javascript or css , the end client who already visited your website may get javascript from his cache.
You can increment the version no whenever you deploy the files to the production , so that it will get the latest file