成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

ionic 旅途-- 一起來(lái)填坑

qieangel2013 / 2826人閱讀

摘要：在中巧用解決跳轉(zhuǎn)到第三方平臺(tái)時(shí)不能回調(diào)的問(wèn)題比如支付在開發(fā)中遇到不少的坑，絕大部分解決了但是在我們的中如果跳轉(zhuǎn)到第三方網(wǎng)站上時(shí)，那么問(wèn)題來(lái)了此時(shí)我們的是不能監(jiān)聽到你在其它網(wǎng)站上的事件的，所以當(dāng)你想要回退到我們自己上時(shí)請(qǐng)緊握你的蛋小編在開發(fā)這

在ionic中巧用iframe解決跳轉(zhuǎn)到第三方平臺(tái)時(shí)不能回調(diào)的問(wèn)題－比如支付

在ionic開發(fā)中遇到不少的坑，絕大部分解決了但是在我們的app中如果跳轉(zhuǎn)到第三方網(wǎng)站上時(shí)，那么問(wèn)題來(lái)了．此時(shí)我們的app是不能監(jiān)聽到你在其它網(wǎng)站上的事件的，所以當(dāng)你想要回退到我們自己app上時(shí),請(qǐng)緊握你的蛋,小編在開發(fā)這個(gè)模塊時(shí)就遇到了很大的麻煩想盡各種辦法還是不能解決,下面我就跟大家討論下我在ionic中遇到的問(wèn)題:

在開發(fā)一款機(jī)票砍價(jià)的ionic app中用戶可以選擇去攜程訂票,這個(gè)時(shí)候問(wèn)題來(lái)了因?yàn)槲冶O(jiān)聽了android的back的事件,而且這個(gè)事件是cordovaJS調(diào)用了原生的事件來(lái)進(jìn)行處理的.代碼如下:

javascript$ionicPlatform.registerBackButtonAction(function (e) {
    e.preventDefault();
    ......
    ......
    return false;
}, 101);

但是當(dāng)我跳轉(zhuǎn)到攜程的時(shí)候,這個(gè)監(jiān)聽函數(shù)是不會(huì)起作用的,所以我就凌亂........,當(dāng)用戶要返回到我的App時(shí)要不停的按手機(jī)的返回鍵,這個(gè)時(shí)候就相對(duì)于瀏覽器的后退一樣了,這個(gè)時(shí)候就會(huì)出現(xiàn)一個(gè)不好的表現(xiàn)了,回退的功能會(huì)把你瀏覽過(guò)的route全部重新訪問(wèn)一邊之后才會(huì)退出我們的應(yīng)用,如果沒有使用上面的registerBackButtonAction的話,這是在android上,至少是可以回退,但是在ios上呢?這個(gè)就會(huì)很逆天了,會(huì)被別人罵的要死......
2. 另一個(gè)問(wèn)題是:用戶支付的時(shí)候,我們?yōu)榱朔奖闶褂昧司W(wǎng)頁(yè)版的支付方式,同樣的問(wèn)題同樣的味道,雖然可以自己寫cordva的插件.但是畢竟這個(gè)還是比較費(fèi)時(shí)間的,如果小伙伴需要這樣的功能我推薦大家用這個(gè): https://github.com/TongChia/cordova-plugin-pingpp

最后的最后實(shí)在是沒辦法了......
想到了用iframe現(xiàn)在才想到,唉~

不瞎扯分享下我的經(jīng)驗(yàn):

首先使用$ionicModal創(chuàng)建一個(gè)彈出層可以覆蓋整個(gè)頁(yè)面,具體就看大家的業(yè)務(wù)需求了
在modal中加入如下的代碼:


    
        

            
        

        
支付寶

注意下我們需要配置ion-content的scroll="true" class="has-header no-padding" 和iframe的data-tap-disabled="true"
這里就是可以解決用戶不能操作iframe里面的東西

其中如果想要?jiǎng)討B(tài)的改變iframe的src一定要用ng-src="{{vm.paySrc}}"但是這里就需要注意了,如果你的vm.paySrc是普通的鏈接是不能訪問(wèn)的,因?yàn)锳ngularjs 中防止了用戶注入U(xiǎn)RL,所以解決辦法是使用 $sce.trustAsResourceUrl(URL)

vm.paySrc =  $sce.trustAsResourceUrl("http://www.baidu.com/"); //URL 為全鏈接（$sce.trustAsResourceUrl("http://" + url)）

最后就是添加css了:

.scroll-content > .scroll {
    height: 100%;
}
.scroll-content > .scroll > iframe {
    min-width: 100%;
    min-height: 100%;
}

好了基本上就是這樣了其它的細(xì)節(jié)大家去優(yōu)化吧!這里是參考的資料:

https://github.com/driftyco/ionic/issues/1151

http://forum.ionicframework.com/t/fill-content-container/605

http://www.erpchn.com/diannao/43242.html

http://www.thinksaas.cn/group/topic/350702/

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/85796.html

相關(guān)文章

  • IONIC 云端打包（在線編譯）

    摘要：為什么要在線打包本身是基于，的打包又依賴于等等。在編譯環(huán)境配置的道路上一路填坑屢戰(zhàn)屢敗之后，遂尋求其他出路。國(guó)內(nèi)的跨平臺(tái)開發(fā)解決方案等都提供云端打包的服務(wù)，不用配置本地編譯環(huán)境，就了一下是否有提供云打包的服務(wù)。 為什么要在線打包 Ionic本身是基于Cordova，Cordova的app打包又依賴于XCODE、ANDROID SDK、Gradle、Maven等等。在Android編譯環(huán)...

    garfileo 評(píng)論0 收藏0

  • 從 Ionic1 遷移至 Ionic2 基本說(shuō)明

    摘要：遷移概念是基于之上重寫的全新框架。從遷移雖然應(yīng)用需要對(duì)其語(yǔ)法結(jié)構(gòu)進(jìn)行更新，但是開發(fā)人員仍然可以通過(guò)和這兩篇文章來(lái)積極的確保升級(jí)工作符合最佳的應(yīng)用實(shí)踐。這可以很容易的讓一個(gè)的控制器遷移為一個(gè)的類。 遷移概念 Ionic 2 是基于 Angular 2 之上重寫的全新框架。所有你已知的關(guān)于的 Angular 的部分仍然存在，但是也有一些作為開發(fā)人員仍要了解的新的語(yǔ)法和結(jié)構(gòu)性變化。關(guān)于 An...

    shevy 評(píng)論0 收藏0

  • ionic2實(shí)現(xiàn)透明狀態(tài)欄和透明工具欄

    摘要：抽時(shí)間寫了個(gè)，你想要的都在這里了。你可以狠狠的點(diǎn)擊下面的鏈接去往倉(cāng)庫(kù)地址，一探究竟。你可以直接下來(lái)，直接運(yùn)行。 ionic2實(shí)現(xiàn)透明狀態(tài)欄和透明工具欄 目錄 如何實(shí)現(xiàn)？ 集成DEMO（2017/4/1更新） 簡(jiǎn)短的分析 一個(gè)額外的小栗子 我想讓狀態(tài)欄變色怎么辦？ 為什么這么做？ 總結(jié) 以下是我的方案，不繞彎子，直接上實(shí)現(xiàn)過(guò)程．首先貼效果圖，來(lái)張gif（2017/4/1更新）show...

    wenshi11019 評(píng)論0 收藏0

  • [11.11]匯總信息：VPS-BID/旅途云/智貿(mào)云/A400/Themebetter

    摘要：目前，旅途云公司研發(fā)以及運(yùn)營(yíng)云服務(wù)基礎(chǔ)設(shè)施服務(wù)平臺(tái)，面向全球客戶提供基于云計(jì)算的解決方案與客戶服務(wù)，擁有豐富的國(guó)內(nèi)雙線高防香港等優(yōu)質(zhì)的資源。? 一年一度的雙十一電商大促已經(jīng)開始，部分IDC商家也發(fā)布了自己的特別產(chǎn)品或者優(yōu)惠方案，部落陸續(xù)收到一些商家郵件，部分是首次出現(xiàn)在這里，為了方便大家查閱，所以做個(gè)匯總信息，大部分信息源于商家自述，讀者請(qǐng)自行甄別，排名不分先后，以郵件順序，后續(xù)如有增...

    lidashuang 評(píng)論0 收藏0

  • 旅途云：四川雅安/宿遷高防vps,4核/4G/50G硬盤/10Mbps不限流量/100G防御/月付1

    摘要：點(diǎn)擊進(jìn)入旅途云商家官方網(wǎng)站旅途云國(guó)內(nèi)高防國(guó)內(nèi)高防套餐虛擬架構(gòu)，免費(fèi)安裝系統(tǒng)，全部為不限流量套餐。旅途云怎么樣?今天收到一個(gè)叫旅途云的商家給本站投稿，商家在自述中介紹是成立于2007年的商家，不過(guò)站長(zhǎng)查了一下他家的域名，去年注冊(cè)的，不知道這期間是否有更換過(guò)域名，旅途云商家主要銷售國(guó)內(nèi)的VPS，主打高防，四川雅安和四川宿遷機(jī)房都帶100G的防護(hù)，配置給的也比較高，從目前看性價(jià)比還是不錯(cuò)的，不過(guò)國(guó)...

    番茄西紅柿 評(píng)論0 收藏2637

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<