iOS 将 Cordova 应用程序作为 web 视图嵌入到另一个应用程序中
Posted
技术标签:
【中文标题】iOS 将 Cordova 应用程序作为 web 视图嵌入到另一个应用程序中【英文标题】:iOS Embed Cordova App into another as a webview 【发布时间】:2019-10-07 12:08:27 【问题描述】:我在工作中有一个在 Cordova 开发的应用程序,现在我被要求“插入”该应用程序,以便能够从另一个也将在 Cordova 开发的应用程序打开它。总而言之,他们想从另一个应用程序打开一个应用程序。在 android 中,我已经能够通过这样的 webviews 做到这一点:
这两个应用都是用 Ionic 制作的。 我编译它以获得www
文件夹。
我将www
文件夹复制到插件项目的src
文件夹中。
对于 Android,我使用以下代码:
PhonePlugin.java
public class PhonePlugin extends CordovaPlugin
@Override
public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException
try
actionExecutor(action, args);
callbackContext.success("launched!");
catch (Exception e)
callbackContext.error(e.getLocalizedMessage());
return true;
private void actionExecutor(String action, JSONArray args) throws Exception
if ("start".equals(action))
JSONObject jsonObject = new JSONObject(args.getString(0));
final String poi = jsonObject.getString("poi");
final String email = jsonObject.getString("email");
final String apikey = jsonObject.getString("apikey");
cordova.getThreadPool().execute(new Runnable()
@Override
public void run()
start(poi, email, apikey);
);
else if("finish".equals(action))
cordova.getThreadPool().execute(new Runnable()
@Override
public void run()
finish();
);
else
throw new IllegalStateException("Unknown action: " + action);
private void start(String poi, String email, String apikey)
Intent intent = new Intent(cordova.getActivity(), PhoneActivity.class);
intent.putExtra(PhoneActivity.EMAIL, email);
intent.putExtra(PhoneActivity.APIKEY, apikey);
intent.putExtra(PhoneActivity.POI, poi);
cordova.getActivity().startActivity(intent);
cordova.getActivity().overridePendingTransition(android.R.anim.fade_in, android.R.anim.fade_out);
private void finish()
cordova.getActivity().finish();
PhoneActivity.java
public class PhoneActivity extends CordovaActivity
public static String POI = "POI";
public static String EMAIL = "EMAIL";
public static String APIKEY = "APIKEY";
@Override
public void onCreate(Bundle savedInstanceState)
super.onCreate(savedInstanceState);
super.init();
String poi = getIntent().getStringExtra(POI);
String email = getIntent().getStringExtra(EMAIL);
String apikey = getIntent().getStringExtra(APIKEY);
String indexUrl = "file:///android_asset/www/phoneplugin/index.html?poi=" + poi + "&apikey=" + apikey + "&email=" + email;
loadUrl(indexUrl);
使用此代码,它可以在我想要实现的 Android 上运行(不是文件夹 android_asset/www/phoneplugin
是我的“插件化”离子应用程序中的 www
。有了这个我可以使用按钮打开我的“插件化”应用程序调用我的start
方法,它运行良好,启动屏幕出现,然后应用程序运行(我真的不喜欢这个,但这是我老板想要的,所以 idc)。
现在我的问题来自 ios。我不知道 Swift,我只是进入“插件化”应用程序的启动屏幕,然后插件化应用程序关闭。
这是我到目前为止所拥有的,但我知道如何完成它,或者如果它是正确的并且问题出在其他问题上的话:
@objc(电话插件) 类 PhonePlugin : CDVPlugin
@objc(start:)
func start(_ command: CDVInvokedUrlCommand)
let json = try? JSON(data: jsonData)
let authToken = json["token"]
let key = json["secret_key"]
let vc = CDVViewController(nibName: nil, bundle: nil)
vc.startPage = "phoneplugin/index.html"
let rootVC = UIApplication.shared.keyWindow?.rootViewController
rootVC?.presentedViewController?.dismiss(animated: false, completion: nil)
rootVC?.present(vc, animated: true, completion: nil)
@objc(finish:)
func finish(_ command: CDVInvokedUrlCommand)
let rootVC = UIApplication.shared.keyWindow?.rootViewController
rootVC?.presentedViewController?.dismiss(animated: false, completion: nil)
如果需要,我的plugin.xml
如下:
<?xml version='1.0' encoding='utf-8'?>
<plugin id="ionic-phone-plugin" version="1.0.0"
xmlns="http://apache.org/cordova/ns/plugins/1.0"
xmlns:android="http://schemas.android.com/apk/res/android">
<name>PhonePlugin</name>
<js-module name="PhonePlugin" src="www/PhonePlugin.js">
<clobbers target="window.cordova.plugins.PhonePlugin" />
</js-module>
<engines>
<engine name="cordova" version=">=6.5.0" />
</engines>
<asset src="src/www" target="phoneplugin" />
<dependency id="cordova-android-support-gradle-release" version="2.1.0" />
<dependency id="cordova-android-play-services-gradle-release" version="3.0.0" />
<dependency id="cordova-android-firebase-gradle-release" version="3.0.0" />
<dependency id="cordova-plugin-bluetooth-serial" version="0.4.7" />
<dependency id="cordova-plugin-geolocation" version="4.0.1" />
<dependency id="cordova-plugin-insomnia" version="4.3.0" />
<dependency id="cordova-plugin-network-information" version="2.0.1" />
<dependency id="cordova-plugin-request-location-accuracy" version="2.2.3" />
<dependency id="cordova-plugin-tts" version="0.2.3" />
<dependency id="cordova.plugins.diagnostic" version="4.0.9" />
<dependency id="cordova-sqlite-storage" version="2.3.3" />
<dependency id="cordova-open-native-settings" version="1.5.2" />
<dependency id="cordova-plugin-statusbar" version="2.4.2" />
<dependency id="situm-cordova-plugin-official" version="1.14.2" />
<dependency id="cordova-plugin-screen-orientation" version="3.0.1" />
<dependency id="cordova-plugin-add-swift-support" version="1.7.2"/>
<platform name="android">
<config-file parent="/*" target="res/xml/config.xml">
<feature name="PhonePlugin">
<param name="android-package" value="com.test.phoneplugin.PhonePlugin" />
</feature>
</config-file>
<config-file target="AndroidManifest.xml" parent="/manifest/application">
<activity android:name="com.test.phoneplugin.PhonePluginActivity" android:screenOrientation="portrait" />
</config-file>
<source-file src="src/android/com/test/phoneplugin/PhonePlugin.java" target-dir="src/com/test/phoneplugin" />
<source-file src="src/android/com/test/phoneplugin/PhoneActivity.java" target-dir="src/com/test/phoneplugin" />
</platform>
<platform name="ios">
<config-file parent="/*" target="config.xml">
<feature name="PhonePlugin">
<param name="ios-package" value="PhonePlugin" />
</feature>
</config-file>
<source-file src="src/ios/PhonePlugin.swift" />
</platform>
</plugin>
我试图安装这个插件化应用程序的config.xml
是这样的:
<?xml version='1.0' encoding='utf-8'?>
<widget id="io.ionic.adadadasasdfffgg" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>MyApp</name>
<description>An awesome Ionic/Cordova app.</description>
<author email="hi@ionicframework.com" href="http://ionicframework.com/">Ionic Framework Team</author>
<content src="index.html" />
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<allow-navigation href="*" />
<preference name="ScrollEnabled" value="false" />
<preference name="android-minSdkVersion" value="19" />
<preference name="BackupWebStorage" value="none" />
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="3000" />
<platform name="android">
<allow-intent href="market:*" />
<icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
<icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
<icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
<icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
<icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
<icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
<splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
<splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
<splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
<splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
<splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
<splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
<splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
<splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
<splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
<splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
<splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
<splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
<icon src="resources/ios/icon/icon.png" />
<icon src="resources/ios/icon/icon@2x.png" />
<icon src="resources/ios/icon/icon-40.png" />
<icon src="resources/ios/icon/icon-40@2x.png" />
<icon src="resources/ios/icon/icon-40@3x.png" />
<icon src="resources/ios/icon/icon-50.png" />
<icon src="resources/ios/icon/icon-50@2x.png" />
<icon src="resources/ios/icon/icon-60.png" />
<icon src="resources/ios/icon/icon-60@2x.png" />
<icon src="resources/ios/icon/icon-60@3x.png" />
<icon src="resources/ios/icon/icon-72.png" />
<icon src="resources/ios/icon/icon-72@2x.png" />
<icon src="resources/ios/icon/icon-76.png" />
<icon src="resources/ios/icon/icon-76@2x.png" />
<icon src="resources/ios/icon/icon-83.5@2x.png" />
<icon src="resources/ios/icon/icon-small.png" />
<icon src="resources/ios/icon/icon-small@2x.png" />
<icon src="resources/ios/icon/icon-small@3x.png" />
<icon src="resources/ios/icon/icon-1024.png" />
<splash src="resources/ios/splash/Default-568h@2x~iphone.png" />
<splash src="resources/ios/splash/Default-667h.png" />
<splash src="resources/ios/splash/Default-736h.png" />
<splash src="resources/ios/splash/Default-Landscape-736h.png" />
<splash src="resources/ios/splash/Default-Landscape@2x~ipad.png" />
<splash src="resources/ios/splash/Default-Landscape@~ipadpro.png" />
<splash src="resources/ios/splash/Default-Landscape~ipad.png" />
<splash src="resources/ios/splash/Default-Portrait@2x~ipad.png" />
<splash src="resources/ios/splash/Default-Portrait@~ipadpro.png" />
<splash src="resources/ios/splash/Default-Portrait~ipad.png" />
<splash src="resources/ios/splash/Default@2x~iphone.png" />
<splash src="resources/ios/splash/Default~iphone.png" />
<splash src="resources/ios/splash/Default@2x~universal~anyany.png" />
</platform>
<plugin name="cordova-plugin-whitelist" spec="1.3.3" />
<plugin name="cordova-plugin-statusbar" spec="2.4.2" />
<plugin name="cordova-plugin-device" spec="2.0.2" />
<plugin name="cordova-plugin-splashscreen" spec="5.0.2" />
<plugin name="cordova-plugin-ionic-webview" spec="^4.0.0" />
<plugin name="cordova-plugin-ionic-keyboard" spec="^2.0.5" />
<plugin name="cordova-plugin-googlemaps" spec="~2.4.4">
<variable name="API_KEY_FOR_IOS" value="AIzaSyBpAjztTxH4ldWJBOWiJXvRZZsBVw0y_oI" />
<variable name="API_KEY_FOR_ANDROID" value="AIzaSyD3RIddnImiOjtE0ep8mV6FrXEEcc6Uaz8" />
<variable name="LOCATION_WHEN_IN_USE_DESCRIPTION" value="This app wants to get your location while this app runs only." />
<variable name="LOCATION_ALWAYS_USAGE_DESCRIPTION" value="This app wants to get your location always, even this app runs in background." />
<variable name="PLAY_SERVICES_VERSION" value="15.0.1" />
<variable name="ANDROID_SUPPORT_V4_VERSION" value="27.+" />
</plugin>
<plugin name="ionic-phone-plugin" spec="/Users/macbookairdt/Desktop/test/PhonePlugin" />
<engine name="browser" spec="~5.0.4" />
<engine name="android" spec="~7.1.4" />
</widget>
有人知道它为什么不起作用吗?
谢谢!
【问题讨论】:
【参考方案1】:我通过以下方式解决了这个问题:
vc.startPage = "file:///phoneplugin/index.html"
【讨论】:
以上是关于iOS 将 Cordova 应用程序作为 web 视图嵌入到另一个应用程序中的主要内容,如果未能解决你的问题,请参考以下文章
如何将现有的 Angular1 Web 应用程序转换为 Cordova 应用程序?
Cordova:无论如何,是不是可以在 Javascript 中检测 iOS 应用程序是作为调试版还是作为发布版构建的?
Cordova/jQuery - 识别您的应用程序是在 Web/移动浏览器还是移动应用程序 (Android/iOS) 上运行