다리를 건설하십시오! Android와 WebApps 간의 원활한 통합
Simpleindroidbridge 라이브러리를 사용하여 Android와 WebApp 사이에 강력한 브리지를 쉽게 구축하십시오. 이 라이브러리를 사용하면 Android WebView에서 웹 응용 프로그램을 렌더링하고 JSINterface를 만들어 두 플랫폼간에 원활한 통신을 가능하게합니다. 웹 애플리케이션은 반응적이고 효율적으로 유지되는 동안 복잡한 개체, 약속 및 콜백 기능을 공유하십시오.
✓ 개체 공유 -Android ⇄ 웹
✓ 약속 공유 - Android ⇄ 웹
✓ 콜백 기능 -Android ← 웹
✓ 호출 기능 비 블로킹 - Android ⇄ 웹
✓ TypeScript -Android + Web을 사용하여 안전을 입력하십시오
Android SDK의 내장 JavaScript 브리지는 원시 유형 만 지원합니다. SimpleanDroidbridge를 사용하면 Android와 웹 사이의 복잡한 객체를 쉽게 공유 할 수 있습니다. 안드로이드 기본 기능에서 유형을 인수 또는 반환 값으로 정의하면 라이브러리는 자바 스크립트 객체를 Kotlin 객체로 자동 변환하고 그 반대도 마찬가지입니다.
// Kotlin
class AndroidNativeInterface ( val contactService : ContactService ): DefaultJSInterface( " Android " ) {
@NativeCall( CallType . FULL_SYNC )
fun searchContact ( contactFilter : ContactFilter ): List < Contact > {
return contactService.search(contactFilter)
}
}
data class ContactFilter ( val surname : String? = null , val firstname : String? = null )
data class Contact ( val surname : String? = null , val fistname : String? = null ,
val mail : String? = null , val phonenumber : String? = null ) // Javascript
console . log ( Bridge . interfaces . Android . searchContact ( { surname : "Pitt" } ) )Android SDK의 JavaScript Bridge는 차단 방식으로 함수를 실행하여 기본 기능이 반환 될 때까지 웹 응용 프로그램이 동결됩니다. 그러나이 라이브러리를 사용하면 약속 반환 유형을 정의하여 블로킹을 실행할 수 있습니다. 'doinbackgroun
// Kotlin
class AndroidNativeInterface ( val contactService : ContactService ): DefaultJSInterface( " Android " ) {
@NativeCall( CallType . FULL_PROMISE )
fun searchContact ( contactFilter : ContactFilter ) = doInBackground< List < Contact >> { promise ->
try {
promise.resolve(contactService.search(contactFilter))
} catch (e : Exception ) {
promise.reject(e)
}
}
}
data class ContactFilter ( val surname : String? = null , val firstname : String? = null )
data class Contact ( val surname : String? = null , val fistname : String? = null ,
val mail : String? = null , val phonenumber : String? = null ) // Javascript
Bridge . interfaces . Android . searchContact ( { surname : "Pitt" } ) . then ( ( list ) => {
console . log ( list ) ;
} ) ;JavaScript에 익숙하다면 콜백 기능에 익숙하지 않을 것입니다. SimpleanDroidbridge는이 개념을 한 단계 더 발전시켜 이러한 JavaScript 콜백 기능을 Android 계층에 직접 주입하여 웹 애플리케이션과 Android 사이의 원활한 상호 작용을 만듭니다.
// Kotlin
class AndroidNativeInterface ( val button : Button ): DefaultJSInterface( " Android " ) {
@NativeCall( CallType . FULL_SYNC )
fun registerOnClickAction ( jsFunction : JSFunction ) {
button.setOnClickListener { jsFunction() }
}
} // Javascript
Bridge . interfaces . Android . registerOnClickAction ( ( ) => {
console . log ( "Button Clicked!" )
} ) 인수를 JavaScript 함수에 전달하려면 인수를 받아들이도록 특별히 설계된 JSFunctionWithArg 유형을 사용하십시오.
// Kotlin
class AndroidNativeInterface ( val button : Button ): DefaultJSInterface( " Android " ) {
var i = 0
@NativeCall( CallType . FULL_SYNC )
fun registerOnClickAction ( jsFunction : JSFunctionWithArg < Int >) {
button.setOnClickListener { jsFunction( ++ i) }
}
} // Javascript
Bridge . interfaces . Android . registerOnClickAction ( ( i ) => {
console . log ( "Button Clicked! " + i )
} )여러 인수를 함수에 전달하려면 데이터 클래스 생성을 고려하십시오.
결과를 Android 계층에 반환 해야하는 함수의 경우 인수가없는 기능에 대한 JSFunctionWithPromise 사용하여 인수를 수락하는 기능에 대해 JSFunctionWithPromiseAndArg 사용할 수 있습니다.
// Kotlin
class AndroidNativeInterface ( val button : Button ): DefaultJSInterface( " Android " ) {
@NativeCall( CallType . FULL_SYNC )
fun registerOnClickAction ( jsFunction : JSFunctionWithPromiseAndArg < Add , Int >) {
button.setOnClickListener {
val add = Add (( Math .random() * 10 ).toInt(), ( Math .random() * 10 ).toInt())
jsFunction(add)
.then{ Log .d( " AndroidNativeInterface " , " Web calculated: ${add.a} + ${add.b} = $it " ) }
. catch { Log .e( " AndroidNativeInterface " , " ERROR IN WEB LAYER: $it " ) }
}
}
data class Add ( a : Int , b : Int )
} // Javascript
Bridge . interfaces . Android . registerOnClickAction ( ( add ) => {
return new Promise ( ( resolve ) => { resolve ( add . a + add . b ) } )
} )메모
JSFunction 해제하고 바인딩을 지우려면 close 기능을 호출하십시오. JSFunction AutoCloseable 인터페이스를 구현하여 시도 with-resources 또는 AutoCloseable.use {} 블록을 사용하여 기능의 수명주기를 자동으로 관리하고 올바른 정리를 보장 할 수 있습니다.
function.use { it() } 또한 웹 응용 프로그램 또는 WebView가 재 장전을 지원하는 경우 Bridge에 AfterInitializEListener를 추가하는 것이 좋습니다. 이 리스너는 사용 가능한 JSFunctions 해제하여 초기화 후 깨끗한 상태를 보장합니다.
이 라이브러리는 기본 코드를 호출하는 방법을 결정할 수있는 다양한 기본 통화 유형을 지원합니다.
CallType.FULL_SYNC 호출 유형은 차단 방식으로 기본 코드를 호출하여 기본 Android 기능이 반환 될 때까지 JavaScript 실행이 일시 중지됩니다. 결과적으로, 기본 실행이 완료 될 때까지 웹 뷰는 반응하지 않습니다. (장기 실행 작업에 권장되지 않음)
// Kotlin
@NativeCall( CallType . FULL_SYNC )
fun searchContact ( contactFilter : ContactFilter ): List < Contact > {
return contactService.search(contactFilter)
} // Javascript
console . log ( Bridge . interfaces . Android . searchContact ( { surname : "Pitt" } ) ) CallType.WEB_PROMISE 통화 유형은 FULL_SYNC 호출과 유사하게 기능하며, 핵심 차이는 JavaScript Call이 약속을 반환한다는 것입니다. 그러나 기본 Android 기능은 여전히 차단 방식으로 호출됩니다. (작업 기간에 대해 불확실하고 향후 FULL_PROMISE 로 마이그레이션 해야하는 경우 권장).
// Kotlin
@NativeCall( CallType . WEB_PROMISE )
fun searchContact ( contactFilter : ContactFilter ): List < Contact > {
return contactService.search(contactFilter)
} // Javascript
Bridge . interfaces . Android . searchContact ( { surname : "Pitt" } ) . then ( ( list ) => {
console . log ( list ) ;
} ) ; CallType.FULL_PROMISE 통화 유형을 사용하면 백그라운드 스레드에서 기본 Android 코드를 실행할 수 있으므로 JavaScript 실행이 중단되지 않도록 계속할 수 있습니다. 결과적으로 웹보기는 반응이 좋으며 해당 작업을 자유롭게 수행 할 수 있습니다. (장기 실행 작업에 권장)
// Kotlin
@NativeCall( CallType . FULL_PROMISE )
fun searchContact ( contactFilter : ContactFilter ) = doInBackground< List < Contact >> { promise ->
try {
promise.resolve(contactService.search(contactFilter))
} catch (e : Exception ) {
promise.reject(e)
}
} // Javascript
Bridge . interfaces . Android . searchContact ( { surname : "Pitt" } ) . then ( ( list ) => {
console . log ( list ) ;
} ) ; 리포지토리 블록에 Maven 중심을 추가하십시오.
repositories {
google()
mavenCentral()
}라이브러리를 종속성 블록에 추가하십시오.
dependencies {
implementation ' com.github.andycandy-de:simple-android-bridge:1.1.1 '
} class AndroidNativeInterface : DefaultJSInterface ( " Android " ) {
@NativeCall( CallType . FULL_SYNC )
fun helloFullSync ( name : String ): String {
return " hello $name "
}
@NativeCall( CallType . WEB_PROMISE )
fun helloWebPromise ( name : String ): String {
return " hello $name "
}
@NativeCall( CallType . FULL_PROMISE )
fun helloFullPromise ( name : String ) = doInBackground< String > { promise ->
promise.resolve( " hello $name " )
}
} val bridge = Bridge (applicationContext, webView)
bridge.addJSInterface( AndroidNativeInterface ())안드로이드 코드
// Bridge can be initialized by calling the 'init' function inside
// the 'onPageStarted' function of a WebViewClient
webView.webViewClient = object : WebViewClient () {
override fun onPageStarted ( view : WebView ? , url : String? , favicon : Bitmap ? ) {
bridge. init ()
}
}자바 스크립트 코드
// Bridge can be initialized by calling the 'init' function in
// Javascript. Register function to 'Bridge.afterInitialize' to
// start the webapp after the bridge is initialized.
function startApp ( f ) {
if ( Bridge . initialized ) {
f ( )
} else {
Bridge . afterInitialize = f
}
}
Bridge . init ( )
startApp ( ( ) => {
// Start your webapp
} ) ; console . log ( Bridge . interfaces . Android . helloFullSync ( "Web" ) ) MIT 라이센스
저작권 (c) 2020 Andycandy-de
저작권 (c) 2021 Andycandy-de
저작권 (c) 2024 Andycandy-de
이에 따라이 소프트웨어 및 관련 문서 파일 ( "소프트웨어")의 사본을 얻는 사람에게는 허가가 부여됩니다. 소프트웨어의 사용, 복사, 수정, 합병, 배포, 배포, 숭고 및/또는 소프트웨어의 사본을 판매 할 권한을 포함하여 제한없이 소프트웨어를 처리 할 수 있도록 소프트웨어를 제공 할 권한이 없습니다.
위의 저작권 통지 및이 권한 통지는 소프트웨어의 모든 사본 또는 실질적인 부분에 포함되어야합니다.
이 소프트웨어는 상업성, 특정 목적에 대한 적합성 및 비 침해에 대한 보증을 포함하여 명시 적 또는 묵시적 보증없이 "그대로"제공됩니다. 어떠한 경우에도 저자 또는 저작권 보유자는 계약, 불법 행위 또는 기타, 소프트웨어 또는 소프트웨어의 사용 또는 기타 거래에서 발생하는 계약, 불법 행위 또는 기타의 행동에 관계없이 청구, 손해 또는 기타 책임에 대해 책임을지지 않아야합니다.