Javascript 离子2/3插件加载问题:可能来自app.bundle.js
好吧,我的爱奥尼亚框架项目遇到了一个奇怪的问题。我已经在这个错误上工作了一天半,除了知道问题可能是什么以外,没有任何结果 我的nativeGeocoder、facebookLogin和googleLogin插件根本不起作用 但是,我的相机插件和地理定位插件可以工作 我从Ionic serve到浏览器收到以下错误:Javascript 离子2/3插件加载问题:可能来自app.bundle.js,javascript,jquery,json,cordova,ionic-framework,Javascript,Jquery,Json,Cordova,Ionic Framework,好吧,我的爱奥尼亚框架项目遇到了一个奇怪的问题。我已经在这个错误上工作了一天半,除了知道问题可能是什么以外,没有任何结果 我的nativeGeocoder、facebookLogin和googleLogin插件根本不起作用 但是,我的相机插件和地理定位插件可以工作 我从Ionic serve到浏览器收到以下错误: The resource from “http://localhost:8100/build/js/app.bundle.js” was blocked due to MIME typ
The resource from “http://localhost:8100/build/js/app.bundle.js” was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
这意味着出于某种原因,我的app.bundle.js在构建时没有生成。我假设这可能是问题的主要原因,但我在浏览器上也会遇到一些其他错误
Native: tried calling StatusBar.styleDefault, but Cordova is not available. Make sure to include cordova.js or run in a device/simulator main.js:45448:9
Native: tried calling SplashScreen.hide, but Cordova is not available. Make sure to include cordova.js or run in a device/simulator
这似乎告诉我要在设备上运行代码,但是,这并不能完全解释为什么geolocation可以在浏览器上运行,尽管它是cordova插件。当我在android设备上运行代码,并使用android调试模式获取日志时,我从android设备上得到了这个错误
安卓设备:
I/chromium( 5892): [INFO:CONSOLE(45432)] "Native: tried calling NativeGeocoder.forwardGeocode, but the NativeGeocoder plugin is not installed.", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45432)
D/SystemWebChromeClient( 5892): file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js: Line 45438 : Install the NativeGeocoder plugin: 'ionic plugin add cordova-plugin-nativegeocoder'
I/chromium( 5892): [INFO:CONSOLE(45438)] "Install the NativeGeocoder plugin: 'ionic plugin add cordova-plugin-nativegeocoder'", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45438)
D/SystemWebChromeClient( 5892): file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js: Line 45432 : Native: tried calling Facebook.login, but the Facebook plugin is not installed.
I/chromium( 5892): [INFO:CONSOLE(45432)] "Native: tried calling Facebook.login, but the Facebook plugin is not installed.", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45432)
D/SystemWebChromeClient( 5892): file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js: Line 45438 : Install the Facebook plugin: 'ionic plugin add cordova-plugin-facebook4'
I/chromium( 5892): [INFO:CONSOLE(45438)] "Install the Facebook plugin: 'ionic plugin add cordova-plugin-facebook4'", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45438)
D/SystemWebChromeClient( 5892): file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js: Line 45357 : Error logging into Facebook
I/chromium( 5892): [INFO:CONSOLE(45432)] "Native: tried calling GooglePlus.login, but the GooglePlus plugin is not installed.", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45432)
D/SystemWebChromeClient( 5892): file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js: Line 45438 : Install the GooglePlus plugin: 'ionic plugin add cordova-plugin-googleplus'
I/chromium( 5892): [INFO:CONSOLE(45438)] "Install the GooglePlus plugin: 'ionic plugin add cordova-plugin-googleplus'", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45438)
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Geolocation } from '@ionic-native/geolocation';
import { IdentifymytickPage } from '../identifymytick/identifymytick';
import { IdguidePage } from '../idguide/idguide';
import { RemovalPage } from '../removal/removal';
import { SymptomsPage } from '../symptoms/symptoms';
import { LoginPage } from '../login/login';
import { LocationAccuracy } from '@ionic-native/location-accuracy';
import { NativeGeocoder, NativeGeocoderReverseResult, NativeGeocoderForwardResult } from '@ionic-native/native-geocoder';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
constructor(public navCtrl: NavController, public geolocation: Geolocation, public nativeGeocoder: NativeGeocoder, public locac: LocationAccuracy) {
this.watch();
}
nextPage()
{
this.navCtrl.push(IdentifymytickPage)
}
nextPage1()
{
this.navCtrl.push(IdguidePage)
}
nextPage2()
{
this.navCtrl.push(LoginPage)
}
nextPage3()
{
this.navCtrl.push(RemovalPage)
}
nextPage4()
{
this.navCtrl.push(SymptomsPage)
}
coords:any;
accuracy:any;
error:any;
watch() {
this.geolocation.getCurrentPosition().then((resp) => {
this.coords = resp.coords.latitude + ' ' + resp.coords.longitude;
this.accuracy = resp.coords.accuracy + ' meters';
}).catch((error) => {
this.error = 'Error getting location: ' + error;
})
}
//
// townvar:any;
//
// nearestCity() {
//
// this.geolocation.getCurrentPosition().then((resp) => {
// this.nativeGeocoder.reverseGeocode(resp.coords.latitude, resp.coords.longitude)
// .then((result: NativeGeocoderReverseResult) => this.townvar = result.city)
// .catch((error: any) => console.log(error));
// })
//
// }
// geolocate() {
// let options = {
// enableHighAccuracy: true
// };
//
// this.geolocation.getCurrentPosition(options).then((position: Geoposition) => {
// this.getcountry(position);
//
// }).catch((err) => {
// console.error(err);
// })
//
// }
//
// getcountry(pos) {
// this.geocoder.reverseGeocode(pos.coords.latitude, pos.coords.longitude).then((res: NativeGeocoderReverseResult) => {
// console.log(res.countryName, res.city, res.district)
//
// })
// }
geolocateTEST() {
this.nativeGeocoder.reverseGeocode(52.5072095, 13.1452818)
.then((result: NativeGeocoderReverseResult) => console.log('The address is ' + result.street + ' in ' + result.countryCode))
.catch((error: any) => console.log(error));
this.nativeGeocoder.forwardGeocode('Berlin')
.then((coordinates: NativeGeocoderForwardResult) => console.log('The coordinates are latitude=' + coordinates.latitude + ' and longitude=' + coordinates.longitude))
.catch((error: any) => console.log(error));
}
}
再次注意,Cordova的摄像头和地理定位插件可以工作,而这些插件甚至没有被设备检测到
这是因为bundle.js错误吗?通过该文件可以识别插件吗?我以为都是通过cordova.js处理的
我为调试它所采取的步骤如下:
1。尝试卸载我已安装但未使用的插件。同时进入package.json删除他们的调用
2.尝试在config.xml中重新排序插件顺序
3.卸载并重新安装地理编码插件
4.通常会尝试让尽可能少的插件加载,以排除任何可能的插件冲突
这些解决方案对我都不起作用,bundle.js仍然没有生成,据我猜测,这可能是问题的原因
问题似乎来自config.xml、package.json或index.html,我将发布这三个文件的代码
我的index.html加载方式如下:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<title>Ionic App</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
<link rel="manifest" href="manifest.json">
<meta name="theme-color" content="#4e8ef7">
<!-- cordova.js required for cordova apps -->
<script src="cordova.js"></script>
<!-- Polyfill needed for platforms without Promise and Collection support -->
<!-- The bundle which is built from the app's source code -->
<script src="build/js/app.bundle.js"></script>
<!-- un-comment this code to enable service worker
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('service-worker.js')
.then(() => console.log('service worker installed'))
.catch(err => console.error('Error', err));
}
</script>-->
<link href="build/main.css" rel="stylesheet">
</head>
<body>
<!-- Ionic's root component and where the app will load -->
<ion-app></ion-app>
<!-- The polyfills js is generated during the build process -->
<script src="build/polyfills.js"></script>
<!-- The bundle js is generated during the build process -->
<script src="build/main.js"></script>
</body>
</html>
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.projname.id" 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" href="http://ionicframework.com/">Ionic Framework Team</author>
<content src="index.html" />
<access origin="*" />
<allow-navigation href="http://ionic.local/*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<preference name="webviewbounce" value="false" />
<preference name="UIWebViewBounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
<preference name="android-minSdkVersion" value="16" />
<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 height="57" src="resources/ios/icon/icon.png" width="57" />
<icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
<icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
<icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
<icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
<icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
<icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
<icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
<icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
<icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
<icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
<icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
<icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
<icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
<icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
<icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
<icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
<icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
<splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
<splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
<splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
<splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
<splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
<splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
<splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
<splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
<splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
<splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
<splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
<splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
</platform>
<engine name="android" spec="^6.2.3" />
<engine name="ios" spec="^4.4.0" />
<plugin name="ionic-plugin-keyboard" spec="^2.2.1" />
<plugin name="keywords" spec="^0.1.2">
<plugin name="cordova-plugin-camera" spec="^2.4.1" />
<plugin name="cordova-plugin-image-picker" spec="^1.1.3" />
<plugin name="cordova-plugin-nativegeocoder" spec="^1.0.2" />
<plugin name="cordova-plugin-request-location-accuracy" spec="^2.2.1" />
<plugin name="cordova-plugin-splashscreen" spec="^4.0.3" />
<plugin name="cordova-plugin-statusbar" spec="^2.2.2" />
<plugin name="cordova-plugin-whitelist" spec="^1.3.1" />
<plugin name="cordova-plugin-console" spec="^1.0.5" />
<plugin name="cordova-plugin-device" spec="^1.1.4" />
<plugin name="cordova-plugin-facebook4" spec="^1.9.0">
<variable name="APP_ID" value="166628403873954" />
<variable name="APP_NAME" value="projname" />
</plugin>
<plugin name="cordova-plugin-geolocation" spec="^2.4.3" />
</plugin>
<plugin name="cordova-plugin-googleplus" spec="^5.1.1">
<variable name="REVERSED_CLIENT_ID" value="myreversedclientid" />
</plugin>
</widget>
我的config.xml加载如下:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<title>Ionic App</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
<link rel="manifest" href="manifest.json">
<meta name="theme-color" content="#4e8ef7">
<!-- cordova.js required for cordova apps -->
<script src="cordova.js"></script>
<!-- Polyfill needed for platforms without Promise and Collection support -->
<!-- The bundle which is built from the app's source code -->
<script src="build/js/app.bundle.js"></script>
<!-- un-comment this code to enable service worker
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('service-worker.js')
.then(() => console.log('service worker installed'))
.catch(err => console.error('Error', err));
}
</script>-->
<link href="build/main.css" rel="stylesheet">
</head>
<body>
<!-- Ionic's root component and where the app will load -->
<ion-app></ion-app>
<!-- The polyfills js is generated during the build process -->
<script src="build/polyfills.js"></script>
<!-- The bundle js is generated during the build process -->
<script src="build/main.js"></script>
</body>
</html>
<?xml version='1.0' encoding='utf-8'?>
<widget id="com.projname.id" 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" href="http://ionicframework.com/">Ionic Framework Team</author>
<content src="index.html" />
<access origin="*" />
<allow-navigation href="http://ionic.local/*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<preference name="webviewbounce" value="false" />
<preference name="UIWebViewBounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
<preference name="android-minSdkVersion" value="16" />
<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 height="57" src="resources/ios/icon/icon.png" width="57" />
<icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
<icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
<icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
<icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
<icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
<icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
<icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
<icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
<icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
<icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
<icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
<icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
<icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
<icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
<icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
<icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
<icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
<splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
<splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
<splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
<splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
<splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
<splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
<splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
<splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
<splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
<splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
<splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
<splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
</platform>
<engine name="android" spec="^6.2.3" />
<engine name="ios" spec="^4.4.0" />
<plugin name="ionic-plugin-keyboard" spec="^2.2.1" />
<plugin name="keywords" spec="^0.1.2">
<plugin name="cordova-plugin-camera" spec="^2.4.1" />
<plugin name="cordova-plugin-image-picker" spec="^1.1.3" />
<plugin name="cordova-plugin-nativegeocoder" spec="^1.0.2" />
<plugin name="cordova-plugin-request-location-accuracy" spec="^2.2.1" />
<plugin name="cordova-plugin-splashscreen" spec="^4.0.3" />
<plugin name="cordova-plugin-statusbar" spec="^2.2.2" />
<plugin name="cordova-plugin-whitelist" spec="^1.3.1" />
<plugin name="cordova-plugin-console" spec="^1.0.5" />
<plugin name="cordova-plugin-device" spec="^1.1.4" />
<plugin name="cordova-plugin-facebook4" spec="^1.9.0">
<variable name="APP_ID" value="166628403873954" />
<variable name="APP_NAME" value="projname" />
</plugin>
<plugin name="cordova-plugin-geolocation" spec="^2.4.3" />
</plugin>
<plugin name="cordova-plugin-googleplus" spec="^5.1.1">
<variable name="REVERSED_CLIENT_ID" value="myreversedclientid" />
</plugin>
</widget>
地理编码代码:
I/chromium( 5892): [INFO:CONSOLE(45432)] "Native: tried calling NativeGeocoder.forwardGeocode, but the NativeGeocoder plugin is not installed.", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45432)
D/SystemWebChromeClient( 5892): file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js: Line 45438 : Install the NativeGeocoder plugin: 'ionic plugin add cordova-plugin-nativegeocoder'
I/chromium( 5892): [INFO:CONSOLE(45438)] "Install the NativeGeocoder plugin: 'ionic plugin add cordova-plugin-nativegeocoder'", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45438)
D/SystemWebChromeClient( 5892): file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js: Line 45432 : Native: tried calling Facebook.login, but the Facebook plugin is not installed.
I/chromium( 5892): [INFO:CONSOLE(45432)] "Native: tried calling Facebook.login, but the Facebook plugin is not installed.", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45432)
D/SystemWebChromeClient( 5892): file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js: Line 45438 : Install the Facebook plugin: 'ionic plugin add cordova-plugin-facebook4'
I/chromium( 5892): [INFO:CONSOLE(45438)] "Install the Facebook plugin: 'ionic plugin add cordova-plugin-facebook4'", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45438)
D/SystemWebChromeClient( 5892): file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js: Line 45357 : Error logging into Facebook
I/chromium( 5892): [INFO:CONSOLE(45432)] "Native: tried calling GooglePlus.login, but the GooglePlus plugin is not installed.", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45432)
D/SystemWebChromeClient( 5892): file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js: Line 45438 : Install the GooglePlus plugin: 'ionic plugin add cordova-plugin-googleplus'
I/chromium( 5892): [INFO:CONSOLE(45438)] "Install the GooglePlus plugin: 'ionic plugin add cordova-plugin-googleplus'", source: file:///data/data/com.ionic.viewapp/files/files//4715e941/build/main.js (45438)
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Geolocation } from '@ionic-native/geolocation';
import { IdentifymytickPage } from '../identifymytick/identifymytick';
import { IdguidePage } from '../idguide/idguide';
import { RemovalPage } from '../removal/removal';
import { SymptomsPage } from '../symptoms/symptoms';
import { LoginPage } from '../login/login';
import { LocationAccuracy } from '@ionic-native/location-accuracy';
import { NativeGeocoder, NativeGeocoderReverseResult, NativeGeocoderForwardResult } from '@ionic-native/native-geocoder';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
constructor(public navCtrl: NavController, public geolocation: Geolocation, public nativeGeocoder: NativeGeocoder, public locac: LocationAccuracy) {
this.watch();
}
nextPage()
{
this.navCtrl.push(IdentifymytickPage)
}
nextPage1()
{
this.navCtrl.push(IdguidePage)
}
nextPage2()
{
this.navCtrl.push(LoginPage)
}
nextPage3()
{
this.navCtrl.push(RemovalPage)
}
nextPage4()
{
this.navCtrl.push(SymptomsPage)
}
coords:any;
accuracy:any;
error:any;
watch() {
this.geolocation.getCurrentPosition().then((resp) => {
this.coords = resp.coords.latitude + ' ' + resp.coords.longitude;
this.accuracy = resp.coords.accuracy + ' meters';
}).catch((error) => {
this.error = 'Error getting location: ' + error;
})
}
//
// townvar:any;
//
// nearestCity() {
//
// this.geolocation.getCurrentPosition().then((resp) => {
// this.nativeGeocoder.reverseGeocode(resp.coords.latitude, resp.coords.longitude)
// .then((result: NativeGeocoderReverseResult) => this.townvar = result.city)
// .catch((error: any) => console.log(error));
// })
//
// }
// geolocate() {
// let options = {
// enableHighAccuracy: true
// };
//
// this.geolocation.getCurrentPosition(options).then((position: Geoposition) => {
// this.getcountry(position);
//
// }).catch((err) => {
// console.error(err);
// })
//
// }
//
// getcountry(pos) {
// this.geocoder.reverseGeocode(pos.coords.latitude, pos.coords.longitude).then((res: NativeGeocoderReverseResult) => {
// console.log(res.countryName, res.city, res.district)
//
// })
// }
geolocateTEST() {
this.nativeGeocoder.reverseGeocode(52.5072095, 13.1452818)
.then((result: NativeGeocoderReverseResult) => console.log('The address is ' + result.street + ' in ' + result.countryCode))
.catch((error: any) => console.log(error));
this.nativeGeocoder.forwardGeocode('Berlin')
.then((coordinates: NativeGeocoderForwardResult) => console.log('The coordinates are latitude=' + coordinates.latitude + ' and longitude=' + coordinates.longitude))
.catch((error: any) => console.log(error));
}
}
问题就出在index.html上,它与内容安全策略有关。。。。 按照下面的方向走。这只需要简单的一步 从根文件夹>src>index.html 更改这行代码
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: ms-appdata: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
到
您的index.html应该如下所示
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<title>Ionic App</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<!--<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: ms-appdata: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">-->
<meta http-equiv="Content-Security-Policy" content="default-src *; img-src 'self' data:; style-src 'self' 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
<link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
<link rel="manifest" href="manifest.json">
<meta name="theme-color" content="#4e8ef7">
<!-- cordova.js required for cordova apps -->
<script src="cordova.js"></script>
<!-- un-comment this code to enable service worker
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('service-worker.js')
.then(() => console.log('service worker installed'))
.catch(err => console.log('Error', err));
}
</script>-->
<link href="build/main.css" rel="stylesheet">
</head>
<body>
<!-- Ionic's root component and where the app will load -->
<ion-app></ion-app>
<!-- The polyfills js is generated during the build process -->
<script src="build/polyfills.js"></script>
<!-- The bundle js is generated during the build process -->
<script src="build/main.js"></script>
</body>
</html>
离子应用
试过了。不幸的是,这没有帮助。我也遇到了同样的错误。我注意到的唯一一件事是,代码使地理定位插件抛出了一个位置错误,但仅此而已。有没有办法让我看到你的app.module.tsI刚刚用我的app.module.ts编辑了主帖。如果你能看看,那将是一个巨大的帮助。谢谢如果你刚刚迁移了你的应用程序,那么你需要为你的每一个本机插件运行爱奥尼亚和npm安装。。。例如$ionic cordova插件添加cordova插件地理位置和$npm安装——保存@ionic native/geolocation这真是个好消息。其他人也向我澄清了这一点。我的地理编码被编辑到原始帖子中。谢谢c: