I am updating my website to PWA, and I am using google workbox as service worker to cache data. I can cache JS, images css etc, but I can't cache back4app query data.
I tried to use workbox.backgroundSync, but when I check in IndexDB, it cache nothing. Here is my code:
const bgSyncPlugin = new workbox.backgroundSync.Plugin('myQueueName',
{
maxRetentionTime: 24 * 60 // Retry for max of 24 Hours
});
workbox.routing.registerRoute(
'https://parseapi.back4app.com/classes/*',
workbox.strategies.networkOnly({
plugins: [bgSyncPlugin]
}),
'POST'
);
1) Is it possible to cache back4app data using workbox?
2) If possible, how do I do it? Can you give me an example of the code? I have tried for two days but didn't succeed. Thanks.
There's a npm module called "workbox-build" and it can be installed at the cloud code. If you install it and follow its guides, it will probably work as expected. :)
Related
I have a WebApp which fetches data from a database.
I have +server.js files from which my frontend fetches the data.
When I run npm run build:
adapter-auto:
No suitable adapter found.
adapter-static:
#sveltejs/adapter-static: all routes must be fully prerenderable, but found the following routes that are dynamic:
- src\routes
You have the following options:
- set the `fallback` option — see https://github.com/sveltejs/kit/tree/master/packages/adapter-static#spa-mode for more info.
- add `export const prerender = true` to your root `+layout.js/.ts` or `+layout.server.js/.ts` file. This will try to prerender all pages.
- add `export const prerender = true` to any `+server.js/ts` files that are not fetched by page `load` functions.
- pass `strict: false` to `adapter-static` to ignore this error. Only do this if you are sure you don't need the routes in question in your final app, as they will be unavailable. See https://github.com/sveltejs/kit/tree/master/packages/adapter-static#strict for more info.
If this doesn't help, you may need to use a different adapter. #sveltejs/adapter-static can only be used for sites that don't need a server for dynamic rendering, and can run on just a static file server.
See https://kit.svelte.dev/docs/page-options#prerender for more details
I experienced the same problem. What worked for me is adding export const prerender = true; to my +layout.server.ts file. In your case, just add it to your +server.js file at the top and run the build command again.
You can learn more about prerendering in SvelteKit docs
It's my first time using Electron JS and nodejs. I've built a small app that reads some records from a database and updates them. Everything is working fine. I have a config file with the database credentials but when I build a portable win app, I cannot figure out how to read the config file that I would like to place next to the exe. I would like to have easy access to the file, so I could run the same app on different databases.
Can anyone tell me if what I want is possible and how? I already tried to get the exe location but I couldn't. I also read a lot of topics here but nothing seems to solve my problem (I might be doing something wrong).
I'm using electron-builder to build my app.
Thanks in advance.
Edit #1
My Config file is
{
"user" :"X",
"password" :"X",
"server":"X",
"database":"X",
"options":
{
"trustedconnection": true,
"enableArithAbort" : true,
"trustServerCertificate": true
}
}
This is what I've and works when I run the project with npm start
const configRootPath = path.resolve(__dirname,'dbConfig.json');
dbConfig = JSON.parse(fs.readFileSync(configRootPath, { encoding: 'utf-8' }));
However, when I build it, the app is looking for the file in another location different from the one where the executable is.
Use of Electron's app.getPath(name) function will get you the path(s) you are after, irrespective of which OS (Operating System) you are using.
Unless your application writes your dbConfig.json file, it may be difficult for your user to understand exactly where they should place their database config file as each OS will run and store your application data in a different directory. You would need to be explicit to the user as to where to place their config file(s). Alternatively, your application could create the config file(s) on the user's behalf (automatically or through a html form) and save it to a location 'known' to the application.
A common place where application specific config files are stored is in the user's application data directory. With the application name automatically amended to the directory, it can be found as shown below.
const electronApp = require('electron').app;
let appUserDataPath = electronApp.getPath('userData');
console.log(appUserDataPath );
In your use case, the below would apply.
const electronApp = require('electron').app;
const nodeFs = require('fs');
const nodePath = require('path');
const configRootPath = nodePath.join(electronApp.getPath('userData'), 'dbConfig.json');
dbConfig = JSON.parse(nodeFs.readFileSync(configRootPath, 'utf-8'));
console.log(configRootPath);
console.log(dbConfig);
You can try electron-store to store config.
Electron doesn't have a built-in way to persist user preferences and other data. This module handles that for you, so you can focus on building your app. The data is saved in a JSON file named config.json in app.getPath('userData').
I'm trying to implement a local copy of a TileJSON in an iOS app through Cordova. The issue I'm having is that OpenLayers doesn't seem to recognise the JSON file as valid and thus doesn't show any tiles. I have tried local and remote versions of the same TileJSON and looked at the Console Logs, the local one has a status of "error" (but no explanation as to what that error might be...).
I think the issue is down to the fact that the JSON file is being loaded using a file: URL, rather than http:. I have put the JSON file on a remote server and this not only loads fine but actually loads the tiles from the local path.
Can OpenLayers be tricked into accepting the local file as a valid JSON file? Can Cordova be forced to load local files via HTTP? I think either of these options would fix the issue.
Thanks
EDIT: Here's the code I'm using to load the TileJSON:
var mapLayer = new ol.layer.Tile({
source: new ol.source.TileJSON({
url: getPhoneGapPath() + 'tiles.json',
crossOrigin: 'anonymous'
})
});
this.map.addLayer(mapLayer);
function getPhoneGapPath() {
var path = window.location.pathname;
path = path.substr( path, path.length - 10 );
return path;
}
The getPhoneGapPath() function is used to get the path to the webroot of the Cordova app.
This is probably related to a bug in OpenLayers, https://github.com/openlayers/ol3/issues/5647. The fix will be in the next release.
Also make sure that you configure Cordova to allow access to file:// urls when the application is served from a file:// url. The equivalent option in Chrome is --allow-file-access-from-files.
I'm attempting to use a JSON object living in a data.json file to be the dataset for a quick prototype I'm working on. This lives in a my_project/www/data/ directory. I have an Angular service that goes and grabs the data within this file using $http, does some stuff to it, and then it's used throughout my app.
I'm using Cordova and Ionic. When using ionic serve on my computer, everything looks perfect in the browser. However, when using ionic view (http://view.ionic.io/) and opening the app on my iPad, I see a:
{"data":null,"status":0,"config":{"method":"GET","transformRequest":[null],"transformResponse":[null],"url":"../data/items.json","headers":{"Accept":"application/json,test/plain,*/*}},"statusText":""}
for a response. I would think that if it were a relative URL issue, that it would also not work in the browser, but that is not the case.
Here's what I'm doing:
config.xml has this line:
<access origin="*" subdomains="true"/>
My service that preforms the simple request is doing:
return $http.get("../data/data.json").then(function (response) {
return response.data;
});
And finally, in my controller, I ask for the service to preform the request:
myService.goGetData().then(onComplete, onError);
In my browser, onComplete() is invoked and on the iPad, onError() is invoked.
Any guidance?
On your local developer machine you're actually running a webserver when you run ionic serve. So a path like ../../data.json will work because it is totally valid in the context of the webserver that has complete filesystem access.
If, however, you try to do the same thing on your device, you're probably going to run into an issue because the device has security policies in place that don't allow ajax to traverse up outside of the root. It is not a dynamic webserver so it can't load files up the tree. Instead you'd use something like the cordova file plugin to grab the file contents from the filesystem. If you prefer, you can use ngCordova to make interacting with the plugin a bit less painful.
I am 99% sure this is what is happening but you can test my theory by pointing your $http call to some dummy .json data hosted on a publicly available server to see if it works. Here is some dummy json data.
Just gonna leave this here because I had the same problem as the original question author. Simply removing any starting slashes from the json file path in the $http.get function solved this problem for me, now loading the json data works both in the browser emulator and on my android device. The root of the $http call url seems to always be the index.html folder no matter where your controller or service is located. So use a path relative from that folder and it should work. like $http.get("data/data.json")
So this is an example json file. save it as data.json
[
{
"Name" : "Sabba",
"City" : "London",
"Country" : "UK"
},
{
"Name" : "Tom",
"City" : "NY",
"Country" : "USA"
}
]
And this this is what a example controller looks like
var app = angular.module('myApp', ['ionic']);
app.controller('ExhibitionTabCtrl', ['$scope', '$http', function($scope,$http) {
$http.get("your/path/from/index/data.json")
.success(function (response)
{
$scope.names = response;
});
}]);
Then in your template make sure you are you are referencing your controller.
<ion-content class="padding" ng-controller="ExhibitionTabCtrl">
You should then be able to use the a expression to get the data
{{ names }}
Hope this helps :)
I was also looking for this and found this question, since there is no real answer to the problem I kept my search on the Internet and found this answer at the Ionic Forum from ozexpert:
var url = "";
if(ionic.Platform.isAndroid()){
url = "/android_asset/www/";
}
I've used it to load a 3D model and its textures.
update: ionic 2 beta (version date 10 Aug 2016)
You must add prefix to local url like this: prefix + 'your/local/resource'.
prefix by platform:
ios = '../www/'
android = '../www/'
browser = ''
we can create an urlResolver provider to do this job.
notice: only change url in *.ts code to access local resource, don's do this with remote url or in html code.
Have fun and good luck with beta version.
An Starter Ioner
It is possible to access local resources using $http.get.
If the json file is located in www/js/data.json. You can access using
js/data.json
Do not use ../js/data.json. Using that only works in the local browser. Use js/data.json will work on both local browser and iOS device for Cordova.
Can someone recommend a load testing tool which allows you to either:
a. replay an IIS (7) log(s) to simulate a real live site daily run;
b. import a CSV or equivalent list of URLS so we can achieve a similar thing as above but at a URL level;
c. .net API so I can create simple tests easily from my list of URLS is also a good way to go.
I do not really want to record my tests.
I think I can do B) with WAPT but need to create an XML file manually, not too much grief, but wondering if any tools cover these scenarios out the box.
Visual Studio Test Edition would require some code to parse the file into a suitable test run.
It is a great load testing solution.
Our load testing service lets you write a very simple script using JavaScript to pull data out of a CSV file and then fetch those URLs. For example, the following code would pluck 10 random URLs from the CSV file and fetch them as part of a single session:
var c = browserMob.openHttpClient();
var csv = browserMob.getCSV("urls.csv");
browserMob.beginTransaction();
for (var i = 0; i < 10; i++) {
browserMob.beginStep("Step 1");
var url = csv.random().get("url");
c.get(url);
browserMob.endStep();
}
browserMob.endTransaction();
The CSV file itself needs to be a normal CSV file with the first row containing a header named "url". This script would be run repeatedly for each virtual user participating in a load test.
We have support for so called 'uri-format' in our open-source tool called Yandex.Tank You simply put all your uris to a file, one uri -- one line, then specify headers in your load.ini like this:
[phantom]
address=example.org
rps_schedule=line(1, 1600, 2m)
headers = [Host: mts-maps.yandex.ru]
[Connection: close] [Bloody: yes]
ammo_file = ammo.uri
ammo.uri:
/
/index.html
/1/example.html
/2/example.html