Открыть URL-адрес в webview - телефонный разговор

Я хотел бы знать, как открыть URL-адрес в контексте приложения embed webview. В настоящее время эта демонстрация откроет новую вкладку во внешнем браузере, поэтому не то, что я ожидаю. Я использую google.com только для тестирования.

Резюме, я ищу функциональную демонстрацию.

<?xml version="1.0" encoding="UTF-8"?>

<!-- config.xml reference: https://build.phonegap.com/docs/config-xml -->
<widget xmlns     = "http://www.w3.org/ns/widgets"
        xmlns:gap = "http://phonegap.com/ns/1.0"
        xmlns:android = "http://schemas.android.com/apk/res/android"
        id        = "com.xxx.xxxxx"
        version   = "1.0.0">

    <preference name="stay-in-webview" value="true" />

    <access origin="*" browserOnly="true" subdomains="true" />

    <content src="index.html" />

    <allow-navigation href="#" onclick="location.href='https://google.com/*'; return false;" />

    <gap:plugin name="cordova-plugin-whitelist" source="npm" version="~1" />
    <gap:plugin name="org.apache.cordova.inappbrowser" />
    <gap:plugin name="org.apache.cordova.splashscreen" />

    <preference name="phonegap-version"           value="cli-5.4.1" />
    <preference name="permissions"                value="none"/>
    <preference name="target-device"              value="universal"/>
    <preference name="fullscreen"                 value="true"/>

</widget>

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/index.css" />
    </head>
    <body>
        <div>
            <script type="text/javascript" charset="utf-8">
                document.addEventListener("deviceready", onDeviceReady, false);

                function onDeviceReady() {
                    window.location.href = 'https://google.com';
                }
            </script>
        </div>
        <script type="text/javascript" src="cordova.js"></script>
    </body>
</html>

Обновление: Полный файл xml: https://codeshare.io/Vw3Fl

Ответы

Ответ 1

попробуйте:

window.open('https://google.com', '_self ', 'location=yes');

вместо:

window.location.href = 'https://google.com';

Это будет использовать InAppBrowser и использовать _self в качестве цели.

Ответ 2

Вы должны добавить эту строку в файл config.xml, чтобы разрешить навигацию по внешним URL-адресам

<allow-navigation href="*" />

Это позволит перейти на любой внешний URL-адрес, если вы просто хотите разрешить навигацию по Google, а затем добавить эту строку

<allow-navigation href="https://google.com" /> 

Вы можете проверить остальную часть документации на странице плагина

https://github.com/apache/cordova-plugin-whitelist

Ответ 3

Возможно, вам придется добавить следующее в ваш XML файл phonegap:

<?xml version="1.0" encoding="UTF-8"?>
<phonegap>
    <access origin="https://abcx.com" subdomains="true" />
</phonegap>

Ответ 4

Очень простой способ открыть страницу в системном браузере в приложении phonegap - это сделать эту страницу в iframe.

<iframe src="http://www.google.com></iframe>

Вы можете изменить URL-адрес в iframe, используя dom update.

Это будет загружаться на странице в собственном системном браузере.

Ответ 5

Для тех, у кого есть эта проблема при использовании Phonegap 6.3.1, вы должны правильно настроить URL-адреса и использовать плагин cordova-plug-inappbrowser.

Читайте дальше, как это сделать.


Во-первых, убедитесь, что у вас есть белые адреса, которые вы хотите открыть. Вы делаете это, добавляя их в hrefs тегов <access>, тегов <allow-intent> и тегов allow-navigation в файле config.xml в корне проекта. Что-то в этом роде:

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.phonegap.helloworld" version="1.0.0"
        xmlns="http://www.w3.org/ns/widgets"
        xmlns:gap="http://phonegap.com/ns/1.0">

    ...

    <access origin="*" />
    <allow-intent href="*" />
    <allow-navigation href="*" />

    ...

</widget>

(Примечание: "*" в вышеуказанных hrefs позволяет открывать любой URL-адрес. В процессе производства вы, вероятно, хотите ограничить определенные URL-адреса/пути)

Затем в файле index.html добавьте следующий javascript:

<script type="text/javascript">
    document.addEventListener('deviceready', function() {
        var url = 'https://www.google.com' // change to whatever you want
        cordova.InAppBrowser.open(url, '_self', 'location=no');
    }, false)
</script>

Этот script использует плагин cordova-plug-inappbrowser, который, если вы создали приложение с использованием стандартного шаблона Phonegap, уже должен быть включен в ваш файл config.xml.

script ожидает готовности устройства, затем использует плагин cordova-plug-inappbrowser, чтобы открыть данный URL-адрес. Параметр '_self' означает, что он открывает страницу в веб-просмотре Phonegap, а 'location=no' означает, что адресной строки не будет. Для других параметров см. Документацию для плагина cordova-plug-inappbrowser (ссылка выше).

Наконец, чтобы протестировать приложение в соответствующих эмуляторах (при условии, что у вас установлен CLG Phonegap), выполните следующие команды:

phonegap run ios --verbose --stack-trace
phonegap run android --verbose --stack-trace

Ответ 6

установите следующий плагин, введя эти команды в каталог проекта

phonegap plugin add cordova-plugin-whitelist
phonegap prepare

затем добавьте следующие теги в index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" />
<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' gap:; style-src 'self' 'unsafe-inline'; media-src *" />
<style>
*{
    margin: 0px;
    padding: 0px;
 } body {width:100%;height:100%;margin:0;overflow:hidden;background-
 color:#252525;}
 #my_iframe{
  border: 0px;
  height: 100vh;
  width: 100%;
  }
  </style>
<title>ProjectName</title>
</head>

<body>
<iframe src="PUT_HERE_YOUR_PROJECT_URL" id="my_iframe" frameborder="0" width="100%" height="100%" >
</iframe>   
</body>

</html>