'Inteligenty' dom ze sterownikiem PLC

 Language:
Szukanie zaawansowane  

Aktualności:

Powrót do strony głównej: www.edom-plc.pl

Autor Wątek: Problem z przyciskami w wizualizacji html.  (Przeczytany 8883 razy)

ziutol

  • Newbie
  • *
  • Wiadomości: 11
    • Zobacz profil
Problem z przyciskami w wizualizacji html.
« dnia: Luty 11, 2014, 12:43:06 am »

Witam
Mam problem z działaniem przycisków (żarówka  zmieniająca stan). Nadmieniam że jeśli chodzi o programowanie to mam nikłe pojęcie opieram się głównie na poradach ze strony admina.

Wożę stronę do sterowania  oświetleniem po wciśnięciu na żarówkę zmienia się stan wyjścia w sterowniku lecz na stronie dzieje się tak, ze żarówka nie zmienia się na żółtą tak jak pokazane jest to w załączniku.

Mój skrypt wygląda tak:

var ServerName='http://192.168.88.21';
 $(window).load(function(){
   $('#Button1').MakeAjaxButton({
      write:    'MB4',
      read:   'in1',
      image:   'Button1_Image'
   });
   $('#Button2').MakeAjaxButton({
      write:    'MB4',
      read:   'Q0.9',
      image:   'Button2_Image'
   });
   $('#Button3').MakeAjaxButton({
      write:    'MB4',
      read:   'Q0.8',
      image:   'Button3_Image'
   });
   $.StartRefreshing();
});
Proszę  o pomoc w rozwiązaniu problemu.
Zapisane

admin

  • Administrator
  • Sr. Member
  • *****
  • Wiadomości: 294
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #1 dnia: Luty 13, 2014, 08:53:26 am »

Witam,

proponuję zacząc od sprawdzenia adresów do zapisu i odczytu. 

Jeśli mają to być 3 różne przyciski, nie jest dla mnie jasne, czemu każdy zapisuje/TAP-uje zmienną MB4.  Po stronie PLC do każdego bloku funkcyjnego sterującego światłem powinna być połączona jakaś zmienna typu BOOL, zapisywana przez system pod jakimś adresem (przykładowo MB0, MB1, albo też MX0.0, MX0.1).  Jeśli tej zmiennej nie ma, lub adres jest właściwy, zapis czegokolwiek będzie niemożliwy i przycisk będzie wyszarzony, jak na załączonym zrzucie z ekranu.

Dla atrybutu 'read' powinien być podany adres pod którym przechowywany jest stan wyjścia, tzn adres, z którego można odczytać, czy żarówka ma być żółta, czy nie.  Na pewno nie będzie to 'in1', jak w załączonym przykładzie.  W pozostałych przyciskach, być może jest ok, ale powinno być QX0.9 (zabrakło X).

Pozdrawiam,
Zapisane

ziutol

  • Newbie
  • *
  • Wiadomości: 11
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #2 dnia: Luty 13, 2014, 10:53:03 pm »

Dziękuje za odpowiedź lecz problem  mam w dalszym ciągu . Myślę , że tym razem konfigurację mam dobrą. Skorzystałem z  plików z załącznika w artykule. moja konfiguracja wygląda następująco:

$('#Button7').MakeTapButton({
      write: 'MB0',               
      read: 'QX0.0',               
      image: 'Button7_Image'         
   });

W załączniku  program i konfiguracja sterownika.
W tym momencie po wciśnięciu przycisku aktywuje się wyjście Q0.0  lecz przycisk nie zmienia stanu na aktywny. Proszę o pomoc co jeszcze mogę mieć nie tak.
Zapisane

admin

  • Administrator
  • Sr. Member
  • *****
  • Wiadomości: 294
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #3 dnia: Luty 14, 2014, 06:09:15 pm »

Cześć,

chyba nie powinno być potrzeby definiować out1, skoro w PLC configuration wyjście QX0.0 jest juz nazwanew out1.  System powinien znać zmienną out1.

Po drugie, skoro wiemy, że konfiguracja jest ok, pojawia się pytanie, czy komunikacja z przeglądarką działa.  Z jakiej przeglądarki korzystasz?  Obecnie - jedyne, co działa to chrome z flagami --disable-web-security (konieczny restart wszystkich instancji chrome).

Pozdrawiam,
Zapisane

ziutol

  • Newbie
  • *
  • Wiadomości: 11
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #4 dnia: Luty 14, 2014, 11:11:39 pm »

Stone ma  na serwerze postawionym na RPI. Testowałem także na  serwerze na laptopie z Windows i krasnalu. sprawdzałem także na tablecie gdzie tan problem nie powinien występować.
Może to jakiś problem z konfiguracją sterownika. Nie wiem czy tam są jakieś ustawienia   wysyłania danych.  Bo jednak zmiana stanu wyjścia następuje niemożna tylko odczytać stanu wyjścia.
Zapisane

ziutol

  • Newbie
  • *
  • Wiadomości: 11
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #5 dnia: Luty 14, 2014, 11:55:59 pm »

Zastanawia mnie jeszcze ten wpis  na stronie konfiguracyjnej sterownika. Nadmieniam że mam wersje firmware nr 20.
Zapisane

ziutol

  • Newbie
  • *
  • Wiadomości: 11
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #6 dnia: Luty 17, 2014, 08:19:19 pm »

Co ciekawe po   skopiowaniu przez ftp plików do sterownika wszystko działa tak jak  powinno.  Jestem bardzo ciekawy jaki jest powód że nie działa uruchamiane z serwera. Może ktośma jakieś sugestie dlaczego tak jest .
Zapisane

dominator

  • Newbie
  • *
  • Wiadomości: 3
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #7 dnia: Grudzień 02, 2014, 10:47:05 pm »

Witam,

Po pierwsze chciałbym się przywitać. Jak większość z was zainspirowanmy stroną Admina postanowiłem przy okazji budowy domu także wyposażyć go w inteligentną instalację. Piszę w kontynuacji tego wątku ponieważ mam ten sam problem. Jak odpalam plik html lokalnie na komórce to nie mam pełnej możliwości sterowania. Jak te same pliki przegram za pomocą FTP na server vago - wszystko działa. Jak odpalam lokalnie to mogę zminić stan wyjścia tylko raz. Przyciks MakeTapbutton powoduje zmianę zmiennej SwitchVisu na True - przez cały czas. To znaczy jak raz kliknę - to zauważyłem że zmienna Switch Visu cały czas jest true. W wgraniu na serwer plc działa standardowo - na chwilę zmienia stan na true po czym powraca na false.

Oczywiście nie działa także po lokalnym odpaleniu zczytywanie artości zmiennej.


Testowałem całość na Samsungu galaxy ace 2- przeglądarki opera, firefox itp - wszędzie to samo. Lokalnie nie działa po wgraniu na serwer ok.

Ma ktoś jakiś pomysł jak to obejść. Jak strony są na serwerze bardzo wolno się odświerzają.

 
Zapisane

admin

  • Administrator
  • Sr. Member
  • *****
  • Wiadomości: 294
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #8 dnia: Grudzień 04, 2014, 09:21:50 am »

Witam,

odpowiedzią chyba jest same-origin policy (http://en.wikipedia.org/wiki/Same-origin_policy) czyli brak możliwości odczytania danych z innej domeny.  Gdy otwierasz stronę html na komputerze lub na telefonie (z pamięci lokalnej) i odpytujesz zdalny serwer, odpowiedź, która przyjdzie nie jest akceptowana przez przeglądarkę. (naciśnij F12 i zobacz raporty błędów w konsoli)  Restrykcje te są od jakiegoś czasu egzekwowane również na telefonach.

Czyli:

- wgrasz na Wago, uruchamiasz stronę z WAGO, jej origin to WAGO, zapytania idą do WAGO - wszystko działa
- uruchamiasz lokalnie, pytasz WAGO - odpowiedzi są odrzucane.

Odrzucane są odpowiedz, co znaczy, że nic się nie da z WAGO odczytać.  Da się wysłać informacje, dlatego też da się jeden raz przełączyć światło.  Potem jednak skrypt się gubi, bo zapytanie $.ajax nigdy nie wykona funkcji success:...

Jako że nie mamy możliwości zmodyfikować odpowiedzi WAGO tak, by spełniało wymagania CORS (http://en.wikipedia.org/wiki/Cross-origin_resource_sharing), nie da się w tym zakresie za wiele zrobić.  Trzeba więc:
- uruchomić chrome z opcją nie egzekwowania same-origin policy (http://stackoverflow.com/questions/3102819/disable-same-origin-policy-in-chrome)
- testować pliki wgrane na WAGO
- używać pośrednika w postaci małego serwera (np RPi), który będzie przekazywał ruch do/z WAGO (http://www.edom-plc.pl/index.php/pl/wiecej-o-plc/wizualizacje-html/84-przekierowanie-przez-php)
- opakowywać strony html  wewnątrz 'aplikacji' które nie egzekwują single-origin policy, jak np. aplikacje dla chrome (http://www.edom-plc.pl/index.php/pl/wiecej-o-plc/sterowanie/172-aplikacja-dla-google-chrome) lub aplikacje na androida opakowywane przez phonegap.

Pozdrawiam,
Zapisane

dominator

  • Newbie
  • *
  • Wiadomości: 3
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #9 dnia: Grudzień 30, 2015, 11:52:27 am »

Witajcie

1) Podziękowania dla Admina za szczegółowe informacje.

2) Google chrom udało mi się uruchomić z opcją - disable web seciurity . I na kompie z Win działa wszystko super.

3) Mam nadal problem z uruchomieniem całości poprzez przeglądarkę z android z telefonu. Tak naprawdę do sterowania używam tylko telefonu. Z komputera w zasadzie nie korzystam. Stąd chciałbym uruchomić wizualizację na androidzie. Obecnie mam wgrane pliki na Wago. Wizualizacja działa. Jednak prędkość przełączania pomiędzy stronami pozostawia wiele do życzenia. Poprostu trzeba czekać aż całość się załaduje.

4) Próbowałem odpalić całośc przed phonegap- niesstety nie umiem tgego zrobić.

5) Czytałem o jakiś mykach w programwowaniu:

http://stackoverflow.com/questions/11318703/access-control-allow-origin-error-at-android-4-1

Niestety nie wiem gdzie to wkleić aby zadziałało. Minęło trochę czasu, może są jakieś proste metody aby wizualizacja poszła na androidzie?

dominator


Zapisane

admin

  • Administrator
  • Sr. Member
  • *****
  • Wiadomości: 294
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #10 dnia: Grudzień 30, 2015, 02:17:12 pm »

Cześć,

a próbowałeś https://build.phonegap.com?



Zapisane

dominator

  • Newbie
  • *
  • Wiadomości: 3
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #11 dnia: Grudzień 30, 2015, 06:20:57 pm »

Próbowałem zgodnie z tą instrukcją : http://michalorman.pl/blog/2010/04/wieloplatformowe-frameworki-mobilne-phonegap/

ale nie idzie mi.

Może jest jakiś prosty sposób jak zrobić aby działało na androidzie. Tak jak to jest dla chrome na windows, albo coś dodać w kodzie?

dominator
Zapisane

admin

  • Administrator
  • Sr. Member
  • *****
  • Wiadomości: 294
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #12 dnia: Grudzień 30, 2015, 07:49:56 pm »

...no tak, ale ten opis zakłada instalowanie Eclipse.  Dlatego proponuję stronę Adobe'a, którą zamieściłem ostatnio.  Wszystko robi się szybko.  Projekt strony html + 1 plik konfiguracyjny xml i tyle.  W razie pytań jest dokumentacja:

http://docs.build.phonegap.com/en_US/#googtrans(pl)

Pozdrawiam,
Zapisane

Tom01

  • Full Member
  • ***
  • Wiadomości: 101
    • Zobacz profil
Odp: Problem z przyciskami w wizualizacji html.
« Odpowiedź #13 dnia: Wrzesień 09, 2016, 11:06:10 am »

- testować pliki wgrane na WAGO
- używać pośrednika w postaci małego serwera (np RPi), który będzie przekazywał ruch do/z WAGO (http://www.edom-plc.pl/index.php/pl/wiecej-o-plc/wizualizacje-html/84-przekierowanie-przez-php)

Korzystając z gotowych skryptów, jeśli wrzucę poniższe na webserv sterownika i stamtąd go wywołam, działa. Oczywiście, umieszczony na osobnym serwerze www, ze względu na single-origin-policy, nie działa.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.min.js"></script>
<script type="text/javascript">


var ServerName = "http://192.168.0.61/"; //change to your PLC's IP

$(document).ready(function() {


$('#Button1').click(function() {
$.ajax({
type: 'POST',
url: ServerName+"READPI",
crossDomain: true,
data: {ADR: 'QX1.0', FORMAT: "%d"},
success: function(data){$('#Result').append(data);},
error: function(jqXHR, textStatus, errorThrown) { alert (jqXHR.statusText+', '+textStatus+', '+errorThrown);}
}); //End of AJAX
});
$('#Status').bind("ajaxSend", function() {$(this).append('Query sent, ');});
$('#Status').bind("ajaxError", function() {$(this).append('Ajax Error, ');});
$('#Status').bind("ajaxSuccess", function() {$(this).append('Success, ');});
$('#Status').bind("ajaxComplete", function() {$(this).append('Ajax Finished!');});
});
</script>
<style type="text/css">
.Button {height: 30px; width: 300px; border: gray dotted 2px; padding: 2px;} 
 </style>
 
</head>
<body>
<Div id ="Button1" class="Button"> Click Me! </div>
<Div id ="Status" class="Button">  </div>
<Div id ="Result" class="Button">QX0.0: </div>
</Body>
</Html>

Admin się naprodukował aby opisać obejście single-origin-policy. Jeśli zastosuję proponowane rozwiązanie, wrzucę oba poniższe pliki na serwer www, niestety skrypt nie działa. Żadnej reakcji na klik.

<html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
 
    <script type="text/javascript"><br>
        $(document).ready(function() {<br>
            $('#Button1').click(function() { //action on the button click<br>
                var address = $('#address').text().replace(/ /g,''); //take the address from the filed and trim all spaces<br>
                $.ajax({
                    type: 'POST',
                    url: 'getData.php',
                    data: {ADR: address}, //send to the PHP file the address<br>
                    success: function(data){ //what to do if data received
                        if (data.charAt(0) == '<') { //if reply starts with "<" it means that the address was wrong, and WAGO returns structured html
                            $('#Result').html(data.substring(4)); //show the WAGO message but without the initial "<br>"
                        }
                        else { //otherwise the data received is what we wanted
                            $('#Result').text('Reply: ' + address + ': ' + data); //show the result
                        }
                    },<br>
                    error: function(jqXHR, textStatus, errorThrown) { //in case of connection error, print whatever you can get from the server
                        $('#Result').text(jqXHR.statusText+', '+textStatus+', '+errorThrown);
                    }
                }); //End of AJAX
            }); //End of Button.click()
        }); //End of document.ready()<br>
    </script><br>
    <style type="text/css">
        .Button {height: 30px; width: 300px; border: gray dotted 2px; padding: 2px; text-align: center; line-height: 30px;}
    </style><br>
</head>
<body>
    <div id="addressField" style="width: 300px;"> Address to check: <div id="address" contenteditable="true" style="float: right; border: 1px solid black">QX1.0</div></div>
    <br>
    <div id ="Button1" class="Button">Click to read!</div>
    <br>
    <div id ="Result" class="Button"></div>
</body>
</html>

<?php
    
if(isset($_POST['ADR'])) {
        
$url "http://192.168.0.61/READPI"//change the IP to your WAGO's IP
        
$data = array('ADR' => $_POST['ADR'], 'FORMAT' => '%d');
 
        
$options = array(
            
'http' => array(
                
'header' => "Content-type: application/x-www-form-urlencoded\r\n",
                
'method' => 'POST',
                
'content' => http_build_query($data)
            ),
        );
 
        
$context stream_context_create($options);
        
$result file_get_contents($urlfalse$context);
 
        echo 
$result;
    }
?>


Jak to diagnozować? Niestety, o ile z php sobie radzę, to programowanie js to czarna magia.
« Ostatnia zmiana: Wrzesień 09, 2016, 11:10:50 am wysłana przez Tom01 »
Zapisane