由于項目是放在微信公眾號中運行,所有用到微信js-sdk蛔琅,做圖片上傳胎许、跟支付。下面是使用過程中碰到的一些問題罗售。
1辜窑、首先,是引入微信js-sdk寨躁,因為ionic2 用的是typeScript,文件是.ts穆碎,所以引入js-sdk也是個問題。我們在src/index.html引入微信js-sdk
2职恳、在src/app目錄下創(chuàng)建wechat.d.ts文件(自定義)
在wechat.d.ts中聲明全局變量 declare var wx:any;
3所禀、在需要使用到微信圖片上傳的頁面引入wechat.d.ts文件
注意三個‘///’方面,還有文件的路徑。打印我們聲明在wechat.d.ts中的wx
4色徘、在使用的頁面中首先使用config接口驗證配置
成功恭金,可以在控制臺中查看jweixin-1.2.0.js返回的信息
而且開啟調試模式會彈出{“errMsg”:“config:ok”}
5、使用wx.chooseImage調起微信圖庫褂策、拍照接口
這里需要注意兩個地方横腿,第一是__self__我把當前類賦值給它,方便我們給模板傳值斤寂,如果在wx.chooseImage中直接用this耿焊,會調用wx對象的屬性或者方法。
第二是bypassSecurityTrustResourceUrl(localIds);這個是用來通過ionic2 模板賦值的安全機制扬蕊。使用它我們才能正確的顯示圖片搀别。因為localIds是可以直接拿來給img 的src賦值的丹擎。
不過濾掉安全機制尾抑,傳到頁面的src就會變成<imgsrc="unsafe:wxLocalResource://imageid123456789987654321",給我們的路徑多個unsafe,而我們需要的是它后面的只就可以里,加上它圖片是壞的蒂培。
那么我們怎么使用bypassSecurityTrustResourceUrl()呢
第一個import {DomSanitizer} from '@angular/platform-browser'再愈;
第二個在構造函數(shù)中聲明 public sanitizer:DomSanitizer。就像這樣
6护戳、微信后端可能用到的app簽名翎冲,需要與在微信公眾號填寫的app簽名一致。
打開微信.開放平臺官網(wǎng) 在資源中心--資源下載中找到Android資源下載
拉到最下面
這是一個手機應用媳荒,需要安裝到手機抗悍。成功安裝并打開
要查簽名,需要用到app的包名钳枕,查看app的包名在項目config.xml中查看
最后把包名輸入微信app簽名查看工具(需要打包成app并安裝到手機才能看到缴渊。)