ПРИМЕЧАНИЕ: Эта проблема сообщается из нескольких сторон в официальном репозитории GitHub для плагина Browser-Sync Cordova, а также. Проводя это здесь, чтобы привлечь больше внимания к проблеме и узнать, есть ли у кого-нибудь понимание или практическое решение этого.
Im новый для мира Apache Cordova, но свободно в разработке LAMP с полным стеком. Тем не менее, я озадачен этим вопросом: когда я создаю базовое/простое приложение Apache Cordova и добавляю браузер Cordova- Sync Plugin в микс, я могу внести изменения в мой каталог www/, а затем сразу увидеть их в platforms/browser/www/, но мое открытое окно браузера не перезагружается. Мне нужно принудительно перезагрузить, чтобы изменения отображались в браузере.
Я запускаю все это в Mac OS X 10.10.5 (Yosemite), NodeJS - 4.4.0, NPM - 2.14.20, Кордова - 6.0.0, а плагин Cordova Browser-Sync - 0.1.1.
Мои шаги по настройке: сначала создайте новое приложение, подобное этому:
cordova create MyApp
Затем я перехожу в каталог следующим образом:
cd MyApp
И настройте мое простое приложение "браузера" Кордовы следующим образом:
cordova platform add browser
Последний тест - просто запустить приложение следующим образом:
cordova run browser
Хорошо, поэтому мы знаем этот простой "Hello world". тестовые работы. Теперь я добавлю плагин Corbo Browser-Sync следующим образом:
cordova plugin add cordova-plugin-browsersync
Все хорошо, и теперь я буду тестировать приложение следующим образом:
cordova run browser -- --live-reload
И если я вношу изменения в файл, браузер просто не "перезагружается", как описано; если я что-то не упущу? Вывод этой команды:
Running command: /Users/jakegould/Desktop/MyApp/platforms/browser/cordova/run --live-reload
Static file server running on port 8000 (i.e. http://localhost:8000)
CTRL + C to shut down
Static file server running @ http://localhost:8000/index.html
CTRL + C to shut down
Executing command: open -n -a "Google Chrome" --args --user-data-dir=/tmp/temp_chrome_user_data_dir_for_cordova http://localhost:8000/index.html
[BS] Access URLs:
--------------------------------------
Local: http://localhost:3000
External: http://192.168.1.20:3000
--------------------------------------
UI: http://localhost:3001
UI External: http://192.168.1.20:3001
--------------------------------------
[BS] Serving files from: platforms/android/assets/www
[BS] Serving files from: platforms/ios/www
[BS] Watching files...
gzip
200 /index.html (/Users/jakegould/Desktop/MyApp/platforms/browser/www/index.html)
gzip
200 /css/index.css (/Users/jakegould/Desktop/MyApp/platforms/browser/www/css/index.css)
gzip
200 /cordova.js (/Users/jakegould/Desktop/MyApp/platforms/browser/www/cordova.js)
gzip
200 /img/logo.png (/Users/jakegould/Desktop/MyApp/platforms/browser/www/img/logo.png)
gzip
200 /js/index.js (/Users/jakegould/Desktop/MyApp/platforms/browser/www/js/index.js)
gzip
200 /cordova_plugins.js (/Users/jakegould/Desktop/MyApp/platforms/browser/www/cordova_plugins.js)
[BS] Reloading Browsers...
Обратите внимание на то, как в конце списка указано "Перезагрузка браузеров...". Уверяю вас, 100% не перезагружен ни один браузер. И вот HTML www/index.html из корня приложения, которое я пытаюсь отредактировать, чтобы вызвать перезагрузку в реальном времени:
<!DOCTYPE html>
<!--
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
distributed with this work for additional information
regarding copyright ownership. The ASF licenses this file
to you under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance
with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License.
-->
<html>
<head>
<!--
Customize this policy to fit your own app needs. For more guidance, see:
https://github.com/apache/cordova-plugin-whitelist/blob/master/README.md#content-security-policy
Some notes:
* gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
* https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
* Disables use of inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
* Enable inline JS: add 'unsafe-inline' to default-src
-->
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
<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">
<link rel="stylesheet" type="text/css" href="css/index.css">
<title>Hello World</title>
</head>
<body>
<div class="app">
<h1>Apache Cordova</h1>
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Fucking Ready</p>
</div>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
</body>
</html>
Я понимаю, что функция живой перезагрузки часто основывается на встроенном JavaScript-коде, который каким-то образом вводится в DOM HTML для связи с сервером живой перезагрузки. И все, что я читал в Интернете, говорит о таких проблемах, когда живая перезагрузка сбой - часто происходит из тегов <body></body>, которые не задаются на странице. Но они явно там. Я почти хочу думать о связанной с этим проблеме Content-Security-Policy, но это было бы действительно действительно фактором, если бы JavaScript был введен на страницу для начала.
Итак, почему именно функция живой перезагрузки не работает в первоначальной настройке невероятно голых костей?