{"id":300,"date":"2015-02-26T14:47:41","date_gmt":"2015-02-26T13:47:41","guid":{"rendered":"http:\/\/lalloue.fr\/blog\/?p=300"},"modified":"2015-03-02T18:01:14","modified_gmt":"2015-03-02T17:01:14","slug":"ouvrir-une-application-externe-depuis-une-application-cordova","status":"publish","type":"post","link":"http:\/\/lalloue.fr\/blog\/ouvrir-une-application-externe-depuis-une-application-cordova\/","title":{"rendered":"Ouvrir une application externe depuis une application Cordova"},"content":{"rendered":"

\"Apache_Cordova1\"<\/a><\/p>\n

Pendant le d\u00e9veloppement d’une de mes applications hybrides avec AngularJS, j’ai eut besoin de cr\u00e9er une page listant les autres applications que j’ai d\u00e9velopp\u00e9 disponibles sur le Store.<\/p>\n

Jusque l\u00e0 pas grand chose de compliqu\u00e9, je construis ma vue et j’ajoute \u00e0 chaque \u00e9l\u00e9ment l’url de l’application sur le store.<\/p>\n

Sauf que l’url ouvre la page web du store dans la webview de mon application directement, et du coup au clic sur installer \u00e7a ne marche pas…et je ne peux pas pas retourner sur mon application non plus o_O!<\/p>\n

Mais alors comment je fais?<\/p>\n

<\/p>\n

 <\/p>\n

Petit rappel\u00a0:<\/h3>\n

Comme vous le savez s\u00fbrement, une application hybride Cordova s\u2019ex\u00e9cute dans une ‘webview’ contenue dans l’application native g\u00e9n\u00e9r\u00e9e.<\/p>\n

Cette webview est donc un conteneur dans lequel on peut ex\u00e9cuter une page web ou d\u00e9velopper une page web (html, css, javascript…).<\/p>\n

On peut presque dire que c’est un mini navigateur web embarqu\u00e9<\/strong>.<\/p>\n

Et donc qu’est ce qui se passe dans un navigateur quand on clique sur un lien? Le lien est ouvert dans la m\u00eame page du navigateur !<\/p>\n

Et bien il se passe la m\u00eame chose dans la webview, le lien s’ouvre dans la webview de l’application.<\/p>\n

 <\/p>\n

Comment contourner ce probl\u00e8me ?<\/h3>\n

Heureusement, il existe un plugin pour \u00e7a !<\/p>\n

Le plugin en question s\u2019appelle “InAppBrowser”<\/span> et est t\u00e9l\u00e9chargeable ici :\u00a0http:\/\/plugins.cordova.io\/#\/package\/org.apache.cordova.inappbrowser<\/a><\/p>\n

Contrairement \u00e0 ce que pourrait faire penser son nom, il ne permet pas que d’utiliser le navigateur int\u00e9gr\u00e9 dans l’application.<\/p>\n

 <\/p>\n

Installation :<\/h3>\n

Pour l’installation, rien de bien compliqu\u00e9, il suffit d’utiliser votre commande habituelle pour installer un plugin Cordova :<\/p>\n

 cordova plugin add org.apache.cordova.inappbrowser <\/pre>\n
 <\/p>\n
Utilisation :<\/h3>\n
Et donc maintenant pour ouvrir notre application externe il suffit d’utiliser l’appel javascript suivant :<\/p>\n
\r\nvar ref = window.open(url, target, options);\r\n<\/pre>\n