主頁 > 前端設計 > Android-JNI開發系列《五》區域參考&全域參考&全域弱參考&快取策略

Android-JNI開發系列《五》區域參考&全域參考&全域弱參考&快取策略

2020-10-18 15:46:25 前端設計

人間觀察

好像什么都來得及，又好像什么都來不及，

本篇文章主要介紹在jni開發中常見的三種參考的使用方法和注意事項以及jni和java互動的快取策略，

我們知道Java是一門純面象物件的語言，除了基本資料型別外，其它任何型別所創建的物件的記憶體都存在堆空間中，記憶體由JVM 的GC(Garbage Collection)垃圾回收進行管理，

但是對于c，c++中以及用c/c++撰寫的jni來說同樣需要手動管理和處理記憶體，特別是參考型別的物件，malloc，realloc，free ，delete ，不像java有jvm對每個行程記憶體的限制，特別是Android移動端使用不當給你oom好不啦，而在c++/c只要你想要多大的來隨便搞（只要系統記憶體充足）但是需要釋放，各有各的優勢，

在jni中分為區域參考，全域參考，全域弱參考，個人認為有點類似于java中
區域參考，強參考，軟參考SoftReference，在使用介紹之前我們先看一下jni中的基本型別和參考型別有哪些以及對應關系，

jni資料型別

基本資料型別：

java與Native映射關系如下表所示:

Java型別Native 型別Description
booleanjbooleanunsigned 8 bits
bytejbytesigned 8 bits
charjcharunsigned 16 bits
shortjshortsigned 16 bits
intjint signed32 bits
long jlongsigned64 bits
floatjfloat32 bits
doublejdouble64 bits
voidvoidnot applicable

參考資料型別

外面的為jni中的，括號中的java中的，

  • jobject
    • jclass (java.lang.Class objects)
    • jstring (java.lang.String objects)
    • jarray (arrays)
      • jobjectArray (object arrays)
      • jbooleanArray (boolean arrays)
      • jbyteArray (byte arrays)
      • jcharArray (char arrays)
      • jshortArray (short arrays)
      • jintArray (int arrays)
      • jlongArray (long arrays)
      • jfloatArray (float arrays)
      • jdoubleArray (double arrays)
  • jthrowable (java.lang.Throwable objects)

上面的層次中的jni的參考型別代表了繼承關系，jbooleanArray繼承jarray，jarray集成jobject，最終都集成jobject，

區域參考

通過呼叫jni的一些方法比如FindClass，NewCharArray，NewStringUTF等只要是回傳上面介紹的jni的參考型別都屬于區域參考，區域參考的生命周期只在方法中效，不能垮執行緒跨方法使用，函式退出后區域參考所參考的物件會被JVM自動釋放，或顯示呼叫DeleteLocalRef釋放，區域參考的也可以通過(*env)->NewLocalRef(env,local_ref)方法創建，一般不常用，

如下示例：

// jni_ref.cpp
// 在jni中呼叫java String類構造回傳String
extern "C" JNIEXPORT jstring JNICALL
Java_com_bj_gxz_jniapp_ref_JNIRef_jnilocalRef(JNIEnv *env, jobject instance) {

    // 區域參考
    jclass local_j_cls = env->FindClass("java/lang/String");

    // 呼叫public String(char[] value); 構造方法， 為了演示更多的區域參考
    jmethodID j_mid = env->GetMethodID(local_j_cls, "<init>", "([C)V");
    // 區域參考
    jcharArray local_j_charArr = env->NewCharArray(8);
    // 區域參考
    jstring local_str = env->NewStringUTF("LocalRef");
    const jchar *j_char = env->GetStringChars(local_str, nullptr);

    env->SetCharArrayRegion(local_j_charArr, 0, 8, j_char);

    jstring j_str = (jstring) env->NewObject(local_j_cls, j_mid, local_j_charArr);

    // 釋放區域參考，也可以不用呼叫在方法結束后jvm會自動回收，最好有良好的編碼習慣
    env->DeleteLocalRef(local_j_cls);
    env->DeleteLocalRef(local_str);
    env->DeleteLocalRef(local_j_charArr);

    // 也可以通過NewLocalRef函式創建 (*env)->NewLocalRef(env,local_ref);這個方法一般很少用，
    // 函式回傳后區域參考所參考的物件會被JVM自動釋放，或呼叫DeleteLocalRef釋放，(*env)->DeleteLocalRef(env,local_ref)

    // ReleaseStringChars和GetStringChars對應
    env->ReleaseStringChars(j_str, j_char);

    return j_str;
}

例子中的local_j_cls，local_j_charArr，local_j_charArr，j_str 都是區域參考型別，最后呼叫了DeleteLocalRef來釋放，
有同學問了，既然區域參考不用手動釋放，可不可以不用呼叫DeleteLocalRef方法，
咦，你這個小可愛，好問題哦！
好問題哦

我網上搜索了下，大部分的文章說了下會有限制，超過512個區域參考（為什么是這個數字，一看就是一個有情懷的程式員）會造成區域參考表溢位，我還是想測驗一下如下

// jni_ref.cpp
    LOG_D("localRefOverflow start");
    for (int i = 0; i < count; i++) {
        jclass local_j_cls = env->FindClass("java/util/ArrayList");
        // env->DeleteLocalRef(local_j_cls);
    }
    LOG_D("localRefOverflow end");

count =513，沒有報錯，列印了localRefOverflow end

count =2000，沒有報錯，列印了localRefOverflow end

count =10000，沒有報錯，列印了localRefOverflow end

count =10 0000，沒有報錯，列印了localRefOverflow end

count =100 0000，沒有報錯，列印了localRefOverflow end
…

我靠，WTF? 直接for回圈900w次，例外出現了，

2020-10-16 18:05:11.476 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273] JNI ERROR (app bug): local reference table overflow (max=8388608)
2020-10-16 18:05:11.476 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273] local reference table dump:
2020-10-16 18:05:11.476 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]   Last 10 entries (of 8388608):
2020-10-16 18:05:11.476 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]     8388607: 0x706ca3a0 java.lang.Class<java.util.ArrayList>
2020-10-16 18:05:11.476 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]     8388606: 0x706ca3a0 java.lang.Class<java.util.ArrayList>
2020-10-16 18:05:11.476 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]     8388605: 0x706ca3a0 java.lang.Class<java.util.ArrayList>
2020-10-16 18:05:11.476 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]     8388604: 0x706ca3a0 java.lang.Class<java.util.ArrayList>
2020-10-16 18:05:11.476 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]     8388603: 0x706ca3a0 java.lang.Class<java.util.ArrayList>
2020-10-16 18:05:11.477 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]     8388602: 0x706ca3a0 java.lang.Class<java.util.ArrayList>
2020-10-16 18:05:11.477 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]     8388601: 0x706ca3a0 java.lang.Class<java.util.ArrayList>
2020-10-16 18:05:11.477 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]     8388600: 0x706ca3a0 java.lang.Class<java.util.ArrayList>
2020-10-16 18:05:11.477 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]     8388599: 0x706ca3a0 java.lang.Class<java.util.ArrayList>
2020-10-16 18:05:11.477 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]     8388598: 0x706ca3a0 java.lang.Class<java.util.ArrayList>
2020-10-16 18:05:11.477 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]   Summary:
2020-10-16 18:05:11.477 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]     8388604 of java.lang.Class (3 unique instances)
2020-10-16 18:05:11.477 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]         3 of java.lang.String (3 unique instances)
2020-10-16 18:05:11.477 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]         1 of java.lang.String[] (3 elements)
2020-10-16 18:05:11.477 26699-26699/com.bj.gxz.jniapp A/zygote: indirect_reference_table.cc:273]  Resizing failed: Requested size exceeds maximum: 16777216

8388608 ，可以猜測是不同的Android 版本導致，Android經常這樣不同的API或者功能在不同的版本上表現不一樣， 而我我用的Android 8.1的系統，為什么512沒有報錯了，
Android 8.0 之前區域參考表的上限是512個參考，Android 8.0后區域參考表上限提升到了8388608個參考，大家想一探究竟的話可以在如下Android 底層代碼中看一下，

需要翻墻
有關底層原始碼

看原始碼的同時我們也看到了比如FindClass 等方法，在最后方法的最后都有類似添加到區域參考表里的代碼，也就是說需要我們手動洗掉區域參考，

 static jclass FindClass(JNIEnv* env, const char* name) {
    CHECK_NON_NULL_ARGUMENT(name);
    Runtime* runtime = Runtime::Current();
    ClassLinker* class_linker = runtime->GetClassLinker();
    std::string descriptor(NormalizeJniClassDescriptor(name));
    ScopedObjectAccess soa(env);
    mirror::Class* c = nullptr;
    if (runtime->IsStarted()) {
      StackHandleScope<1> hs(soa.Self());
      Handle<mirror::ClassLoader> class_loader(hs.NewHandle(GetClassLoader(soa)));
      c = class_linker->FindClass(soa.Self(), descriptor.c_str(), class_loader);
    } else {
      c = class_linker->FindSystemClass(soa.Self(), descriptor.c_str());
    }
    return soa.AddLocalReference<jclass>(c);
  }

綜上可以看出并不是區域參考不用呼叫DeleteLocalRef來釋放，而是建議呼叫一下，如果你的jni方法很簡單&與java互動很少也可以不呼叫，但是如下的一些情況需要手動顯示的呼叫，為了防止記憶體溢位和區域參考表溢位，

  1. 如上我們模擬的情況，在for回圈里或者其它操作類似頻繁創建區域參考的需要釋放
  2. 遍歷陣列產生的區域參考，用完后要洗掉，

全域參考

通過呼叫jobject NewGlobalRef(jobject obj)基于參考來創建，引數是jobject型別，它可以跨方法、跨執行緒使用，JVM不會自動釋放它，必須顯示呼叫DeleteGlobalRef手動釋放void DeleteGlobalRef(jobject globalRef)

如下使用示例：
在jni中呼叫java String類構造回傳String

// jni_ref.cpp
static jclass g_j_cls;  // 加static前綴 只對本源檔案可見，對其它源檔案隱藏
extern "C" JNIEXPORT jstring JNICALL
Java_com_bj_gxz_jniapp_ref_JNIRef_jniGlobalRef(JNIEnv *env, jobject instance) {

    if (g_j_cls == nullptr) {
        jclass local_j_cls = env->FindClass("java/lang/String");
        // 將local_j_cls區域參考改為全域參考
        g_j_cls = (jclass) env->NewGlobalRef(local_j_cls);
    } else {
        LOG_D("g_j_cls else");
    }

    // 呼叫public String(String value); 構造
    jmethodID j_mid = env->GetMethodID(g_j_cls, "<init>", "(Ljava/lang/String;)V");

    jstring str = env->NewStringUTF("GlobalRef");
    jstring j_str = (jstring) env->NewObject(g_j_cls, j_mid, str);
    return j_str;
}

extern "C" JNIEXPORT void JNICALL
Java_com_bj_gxz_jniapp_ref_JNIRef_delGlobalRef(JNIEnv *env, jobject instance) {
    if (g_j_cls != nullptr) {
        LOG_D("DeleteGlobalRef");
        // 釋放某個全域參考
        env->DeleteGlobalRef(g_j_cls);
    }
}

java呼叫

    public native String jniGlobalRef();
    public native void delGlobalRef();
    
    String ret1 = jniRef.jniGlobalRef();
    Log.e(TAG, "jniGlobalRef=" + ret1);
    String ret2 = jniRef.jniGlobalRef();
    Log.e(TAG, "jniGlobalRef=" + ret2);
    jniRef.delGlobalRef();

g_j_cls就是一個全域參考，然后我們多次呼叫下jniRef.jniGlobalRef方法列印如下：

2020-10-16 20:30:46.074 29358-29358/com.bj.gxz.jniapp E/JNI: jniGlobalRef=GlobalRef
2020-10-16 20:30:46.074 29358-29358/com.bj.gxz.jniapp D/JNI: g_j_cls else
2020-10-16 20:30:46.074 29358-29358/com.bj.gxz.jniapp E/JNI: jniGlobalRef=GlobalRef
2020-10-16 20:30:46.074 29358-29358/com.bj.gxz.jniapp D/JNI: DeleteGlobalRef

說明全域參考可以起到快取的效果，為什么要做這個測驗呢？ 因為頻繁呼叫類似JNI介面FindClass查找java中Class參考時是比較耗性能的，特別是在有互動頻繁的JNI的app中，

弱全域參考

這個有點類似于java的軟參考SoftReference，jvm在記憶體不足的時候會釋放它，通過呼叫jweak NewWeakGlobalRef(jobject obj)來創建一個弱全域參考，釋放呼叫void DeleteWeakGlobalRef(jweak obj)，jweak為typedef _jobject* jweak;
_jobject指標的別名，

如下使用示例，和全域參考一樣把全域參考的方法改為弱全域參考的方法即可，

// jni_ref.cpp
static jclass g_w_j_cls;
extern "C" JNIEXPORT jstring JNICALL
Java_com_bj_gxz_jniapp_ref_JNIRef_jniWeakGlobalRef(JNIEnv *env, jobject instance) {

    if (g_w_j_cls == nullptr) {
        jclass local_j_cls = env->FindClass("java/lang/String");
        // 將local_j_clss區域參考改為弱全域參考
        g_w_j_cls = (jclass) env->NewWeakGlobalRef(local_j_cls);
    } else {
        LOG_D("g_w_j_cls else");
    }

    jmethodID j_mid = env->GetMethodID(g_w_j_cls, "<init>", "(Ljava/lang/String;)V");

    // 使用弱參考時，必須先檢查快取過的弱參考是指向活動的類物件，還是指向一個已經被GC的類物件
    // 檢查弱參考是否活動，即參考的比較IsSameObject
    // 如果g_w_j_cls指向的參考已經被回收，會回傳JNI_TRUE
    // 如果仍然指向一個活動物件，會回傳JNI_FALSE
    jboolean isGC = env->IsSameObject(g_w_j_cls, nullptr);
    if (isGC) {
        LOG_D("weak reference has been gc");
        return env->NewStringUTF("weak reference has been gc");
    } else {
        jstring str = env->NewStringUTF("WeakGlobalRef");
        jstring j_str = (jstring) env->NewObject(g_w_j_cls, j_mid, str);
        return j_str;
    }
}

extern "C" JNIEXPORT void JNICALL
Java_com_bj_gxz_jniapp_ref_JNIRef_delWeakGlobalRef(JNIEnv *env, jobject instance) {
    if (g_w_j_cls != nullptr) {
        // 呼叫DeleteWeakGlobalRef來釋放它，如果不手動呼叫這個函式來釋放所指向的物件，JVM仍會回收弱參考所指向的物件，但弱參考本身在參考表中所占的記憶體永遠也不會被回收，
        LOG_D("DeleteWeakGlobalRef");
        env->DeleteWeakGlobalRef(g_w_j_cls);
    }
}

java呼叫

        String ret3 = jniRef.jniWeakGlobalRef();
        Log.e(TAG, "jniWeakGlobalRef=" + ret3);
        String ret4 = jniRef.jniWeakGlobalRef();
        Log.e(TAG, "jniWeakGlobalRef=" + ret4);
        jniRef.delWeakGlobalRef();

g_w_j_cls就是一個弱全域參考，然后我們多次呼叫下jniRef.jniWeakGlobalRef方法列印如下：

2020-10-16 20:30:46.075 29358-29358/com.bj.gxz.jniapp E/JNI: jniWeakGlobalRef=WeakGlobalRef
2020-10-16 20:30:46.075 29358-29358/com.bj.gxz.jniapp D/JNI: g_w_j_cls else
2020-10-16 20:30:46.075 29358-29358/com.bj.gxz.jniapp E/JNI: jniWeakGlobalRef=WeakGlobalRef
2020-10-16 20:30:46.075 29358-29358/com.bj.gxz.jniapp D/JNI: DeleteWeakGlobalRef

和全域參考一樣可以起到快取的效果，
剛才我們說了就是弱全域參考在記憶體不足的時候會被jvm回收，怎么判斷它被回收了，判null ，沒錯！當被回收了會為null，所以我們在使用弱全域參考的時候頻道弱全域參考是否還存在，怎么判斷呢？使用參考比較 ，

參考比較

在jni中提供了 jboolean IsSameObject(jobject ref1, jobject ref2)方法，如果ref1和ref2指向同個物件則回傳JNI_TRUE，否則回傳JNI_FALSE，

    jclass local_j_cls_1 = env->FindClass("java/util/ArrayList");
    jclass local_j_cls_2 = env->FindClass("java/util/ArrayList");
    jboolean same1 = env->IsSameObject(local_j_cls_1, local_j_cls_2);
    LOG_D("%d",same1);
    jboolean same2= env->IsSameObject(local_j_cls_1, nullptr);
    LOG_D("%d",same2);

輸出 1和0

快取策略

當我們在本地代碼方法中通過FindClass查找Class、GetMethodID查找方法、GetFieldID獲取類的欄位ID和GetFieldValue獲取欄位的時候是需要jvm來做很多作業的，可能這個欄位ID或者方法是在超類中繼承而來的，那jvm可能還需要層次遍歷，而這些負責和jni互動java中的類的全路徑，欄位，方法一般是不會修改了，是固定的，這也是為什么我們在做android混淆打包的時候需要keep這些類，因為這些一般不會變，不能變，變了后jni中會找不到了具體的類，欄位，方法了，既然打包后不會變我們是可以進行快取策略來處理，

另外至于效率提高多少，沒有驗證，不過不重要，如果是頻繁這種查找一般會采用快取，只查找一次或者在程式初始化的時候提前查找，

對于這類情況的快取分為基本資料型別快取和參考快取，

基本資料型別快取

基本資料型別的快取在c，c++中可以借助關鍵字static處理，
學過c，c++的都知道

  1. static區域變數只初始化一次，下一次依據上一次結果值
  2. static全域變數只初使化一次，防止在其他檔案中被參考
  3. 加static函式的函式為內部函式，只能在本源檔案中使用， 和普通函式的作用域不同
static jclass g_j_cls_cache;
extern "C" JNIEXPORT jstring JNICALL
Java_com_bj_gxz_jniapp_ref_JNIRef_refCache(JNIEnv *env, jobject instance) {
    if (g_j_cls_cache == nullptr) {
        jclass local_j_cls = env->FindClass("java/lang/String");
        // 將local_j_cls區域參考改為全域參考
        g_j_cls_cache = (jclass) env->NewGlobalRef(local_j_cls);
    } else {
        LOG_D("g_j_cls_cache use cache");
    }

    // 呼叫public String(String value); 構造
    static jmethodID j_mid;
    if (j_mid == nullptr) {
        j_mid = env->GetMethodID(g_j_cls_cache, "<init>", "(Ljava/lang/String;)V");
    } else {
        LOG_D("j_mid use cache");
    }

    jstring str = env->NewStringUTF("refCache");
    jstring j_str = (jstring) env->NewObject(g_j_cls_cache, j_mid, str);
    return j_str;
}

java呼叫

        String ret5 = jniRef.refCache();
        Log.e(TAG, "refCache=" + ret5);
        String ret6 = jniRef.refCache();
        Log.e(TAG, "refCache=" + ret6);
        jniRef.delRefCache();

local_j_cls區域參考變為全域參考，j_mid變數改為static
輸出:

10-16 22:58:21.074 4469-4469/com.bj.gxz.jniapp E/JNI: refCache=refCache
10-16 22:58:21.074 4469-4469/com.bj.gxz.jniapp D/JNI: g_j_cls_cache use cache
10-16 22:58:21.074 4469-4469/com.bj.gxz.jniapp D/JNI: j_mid use cache
10-16 22:58:21.074 4469-4469/com.bj.gxz.jniapp E/JNI: refCache=refCache

有人問local_j_cls區域參考可以加static嗎？不用全域參考/全域弱應用？ 可以加static，但是不能起到快取的作用，因為上文說了區域參考在函式結束后會被jvm回收了，不然再次使用回到非法記憶體訪問導致應用crash，所以正確的做法如上用全域參考/全域弱應用，

參考型別的快取

可以借助上面的全域參考或者弱全域參考，弱全域參考記得在使用前判斷下是否被回收了IsSameObject，最后記得釋放 DeleteGlobalRef ,DeleteWeakGlobalRef，

最后源代碼：https://github.com/ta893115871/JNIAPP

轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/178209.html

標籤：其他

上一篇：Android將Jar放入libs目錄下編譯報錯

下一篇：安卓學習筆記14：安卓手勢操作編程

標籤雲
其他(157675) Python(38076) JavaScript(25376) Java(17977) C(15215) 區塊鏈(8255) C＃(7972) AI(7469) 爪哇(7425) MySQL(7132) html(6777) 基礎類(6313) sql(6102) 熊猫(6058) PHP(5869) 数组(5741) R(5409) Linux(5327) 反应(5209) 腳本語言(PerlPython)(5129) 非技術區(4971) Android(4554) 数据框(4311) css(4259) 节点.js(4032) C語言(3288) json(3245) 列表(3129) 扑(3119) C++語言(3117) 安卓(2998) 打字稿(2995) VBA(2789) Java相關(2746) 疑難問題(2699) 细绳(2522) 單片機工控(2479) iOS(2429) ASP.NET(2402) MongoDB(2323) 麻木的(2285) 正则表达式(2254) 字典(2211) 循环(2198) 迅速(2185) 擅长(2169) 镖(2155) 功能(1967) .NET技术(1958) Web開發(1951) python-3.x(1918) HtmlCss(1915) 弹簧靴(1913) C++(1909) xml(1889) PostgreSQL(1872) .NETCore(1853) 谷歌表格(1846) Unity3D(1843) for循环(1842)

熱門瀏覽
  • vue移動端上拉加載

    可能做得過于簡單或者比較low，請各位大佬留情，一起探討技術 ......

    uj5u.com 2020-09-10 04:38:07 more
  • 優美網站首頁，頂部多層導航

    一個個人用的瀏覽器首頁，可以把一下常用的網站放在這里，平常打開會比較方便。 第一步，HTML代碼 <script src=https://www.cnblogs.com/szharf/p/"js/jquery-3.4.1.min.js"></script> <div id="navigate"> <ul> <li class="labels labels_1"> ......

    uj5u.com 2020-09-10 04:38:47 more
  • 頁面為要加<!DOCTYPE html>

    最近因為寫一個js函式，需要用到$(window).height(); 由于手寫demo的時候，過于自信，其實對前端方面的認識也不夠體系，用文本檔案直接敲出來的html代碼，第一行沒有加上<!DOCTYPE html> 導致了$(window).height();的結果直接是整個document的高 ......

    uj5u.com 2020-09-10 04:38:52 more
  • WordPress網站程式手動升級要做好資料備份

    WordPress博客網站程式在進行升級前，必須要做好網站資料的備份，這個問題良家佐言是遇見過的；在剛開始接觸WordPress博客程式的時候，因為升級問題和博客網站的修改的一些嘗試，良家佐言是吃盡了苦頭。因為購買的是西部數碼的空間和域名，每當佐言把自己的WordPress博客網站搞到一塌糊涂的時候 ......

    uj5u.com 2020-09-10 04:39:30 more
  • WordPress程式不能升級為5.4.2版本的原因

    WordPress是一款個人博客系統，受到英文博客愛好者和中文博客愛好者的追捧，并逐步演化成一款內容管理系統軟體；它是使用PHP語言和MySQL資料庫開發的,用戶可以在支持PHP和MySQL資料庫的服務器上使用自己的博客。每一次WordPress程式的更新，就會牽動無數WordPress愛好者的心， ......

    uj5u.com 2020-09-10 04:39:49 more
  • 使用CSS3的偽元素進行首字母下沉和首行改變樣式

    網頁中常見的一種效果，首字改變樣式或者首行改變樣式，效果如下圖。 代碼： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ......

    uj5u.com 2020-09-10 04:40:09 more
  • 關于a標簽的講解

    什么是a標簽？ <a> 標簽定義超鏈接，用于從一個頁面鏈接到另一個頁面。 <a> 元素最重要的屬性是 href 屬性，它指定鏈接的目標。 a標簽的語法格式：<a href=https://www.cnblogs.com/summerxbc/p/"指定要跳轉的目標界面的鏈接">需要展示給用戶看見的內容</a> a標簽 在所有瀏覽器中，鏈接的默認外觀如下： 未被訪問的鏈接帶 ......

    uj5u.com 2020-09-10 04:40:11 more
  • 前端輪播圖

    在需要輪播的頁面是引入swiper.min.js和swiper.min.css swiper.min.js地址： 鏈接：https://pan.baidu.com/s/15Uh516YHa4CV3X-RyjEIWw 提取碼：4aks swiper.min.css地址 鏈接：https://pan.b ......

    uj5u.com 2020-09-10 04:40:13 more
  • 如何設定html中的背景圖片（全屏顯示，且不拉伸）

    1 <style>2 body{background-image:url(https://uploadbeta.com/api/pictures/random/?key=BingEverydayWallpaperPicture); 3 background-size:cover;background ......

    uj5u.com 2020-09-10 04:40:16 more
  • Java學習——HTML詳解（上）

    HTML詳解 初識HTML Hyper Text Markup Language（超文本標記語言） 1 <!--DOCTYPE:告訴瀏覽器我們要使用什么規范--> 2 <!DOCTYPE html> 3 <html lang="en"> 4 <head> 5 <!--meta 描述性的標簽，描述一些 ......

    uj5u.com 2020-09-10 04:40:33 more
最新发布
  • 我的第一個NPM包:panghu-planebattle-esm(胖虎飛機大戰)使用說明

    好家伙,我的包終于開發完啦 歡迎使用胖虎的飛機大戰包!! 為你的主頁添加色彩 這是一個有趣的網頁小游戲包,使用canvas和js開發 使用ES6模塊化開發 效果圖如下: (覺得圖片太sb的可以自己改) 代碼已開源!! Git: https://gitee.com/tang-and-han-dynas ......

    uj5u.com 2023-04-20 07:59:23 more
  • 生產事故-走近科學之消失的JWT

    入職多年，面對生產環境，盡管都是小心翼翼，慎之又慎，還是難免捅出簍子。輕則滿頭大汗，面紅耳赤。重則系統停擺，損失資金。每一個生產事故的背后，都是寶貴的經驗和教訓，都是專案成員的血淚史。為了更好地防范和遏制今后的各類事故，特開此專題，長期更新和記錄大大小小的各類事故。有些是親身經歷，有些是經人耳傳口授 ......

    uj5u.com 2023-04-18 07:55:04 more
  • 記錄--Canvas實作打飛字游戲

    這里給大家分享我在網上總結出來的一些知識，希望對大家有所幫助 打開游戲界面，看到一個畫面簡潔、卻又富有挑戰性的游戲。螢屏上，有一個白色的矩形框，里面不斷下落著各種單詞，而我需要迅速地輸入這些單詞。如果我輸入的單詞與螢屏上的單詞匹配，那么我就可以獲得得分；如果我輸入的單詞錯誤或者時間過長，那么我就會輸 ......

    uj5u.com 2023-04-04 08:35:30 more
  • 了解 HTTP 看這一篇就夠

    在學習網路之前，了解它的歷史能夠幫助我們明白為何它會發展為如今這個樣子，引發探究網路的興趣。下面的這張圖片就展示了“互聯網”誕生至今的發展歷程。 ......

    uj5u.com 2023-03-16 11:00:15 more
  • 藍牙-低功耗中心設備

    //11.開啟藍牙配接器 openBluetoothAdapter //21.開始搜索藍牙設備 startBluetoothDevicesDiscovery //31.開啟監聽搜索藍牙設備 onBluetoothDeviceFound //30.停止監聽搜索藍牙設備 offBluetoothDevi ......

    uj5u.com 2023-03-15 09:06:45 more
  • canvas畫板（滑鼠和觸摸）

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>canves</title> <style> #canvas { cursor:url(../images/pen.png),crosshair; } #canvasdiv{ bo ......

    uj5u.com 2023-02-15 08:56:31 more
  • 手機端H5 實作自定義拍照界面

    手機端 H5 實作自定義拍照界面也可以使用 MediaDevices API 和 <video> 標簽來實作，和在桌面端做法基本一致。 首先，使用 MediaDevices.getUserMedia() 方法獲取攝像頭媒體流，并將其傳遞給 <video> 標簽進行渲染。 接著，使用 HTML 的 < ......

    uj5u.com 2023-01-12 07:58:22 more
  • 記錄--短視頻滑動播放在 H5 下的實作

    這里給大家分享我在網上總結出來的一些知識，希望對大家有所幫助 短視頻已經無數不在了，但是主體還是使用 app 來承載的。本文講述 H5 如何實作 app 的視頻滑動體驗。 無聲勝有聲，一圖頂百辯，且看下圖： 網址鏈接（需在微信或者手Q中瀏覽） 從上圖可以看到，我們主要實作的功能也是本文要講解的有： ......

    uj5u.com 2023-01-04 07:29:05 more
  • 一文讀懂 HTTP/1 HTTP/2 HTTP/3

    從 1989 年萬維網（www）誕生，HTTP（HyperText Transfer Protocol）經歷了眾多版本迭代，WebSocket 也在期間萌芽。1991 年 HTTP0.9 被發明。1996 年出現了 HTTP1.0。2015 年 HTTP2 正式發布。2020 年 HTTP3 或能正... ......

    uj5u.com 2022-12-24 06:56:02 more
  • 【HTML基礎篇002】HTML之form表單超詳解

    ??一、form表單是什么

    ??二、form表單的屬性

    ??三、input中的各種Type屬性值

    ??四、標簽 ......

    uj5u.com 2022-12-18 07:17:06 more

Copyright © 2010-2020 有解無憂