Closed G1dz closed 3 years ago
jepiqueau
commented
3 years ago @G1dz thanks for using the plug-in. When I add the secure storage of the password I had to move the API level from 21 to 23 due to the use of androidx.security:security-crypto:1.0.0. When this will be level down to 21 by Google I will implement it. Otherwise there is not to much I can do sorry for this. If you do not hAve run the deleteOldDatabases method your cordova databases are still in place
jepiqueau
commented
3 years ago @G1dz I know that the release 1.1.0.alpha.3 of androidx.security:security-crypto is now supporting level 21 but with a big change on the Master key so I need to find some examples on how to use it and implement them in a plug-in. I am currently travelling for the next 3 weeks so I am not sure I will have time to look at it earlier. May be if you have time you may have a look in this direction and make a PR
G1dz
commented
3 years ago @jepiqueau Thank you so much for your reply! I greatly appreciate the effort! I will take a look. Looking forward to any updates on this.
jepiqueau
commented
3 years ago @G1dz this is fixed in @capacitor-community/sqlite@web it will merge into @capacitor-community/sqlite@latest when @capacitor/core@3.1.3 will be available. thanks for your patience. Tell me if it is working on your site and close the issue
rubickecho
commented
3 years ago @jepiqueau hi，what's the current progress of the web? Are there any release plans?
jepiqueau
commented
3 years ago @peakcool it is released if you use npm I --save @capacitor-community/sqlite@next it works well in Stencil apps and Ionic/Angular App. I got a problem in Ionic/Vue and Ionic/React as the wasm file does not load and I did not figure-out the reason. If you are working with these frameworks and have an idea about it tell me
rubickecho
commented
3 years ago yes, i'm using Vue, i will try
jepiqueau
commented
3 years ago @peakcool try without using the hook as it has not been updated to handle the web
jepiqueau
commented
3 years ago @peakcool What i did is
jeep-sqlite stencil component
import { defineCustomElements as jeepSqlite } from "jeep-sqlite/loader";jeepSqlite(window);
- copy the `sql-wasm.wasm` file into the `public/assets` folder
- create a `databases` folder under the `public/assets` folder where i save the asset databases
- create a `databases.json` containing the list of databases ie{ "databaseList" : [ YOUR_ASSET1_DB.db, YOUR_ASSET2_DB.db, ... ] }
i got [Vue warn]: Failed to resolve component: jeep-sqlite
at
and jeep-sqlite.entry.js?e439:2651 wasm streaming compile failed: LinkError: WebAssembly.instantiate(): Import #0 module="a" function="a" error: function import requires a callable
eval @ jeep-sqlite.entry.js?e439:2651
Promise.then (async)
eval @ jeep-sqlite.entry.js?e439:2651
Promise.then (async)
eval @ jeep-sqlite.entry.js?e439:2651
eval @ jeep-sqlite.entry.js?e439:2651
eval @ jeep-sqlite.entry.js?e439:2651
initSqlJs @ jeep-sqlite.entry.js?e439:2509
open @ jeep-sqlite.entry.js?e439:4471
_open @ jeep-sqlite.entry.js?e439:8072
open @ jeep-sqlite.entry.js?e439:7672
eval @ index-74b93e25.js?b780:284
Promise.then (async)
value @ index-74b93e25.js?b780:284
open @ web.js?ff3a:61
eval @ index.js?1547:171
Promise.then (async)
open @ index.js?1547:168
open @ definitions.js?7287:234
_callee2$ @ NoEncryptionTest.vue?d3af:39
tryCatch @ runtime.js?96cf:63
invoke @ runtime.js?96cf:293
eval @ runtime.js?96cf:118
asyncGeneratorStep @ asyncToGenerator.js?1da1:3
_next @ asyncToGenerator.js?1da1:25
Promise.then (async)
asyncGeneratorStep @ asyncToGenerator.js?1da1:13
_next @ asyncToGenerator.js?1da1:25
Promise.then (async)
asyncGeneratorStep @ asyncToGenerator.js?1da1:13
_next @ asyncToGenerator.js?1da1:25
eval @ asyncToGenerator.js?1da1:32
eval @ asyncToGenerator.js?1da1:21
_noEncryptionTest @ NoEncryptionTest.vue?d3af:39
noEncryptionTest @ NoEncryptionTest.vue?d3af:39
_callee$ @ NoEncryptionTest.vue?d3af:20
tryCatch @ runtime.js?96cf:63
invoke @ runtime.js?96cf:293
eval @ runtime.js?96cf:118
asyncGeneratorStep @ asyncToGenerator.js?1da1:3
_next @ asyncToGenerator.js?1da1:25
eval @ asyncToGenerator.js?1da1:32
eval @ asyncToGenerator.js?1da1:21
callWithErrorHandling @ runtime-core.esm-bundler.js?5c40:155
callWithAsyncErrorHandling @ runtime-core.esm-bundler.js?5c40:164
hook.weh.hook.weh @ runtime-core.esm-bundler.js?5c40:2913
flushPostFlushCbs @ runtime-core.esm-bundler.js?5c40:358
flushJobs @ runtime-core.esm-bundler.js?5c40:394
Promise.then (async)
queueFlush @ runtime-core.esm-bundler.js?5c40:287
queueJob @ runtime-core.esm-bundler.js?5c40:281
run @ reactivity.esm-bundler.js?a1e9:183
trigger @ reactivity.esm-bundler.js?a1e9:189
scheduler @ reactivity.esm-bundler.js?a1e9:866
run @ reactivity.esm-bundler.js?a1e9:183
trigger @ reactivity.esm-bundler.js?a1e9:189
scheduler @ reactivity.esm-bundler.js?a1e9:866
run @ reactivity.esm-bundler.js?a1e9:183
trigger @ reactivity.esm-bundler.js?a1e9:189
scheduler @ reactivity.esm-bundler.js?a1e9:866
run @ reactivity.esm-bundler.js?a1e9:183
trigger @ reactivity.esm-bundler.js?a1e9:189
set value @ reactivity.esm-bundler.js?a1e9:776
finalizeNavigation @ vue-router.esm-bundler.js?6c02:3140
eval @ vue-router.esm-bundler.js?6c02:3013
Promise.then (async)
pushWithRedirect @ vue-router.esm-bundler.js?6c02:2984
push @ vue-router.esm-bundler.js?6c02:2915
Object.onClick._cache.
Hope this can help you to start looking at it@peakcool Sorry i did modify the template in App.vue
<template>
<ion-app>
<ion-router-outlet />
<jeep-sqlite />
</ion-app>
</template>
@peakcool I have tried two full days without succeeding for both Vue and React . The error is in loading the wasm file which is working find for Angular and Stencil app. Any progress from your side?
rubickecho
commented
3 years ago @jepiqueau sorry， I have been busy with work lately, so there is no progress in the presentation
rubickecho
commented
3 years ago @jepiqueau hi, I did some tests
# init project, vue3 and ts
> vue create vue-capacitor-jeep-sqlite
> cd vue-capacitor-jeep-sqlite
> vue add typescript
# install capacitor
> yarn add @capacitor/core
> yarn add @capacitor/cli --save-dev
# install sqlite plugin
> yarn add @capacitor-community/sqlite@web
> yarn add jeep-sqlite@latestupdate App.vue
<template>
<img alt="Vue logo" src="./assets/logo.png">
<HelloWorld msg="Welcome to Your Vue.js + TypeScript App"/>
<jeep-sqlite />
</template>update main.ts
import { createApp } from 'vue'
import App from './App.vue'
import { defineCustomElements as jeepSqlite} from 'jeep-sqlite/loader';
jeepSqlite(window);
createApp(App).mount('#app')
update HelloWorld.vue
<template>
<div class="hello">
<h1>Hello World</h1>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import { dataToImport } from './import-json';
export default defineComponent({
setup() {
const initJeepSqlite = async () => {
await customElements.whenDefined('jeep-sqlite');
const jeepSqlite = document.querySelector('jeep-sqlite');
console.log('jeepSqlite:', jeepSqlite)
if (jeepSqlite) {
let result = await jeepSqlite.echo({ value: "Hello World from Jeep" });
console.log('result:', result)
if (await jeepSqlite.isStoreOpen()) {
try {
let jsonValidRes = await jeepSqlite.isJsonValid({ jsonstring: JSON.stringify(dataToImport)});
if (!jsonValidRes.result) throw new Error('import json error!')
let importRes = await jeepSqlite.importFromJson({ jsonstring: JSON.stringify(dataToImport) });
if (importRes.changes?.changes === -1) {
throw new Error('import from json fail!')
} else {
console.log('import from json success: %s', JSON.stringify(importRes));
}
await jeepSqlite.createConnection({
database: "test",
version: 1
})
const isDBOpen = await jeepSqlite.isDBOpen({ database: "test" });
console.log('isDBOpen: ', isDBOpen);
await jeepSqlite.open({ database: "test" });
let ret = await jeepSqlite.query({ database: "test", statement: "SELECT * FROM users;" });
console.log('test db query result: %s', JSON.stringify(ret));
} catch (error) {
console.log('error:', error);
}
}
} else {
console.log('jeepSqlite is null!!!');
}
}
initJeepSqlite();
},
})
</script>
public/assets
add sql-wasm.wasm file, and add databases/databases.json
{
"databaseList": ["test.db"]
}> npm run servethe end result is the same as you
# clone jeep-sqlite to local
> git clone https://github.com/jepiqueau/jeep-sqlite.git
> cd jeep-sqlite
> yarn
> npm run build# link local jeep-sqlite
> yarn add {MY_PROJECT_PATH}/jeep-sqlite
> npm run serveit's works, so I don't really understand the difference between the jeep-sqlite release and the local build
hope the above can help you
rubickecho
commented
3 years ago also, hope sencli sourceMap can help you troubleshoot problems, although it has not been officially released
jepiqueau
commented
3 years ago @peakcool I reproduced what you did by using the npm jeep-sqlite package or clone it and link the local and find the same results than you. I cannot figure out what are the differences with the two packages (npm and local). It may be something with the use of stencil
rubickecho
commented
3 years ago @jepiqueau yes, I also decided to build local because of stencil, but I did not find the reason after checking its changelog
jepiqueau
commented
3 years ago @peakcool if you take @capacitor-community/sqlite@3.2.0-5 it works i step back to sql.js@1.5.0 In the release 1.6.1 seems that there is an issue with the wasm file i will have to create an issue
jepiqueau
commented
3 years ago @G1dz @peakcool All this is now fixed in @capacitor-community/sqlite@3.2.0-5 and above so i close the issue
Is your feature request related to a problem? Please describe.
Hi, I am using Capacitor 3.0.1 in an app that I recently migrated from cordova. I noticed that capacitor 3 supports Android API level 21 and up. The version of this plugin that I'm using (version ^3.0.0-rc.1), only supports from API level 23 and up (androidx.security:security-crypto:1.0.0).
Describe the solution you'd like
I would like to be able to deploy my app to minimum API level 21 and still use capacitor 3 and this plugin. This will enable me to deliver updates to users on older devices.
Describe alternatives you've considered
I have considered reverting to cordova, but a critical feature that I require (copy from assets) is only available on this plugin from what I've researched.
Additional context
Thank you for your time and any feedback or direction will be greatly appreciated! Also sqlite is critical for my implementation as I need the performance.