codinux
/
fints4k
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Implemented retrieving and displaying account transactions in WebApp

This commit is contained in:
dankito 2022-02-17 01:19:37 +01:00
parent 179b7afbf2
commit 2788c0e686
6 changed files with 98 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -6,6 +6,7 @@ build/
out/
**/out
/captures
**/kotlin-js-store
.gradle

6
SampleApplications/WebApp/build.gradle
View File

@ -3,12 +3,6 @@ plugins {
}
repositories {
mavenCentral()
google()
}
dependencies {
implementation "org.jetbrains.kotlin:kotlin-stdlib-js"

56
SampleApplications/WebApp/src/main/kotlin/AccountTransactionsView.kt Normal file
View File

@ -0,0 +1,56 @@
import net.dankito.banking.fints.FinTsClientDeprecated
import net.dankito.banking.fints.model.AccountTransaction
import net.dankito.banking.fints.model.AddAccountParameter
import react.RBuilder
import react.RComponent
import react.Props
import react.State
import react.dom.*
import styled.styledDiv
external interface AccountTransactionsViewProps : Props {
var client: FinTsClientDeprecated
}
data class AccountTransactionsViewState(val balance: String, val transactions: Collection<AccountTransaction>) : State
@JsExport
class AccountTransactionsView(props: AccountTransactionsViewProps) : RComponent<AccountTransactionsViewProps, AccountTransactionsViewState>(props) {
init {
state = AccountTransactionsViewState("", listOf())
// due to CORS your bank's servers can not be requested directly from browser -> set a CORS proxy url in main.kt
// TODO: set your credentials here
props.client.addAccountAsync(AddAccountParameter("", "", "", "")) { response ->
if (response.successful) {
val balance = response.retrievedData.sumOf { it.balance?.amount?.string?.replace(',', '.')?.toDoubleOrNull() ?: 0.0 } // i know, double is not an appropriate data type for amounts
setState(AccountTransactionsViewState(balance.toString() + " " + (response.retrievedData.firstOrNull()?.balance?.currency ?: ""), response.retrievedData.flatMap { it.bookedTransactions }))
}
}
}
override fun RBuilder.render() {
p {
+"Saldo: ${state.balance}"
}
div {
state.transactions.forEach { transaction ->
div {
styledDiv {
if (transaction.showOtherPartyName) {
div { transaction.otherPartyName }
}
div {
+transaction.reference
}
}
}
}
}
}
}

17
SampleApplications/WebApp/src/main/kotlin/main.kt
View File

@ -1,5 +1,20 @@
import kotlinx.browser.document
import kotlinx.browser.window
import net.dankito.banking.fints.FinTsClientDeprecated
import net.dankito.banking.fints.callback.SimpleFinTsClientCallback
import net.dankito.banking.fints.webclient.KtorWebClient
import net.dankito.banking.fints.webclient.ProxyingWebClient
import react.dom.render
fun main() {
document.write("Hello, world!")
window.onload = {
render(document.getElementById("root")!!) {
child(AccountTransactionsView::class) {
attrs {
// to circumvent CORS we have to use a CORS proxy like https://github.com/Rob--W/cors-anywhere. Set CORS proxy's URL here
client = FinTsClientDeprecated(SimpleFinTsClientCallback(), ProxyingWebClient("http://localhost:8082/", KtorWebClient()))
}
}
}
}
}

16
SampleApplications/WebApp/src/main/resources/index.html
View File

@ -1,11 +1,11 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>fints4k WebApp</title>
<script src="WebApp.js"></script>
</head>
<body>
</body>
<head>
<meta charset="UTF-8">
<title>fints4k WebApp</title>
<script src="WebApp.js"></script>
</head>
<body>
<div id="root"></div>
</body>
</html>

17
fints4k/src/commonMain/kotlin/net/dankito/banking/fints/webclient/ProxyingWebClient.kt Normal file
View File

@ -0,0 +1,17 @@
package net.dankito.banking.fints.webclient
/**
* In browsers we cannot request bank servers directly due to CORS. So this 'WebClient' prepends each server url with CORS proxy's url and delegates then the
* call to a real IWebClient implementation.
*/
class ProxyingWebClient(proxyUrl: String, private val delegate: IWebClient) : IWebClient {
private val proxyUrl = if (proxyUrl.endsWith("/")) proxyUrl else proxyUrl + "/"
override fun post(url: String, body: String, contentType: String, userAgent: String, callback: (WebClientResponse) -> Unit) {
delegate.post(proxyUrl + url, body, contentType, userAgent, callback)
}
}