㈠ 濡備綍鐢╓PS涓鐨凧S瀹忓嶅埗綺樿創涓嶅悓鐨勬暟鎹鍗曞唴瀹癸紵
瑕佸湪WPS涓浣跨敤js瀹忓嶅埗綺樿創涓嶅悓鐨勬暟鎹鍗曞唴瀹癸紝鍙浠ユ寜鐓т互涓嬫ラゆ搷浣滐細
鎵撳紑WPS錛岄夋嫨瑕佷嬌鐢ㄧ殑琛ㄦ牸鏂囨。銆
鍦ㄨ〃鏍兼枃妗d腑錛岄変腑浣犺佸嶅埗鐨勫崟鍏冩牸銆
鐐瑰嚮鈥滃紑鍙戔濋夐」鍗★紝鐒跺悗鐐瑰嚮鈥滃畯鈥濇寜閽錛岃繖浼氭墦寮涓涓鏂扮殑紿楀彛銆
鍦ㄦ柊紿楀彛涓錛岀偣鍑燴滄柊寤衡濇寜閽錛岃緭鍏ュ畯鐨勫悕縐幫紝鐒跺悗鐐瑰嚮鈥滃壋寤衡濄
鍦ㄥ脊鍑虹殑緙栬緫鍣ㄧ獥鍙d腑錛岃緭鍏ヤ互涓婮S浠g爜錛
鍦ㄨ繖孌典唬鐮佷腑錛屽皢 A1:A5 鏇挎崲涓轟綘瑕佸嶅埗鐨勫崟鍏冩牸鑼冨洿錛屽皢 B 鏇挎崲涓轟綘瑕佺矘璐寸殑鍗曞厓鏍煎垪鍙楓
鐐瑰嚮鈥滀繚瀛樷濇寜閽錛岀劧鍚庡叧闂緙栬緫鍣ㄧ獥鍙c
鍥炲埌琛ㄦ牸鏂囨。涓錛岄変腑涓涓絀虹殑鍗曞厓鏍礆紝鐒跺悗鐐瑰嚮鈥滃紑鍙戔濋夐」鍗′腑鐨勨滃畯鈥濇寜閽銆
鍦ㄥ脊鍑虹殑瀹忓垪琛ㄤ腑錛岄夋嫨鍒氬垰鍒涘緩鐨勫畯錛岀劧鍚庣偣鍑燴滆繍琛屸濄
榪欎細灝嗕綘鍦ㄧ 2 姝ヤ腑閫夋嫨鐨勫崟鍏冩牸澶嶅埗鍒頒綘鍦ㄧ 5 姝ヤ腑鎸囧畾鐨勫崟鍏冩牸涓銆
濡傛灉浣犳兂澶嶅埗涓嶅悓鐨勫崟鍏冩牸錛屽彧闇瑕佹洿鏀圭 5 姝ヤ腑鐨勪唬鐮佷腑鐨勫崟鍏冩牸鑼冨洿鍜岀矘璐村崟鍏冩牸鍒楀彿鍗沖彲銆
㈡ web前端開發需要學習什麼知識
首先對於Web前端初學者而言,HTML和CSS是需要掌握的內容。
HTML稱為超文本標記語言,是一回種標識性的語答言。HTML文本是由HTML命令組成的描述性文本,HTML命令可以說明文字,圖形、動畫、聲音、表格、鏈接等。
CSS層疊樣式表是一種用來表現HTML或XML等文件樣式的計算機語言。CSS不僅可以靜態地修飾網頁,還可以配合各種腳本語言動態地對網頁各元素進行格式化。
(2)c3js參數擴展閱讀:
例如,在網上商店中,用戶反復觀察和選擇商品,購買商品,瀏覽一系列網頁,收集所需信息,支付相應費用,最後下訂單,也可以是「軟體升級向導」,指導用戶完成下載和安裝新軟體的過程,也可以是基於Intranet的報價或銷售報告生成工具。
所有這些均不同於「標准」的Web網站。 常規網站使用一系列菜單或導航欄在預定路徑中漫遊該網站。 但是,成為Web應用程序不僅僅是下級控制的導航器。 在網站上自由漫遊時,可以進行無狀態和匿名訪問,但是通常不接受Web應用程序。
㈢ 微信內H5頁面打開手機APP功能,使用開放標簽
前言手機瀏覽器跳轉APP是可以用UrlScheme的,但是在微信打開的頁面中確不能使用UrlScheme,原因在於微信將UrlScheme功能給禁用了,那麼怎麼解決呢,微信雖然禁了該方式,但是給咱們開放了另外一種方式,也就是按照微信官方文檔的步驟來,畢竟是別人的地盤,咱只能照做,不過官方文檔寫的並不詳細,而且非常多的坑,稍不注意就掉進去了,這里我對該功能進行了總結,希望能幫助到大家。
實現的需求app分享到微信的H5卡片網頁(https的網頁),用戶打開該網頁後上方有一個打開APP的按鈕,如果手機已經安裝了APP,則直接打開APP,如果未安裝則跳轉到應用市場進行下載
實現原理利用微信提供的開放標簽wx-open-launch-app,來進行跳轉,通過該標簽還能夠得知當前手機是否安裝app,如果已安裝則打開app,未安裝則跳轉應用寶,在ios下應用寶會自動跳轉AppStore去,我們可以巧妙的利用這個功能。官方文檔-開放標簽說明
准備工作微信公眾號(已認證的服務號),拿到開發者ID(AppID)和開發者密碼(AppSecret),並設置IP白名單(計算簽名的伺服器IP)
該服務號必須綁定JS介面安全域名,也就是移動端H5頁面的域名
關聯移動應用(APP)的綁定關系,微信開放平台准備一個賬號,主體需要和微信公眾的服務號一致,並將服務號綁定在微信開放平台賬號下,並在開放平台內綁定app,並設置域名與所需跳轉的app,並拿到綁定的移動應用的AppID。關聯說明文檔
准備工作完成後應該拿到的3樣東西,不清楚的看準備工作章節開發者ID(AppID),開發者密碼(AppSecret)
移動應用關聯的APPID
開始開發app開發人員也需要提前接入SDK,才能使用,否則跳轉不生效,接入文檔,接入後可以分享頁面到微信,以卡片的形式展示(只有分享的頁面才能使用打開app功能,在微信內容通過點擊鏈接是不行的)
前後端開發流程說明
由於實現整個過程需要後端來計算一個簽名,所以需要先後端開發一個介面給前端,前端需要將當前頁面的url傳到後端參與簽名,後端將簽名信息返回給前端。具體請查看以下內容
後端開發工作簽名步驟
獲取access_token官方文檔
appid和secret參數就是開發者ID(AppID),開發者密碼(AppSecret)GET?https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET成功後會拿到access_token
{"access_token":"sdfad.....1561","expires_in":7200}獲取jsapi_ticket,用第一步拿到的access_token採用httpGET方式請求獲得jsapi_ticket(有效期2小時,後端需要對jsapi_ticket全局緩存,微信有請求次數限制)
GET?https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi成功後會得到ticket
{??"errcode":0,??"errmsg":"ok",??"ticket":"-",??"expires_in":7200}計算簽名,官方文檔
拼接參數
jsapi_ticket參數為上一個步驟拿到的ticket,noncestr為隨機字元串,timestamp為當前時間戳,url為當前前端頁面的URL地址(不包含#後面的字元,所以這里最好做成活的,讓前端傳過來),欄位名和欄位值都採用原始值,不進行URL轉義
jsapi_ticket=_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg&noncestr=Wm3WZYTPz0wzccnW×tamp=1414587457&url=http://mp.weixin.qq.com?params=value對拼接後的字元串進行sha1簽名,得到signature
將下面的參數返回給前端即可
{??appId:?'',?//?開發者ID(AppID)??timestamp:?,?//?生成簽名的時間戳??nonceStr:?'',?//?生成簽名的隨機字元串??signature:?'',//?sha1簽名}前端開發工作請求後端提供的介面獲取簽名
引入JS-SDK
<script?src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>通過SDK的config方法將請求後端得到的簽名信息傳入配置項
wx.config({??debug:?true,?//?開啟調試模式,調用的所有api的返回值會在客戶端alert出來,若要查看傳入的參數,可以在pc端打開,參數信息會通過log打出,僅在pc端時才會列印??appId:?'',?//?必填,公眾號的唯一標識??timestamp:?,?//?必填,生成簽名的時間戳??nonceStr:?'',?//?必填,生成簽名的隨機串??signature:?'',//?必填,簽名??jsApiList:?['checkJsApi'],?//?必填,需要使用的JS介面列表,沒有就隨便填一個??openTagList:?['wx-open-launch-app']?//必填,?要申請的開放標簽名稱})將調試模式打開,當在微信內打開分享的該H5頁面後,頁面彈出?ok?字樣就說明驗證成功了
在vue項目內使用開放標簽appid就是移動應用關聯的APPID,extinfo為需要傳遞給app的參數(僅支持字元串類型),launch事件為用戶點擊了跳轉app按鈕,error為跳轉app失敗事件
<wx-open-launch-app??appid="關聯的app應用id"?:extinfo="extinfo"?@launch="wxlaunchFn"?@error="wxerrorFn">??????<script?type="text/wxtag-template">???????????<style>.btn?{padding:?12px;}</style>?????????<p?class="btn">在APP內打開</button>??????</script></wx-open-launch-app>注意事項:只有在簽名,域名,都驗證成功後,開放標簽才會顯示,否則什麼都看不見
可以在打開失敗的事件下,做判斷,如果未安裝app,則跳轉應用市場讓用戶選擇下載安裝app
{"access_token":"sdfad.....1561","expires_in":7200}0其它補充只有在簽名,域名,都驗證成功後,開放標簽才會顯示,否則是看不見開放標簽按鈕的
開放標簽的樣式只能寫在裡面的style標簽內,寫在外面是不生效的
可以將開放標簽外面套一個div,然後div定位到需要的地方,用自己的按鈕顯示在那個位置,然後將開放標簽內的按鈕設置成透明,蓋在上面,這樣方便調試樣式(原理:用戶看見的是我們自己的按鈕,實際點擊到的是微信的開放標簽按鈕)
為了便於調試可以使用微信開發者工具-公眾網頁-下進行調試,調試時是需要將代碼放到JS安全域名下的伺服器上的,所以每修改代碼都要提交到伺服器,非常繁瑣,(可以通過配置host來實現本地調試,將安全域名映射到本地伺服器然後搭配微信開發者工具進行預覽調試)
注意,當公司有多個服務號的時候,容易搞混賬號這3個參數開發者ID(AppID),AppSecret,應用APPID,導致驗證失敗,這個特別注意
注意,如果有人刪了微信公眾號內的安全域名,剛刪除時簽名校驗也會提示Ok,但是但是點擊打開app是沒有反應的,所以如果代碼沒有改動而點擊打開app沒反應那麼首先去檢查安全域名是否被正確