フロントエンド_ウィーチャットウィジェット

ウィーチャットウィジェット
ウィジェットウィジェットには、全体のプログラムを記述するappと、それぞれのページを記述する複数のpageが含まれ、ルートディレクトリにはappが含まれる.js(必須)、project.config,json(必須)、app.json(必須).app.wxss(必須ではない).各ページには4つのファイルが含まれています:index.js(ページロジック、必須)、index.wxml(ページ構造、必須)、index.json(ページ構成、必須ではない).index.wxss(ページスタイルシート、必須ではありません)

WXML:      ,    ,  ,       .   wxml         id,class,style,hidden,data,bind/catch
WXSS:rpx      ，@import url('.//.a.wxss')      。  .class #id element ：after ：before
JSON:      ,    .  : { "pages": [], "window": {}},   JSON       
app.json(       )          ,           ,    ,      ,  tab 。
JavaScript：ECMAScriptScript（  +  +  +   +   +  ）+     +   API

ウィジェットのホスト環境:論理層(JS)とレンダリング層(WXML+WXSS)に分けられ,ページはコンポーネント,API,イベント,互換性で構成される.小プログラムのAPI:ホスト環境は豊富なAPIを提供し、すべてのAPIはwxオブジェクトの下に掛けられている(Page/APPなどの特殊なプロセッサを除く).

 wx.set*   API             。
 wx.get*   API             。
              HTTPS     。
       ：success    fail    complete            
         ：Flex                           
 

微信ログイン:wx.loginは時効性のある証明書を生成し、codeをサーバーに送信し、微信サーバーに行って微信ユーザーIDを取得し、微信ユーザーIDと業務ユーザーIDをバインドし、業務登録証明書はSessionIdに戻る
パケットロードは、小プログラムのパケットサイズに制限があり、小プログラム全体のパケットは8 Mを超えず、単一のパケット/メインパケットは2 Mを超えてはならない.プロジェクトにはメインパッケージがあり、デフォルトの起動ページ/TabBarページを配置し、いくつかの基礎構成を配置します.フロントエンドのHybridソリューションでは、レンダリングスレッドとスクリプトスレッド(論理層)が別々であり、環境にはIOSとAndroidの微信クライアント、開発者ツールが含まれている.欠点:購読できない、モーメンツを転送できない、自分からメッセージをプッシュできない.検索には限界があり、検索を曖昧にすることはできない.
論理レイヤ(App Service)

    --         ,  JavaScript        JavaScriptd                   ( :  APPh Page  ),                        .
    --API
    --   
    --  
    --    
    --        

ビューレイヤ:WXMLとWXSSとWXSとコンポーネントの展示のため、コンポーネントによって展示され、主な役割は論理レイヤのデータをビューに反応させ、同時にビューレイヤのイベントを論理レイヤに送信することである.イベント:touchstart touchmove touchcancel touchend tap longpress longtapホスト環境:ウィジェットの実行環境は、レンダリング層(WXMLとWXSS)と論理層(JavaScript)の2つのスレッドに分けて管理され、レンダリング層のインタフェースはWebViewを使用してレンダリングを継続し、論理層はJCOreスレッドを使用してスクリプトを実行する.ウィジェットには複数のページがあり、WebVIewスレッドも複数あります.すべてのスレッドの通信は、微信クライアントを介して中継する.すべてのページのスクリプトロジックは同じJsCoreスレッドを走り、ページはsettimeoutまたはsetIntervalのタイマを使用し、他のページをジャンプしたとき、これらのタイマは除去されなかった.
共有ウィジェット
関連ページのjs、onShareAppMessageの追加

  onShareAppMessage() {
  return {
    title: 'titlename',
    path: '/pages/index'
       }
   }

WebPy初期化プロジェクト:

$npm install wepy-cli -g
$npm install -g wepy-cli
$wepy init standard my-project

ディレクトリに切り替え、依存関係をインストールし、リアルタイムコンパイルを開始

$cd myproject
$npm  install
$wepy build --watch

WebPYプロジェクトのディレクトリ構造:

├── dist                            （    WePY build        ，              ）
├── node_modules           
├── src                           （      WePY      ）
|   ├── components         WePY    （         ，             ）
|   |   ├── com_a.wpy          WePY  a
|   |   └── com_b.wpy          WePY  b
|   ├── pages              WePY    （      ）
|   |   ├── index.wpy      index  （ build ，  dist    pages    index.js、index.json、index.wxml  index.wxss  ）       
|   |   └── other.wpy      other  （ build ，  dist    pages    other.js、other.json、other.wxml other.wxss  ）            
|   └── app.wpy                  （    、  、     ； build ，  dist     app.js、app.json app.wxss  ）     
└── package.json              package  

パケットロード
パケットロードの小プログラムは、オンデマンドロードを行い、必ず1つのメインパケット(デフォルトの起動ページ/TabBarページを配置し、すべてのパケットが使用する必要がある公共資源/Jsスクリプト)を含み、パケットは開発者の配置によって区分される.パケットには以下の制限がある:全体の小プログラムのすべてのパケットは8 Mを超えず、単一のパケット/メインパケットのサイズは2 Mを超えてはならない.
ビューレイヤ
フレームワークのビューはWXMLとWXSSによって作成され、コンポーネントによって作成され、論理層のデータをビューに反応させながら、ビューレイヤのイベントを論理層に送信する