I'm using pwa in my angular application, when ever I serve my application using ng serve refreshing the page cause manifest.webmanifest not found. Is there any workaround to prevent this. Thank you.
Please add the below code in your index.html and also check the manifest file in your project. You can changes the extension of your manifest file to .json. It worked for me
<link rel="manifest" href="manifest.json">
Also, please check the MIME type of your response(should be application/manifest+json or application/json) based on file extension
Related
Since most of the example available in Internet is working based on Internet.
I would like to download and use. I don't want to use either CDN or openlayer.org in my code.
Is it possible to use openlayers without a CDN?
Yes. Like any library, you can download locally. This page has some download links to get the CSS and JS files: https://openlayers.org/download/
You download and unzip those into a folder that is accessible from your web server. Usually this is a scripts subfolder
Then you simply reference them as explained here:
https://www.w3schools.com/css/css_howto.asp
https://www.w3schools.com/tags/att_script_src.asp
(note these are very basic W3C references. You should really know this)
So if you downloaded those .js and .css files into a scripts subdirectory you do this:
<script src="scripts/theopenlayersscriptfile.js"></script>
<link rel="stylesheet" type="text/css" href="scripts/theopenlayerscssfile.css">
Edit:
After some experimenting and investigation, you mention that it is trying to access https://c.tile.openstreetmap.org/4/6/6.png
I googled and found this link
https://wiki.openstreetmap.org/wiki/OpenLayers_Local_Tiles_Example
Which says
With this example you can browse your tiles stored localy without any webserver. I use this to check my tiles I downloaded to use in Osmtracker. But you can also browse Tiles rendered by any other techniques.
The instructions at this link appear to explain exactly what you want to do - it has references to all of the files you are trying to use.
I am building a client/server app in Dart using Angular for the front-end and Shelf on the backend. When I do a pub build it generates the javascript for the Dart files as expected but is does not replace the dart references in my HTML files. So in my index.html I have the following script reference:
<script type="application/dart" src="main.dart"></script>
This makes my application not load correctly. If I manually change it to
<script src="main.dart.js"></script>
My application works as expected. My question is, is there a way to configure my pub build to do this automatically? Or are dart files references not supposed to be replaced with JS references? If so, how do I build a basic server?
I know this produces an error message in the browser console but never experienced any problems because of this.
I haven't used it myself yet but I think this transformer https://pub.dartlang.org/packages/dart_to_js_script_rewriter does what you want.
I created Phonegap application that holds web pages in file system. When I open any of these web pages from filesystem, only chosen page is loaded, but related files (images, css etc.) not.
For example there is webpage in filesystem under path:
cdvfile://localhost/temporary/1/
In this directory there are files like: index.html, style.css, img/background.png etc.
When I open file index.html only this file is opened, but page has no styles and no images. These related files have relative path in index.html.
This situation is on iOS platform only. On Android platform and on google chrome all works. Why is that and can I fix it?
EDIT:
I just figured out that links and js loaded from file work. For example:
link
opens right page. But css like:
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<link rel="stylesheet" href="css/style.css"/>
</head>
are broken.
EDIT:
Unfortunately, this is an open bug in cordova project: https://issues.apache.org/jira/browse/CB-6532
See https://stackoverflow.com/a/22801512/276648
I ended up using a relative path (ie something like ../../Documents/MyApp/temporary/1/) instead of the full path (ie cdvfile://localhost/temporary/1/) to fix the CSS issues in iOS.
It looks like you are running into CB-6532. I just put in a pull request for a fix -- you can temporarily use my fork until it is accepted:
https://github.com/loufranco/cordova-plugin-file
To use it, do
cordova plugin remove org.apache.cordova.file
cordova plugin add https://github.com/loufranco/cordova-plugin-file.git
Remember to reverse it if the pull request is accepted.
I created a new Phonegap 2.5 project from scratch, and I've been trying to load an external URL in it, but I keep getting input boxes popping up on startup before loading the actual URL. I first get a pop-up with the URL of the website, then in the input box it says "DeviceInfo","Device652321624". If I click Cancel, it pops up 2 more times before loading the website. On the website itself, it loads some relative URLs, but others cause the entire page to refresh and the input boxes to pop up again.
I set the URL by setting <content src="http://phonegap.example.com" />, which is just a regular website with Javascript. I even tried commenting out all Phonegap specific code (no more ondeviceready calls), but it still causes the problem. http://www.google.com loads for me, so I'm not sure what else to check. And it works with the Android version that I've developed.
If it helps, I've also seen this message in the XCode log: Resetting plugins due to page load.
I've had the exact same problem today.
I fixed it by checking the include of the cordova.js file (this js is generated when you create the project using the create command.
( called cordova.js in the renamed cordova project version. probably phonegap.js in phonegap ?)
anyway my include was :
<script type="text/javascript" src="js/cordova.js"></script>
whereas je js file was in the project root :
I changed it to
<script type="text/javascript" src="cordova.js"></script>
and every things is fine now.
also, the 'create' command for Android generate a different js file. make sur that the new one generated for ios is used.
hope that helps !
Problem is you are using android's cordova.js instead of ios's cordova.js.
Just make sure you are using the proper one.
I am using relative path to include jquery mobile. But when loading thru a secure(https) link, the imports are failing. I do the following :
<link rel="stylesheet" href="//code.jquery.com/mobile/1.1.0/jquery.mobile.min.css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="//code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
jquery from googleapis goes thru fine. But I get the the following error for mobile .js and .css imports above.
Failed to load resource https://code.jquery.com/mobile/1.1.0/jquery.mobile.min.css
Failed to load resource https://code.jquery.com/mobile/1.1.0/jquery.mobile.js
Sorry if this seems like a pedestrian question, I am new to this.
If you click on both of the failed resource links, you'll understand why.
code.jquery.com doesn't have a valid SSL certificate.
As Quinn says, you should copy those JS files to your server and serve them yourself, or set up a proxy page in PHP or another scripting language that will fetch the files over HTTP and serve them up from your server.