Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> advAJAX i przesyłanie plików
Edric
post
Post #1





Grupa: Zarejestrowani
Postów: 16
Pomógł: 0
Dołączył: 23.04.2007

Ostrzeżenie: (0%)
-----

Witam.
Staram się w swoim projekcie zastosować przesyłanie plików na serwer bez przeładowywania strony. Chciałem do tego wykorzystać bibliotekę advAJAX. Kod na którym eksperymentuje, wygląda następująco:

formularz.html:
[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
  4. <script type="text/javascript" src="advajax.js"></script>
  5.  
  6. <script type="text/javascript"> 
  7.  
  8. window.onload = przeslij;
  9.  
  10. function przeslij() 
  11. {
  12.  advAJAX.assign(document.getElementById("form_1"), {  
  13.      onSuccess : function(obj) {
  14.      document.getElementById("info").innerHTML = obj.responseText;
  15.      }
  16.  });
  17. }
  18. </script>
  19. </head>
  20.  
  21. <body>
  22.  
  23. <form method="post" enctype="multipart/form-data" action="plik.php" id="form_1">
  24. Plik:<br />
  25. <input type="file" name="nazwa" /><br />
  26. <input type="submit" value="OK" />
  27. </form>
  28.  
  29. <span id="info" style="display: block"></span>
  30.  
  31. </body>
  32. </html>
[HTML] pobierz, plaintext


plik.php:
[PHP] pobierz, plaintext 
  1. <?
  2. var_dump($_FILES);
  3. ?>
[PHP] pobierz, plaintext



Wywołanie window.onload = przeslij; sprawia, że obsługę formularza przejmuje advAJAX. Gdy wywołanie to jest aktywne, to jako odpowiedź otrzymuję: "array(0) { }",
czyli php nie stwierdziło żadnych plików do przesłania. Gdy wywołanie window.onload = przeslij; usuwam, formularz obsługiwany jest standardowo i po otwarciu nowej strony mam:

array(1) { ["username"]=> array(5) { ["name"]=> string(15) "Clipboard01.jpg" ["type"]=> string(10) "image/jpeg" ["tmp_name"]=> string(74) "C:\Documents and Settings\Edric\Ustawienia lokalne\Temp\php218.tmp" ["error"]=> int(0) ["size"]=> int(250548) }

czyli formularz działa prawidłowo. Wygląda na to, że advAJAX nie potrafi obsługiwać przesyłania plików.. albo ja robie coś źle. I tu pytanie - co zrobić żeby to zadziałało? Dodam jeszcze, że jeśli zmienię typ input na 'text', i sprawdzę zmienną $_POST po przesłaniu za pomocą advAJAX to wszystko działa dobrze.

Może zna ktoś jakiś inny obiekt AJAX, który pomógłby mi to zrealizować?

Próbowałem problem rozwiązać w inny sposób, ale na drodze stanęła mi Opera i jej obsługa inputów dla plików (pytanie na ten temat również znajduje się na forum.

Bardzo proszę o pomoc, bo naprawdę nie wiem jak ten problem rozwiązać.

Niestety nie wiem, jak to wygląda z advAJAX, ale znalazłem coś co prawdopodobnie rozwiązuje ten problem:

http://en.dklab.ru/lib/JsHttpRequest/" title="Zobacz w manualu PHP" target="_manual

Ten post edytował Edric 10.06.2008, 14:58:53
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 6)
sowiq
post
Post #2





Grupa: Zarejestrowani
Postów: 1 890
Pomógł: 339
Dołączył: 14.12.2006
Skąd: Warszawa

Ostrzeżenie: (0%)
-----

NIestety, ale AJAX jak i cała JavaScript nie obsługuje przesyłania plików. Jeśli zależy Ci na przesyłaniu formularza z plikiem bez przeładowania strony, musisz zastosować ukrytą ramkę (np 1px x 1px) i do niej normalnie submitować formularz.
Go to the top of the page
+Quote Post
simple programme...
post
Post #3





Grupa: Zarejestrowani
Postów: 74
Pomógł: 5
Dołączył: 17.07.2007
Skąd: Krakow

Ostrzeżenie: (0%)
-----

Nie działa, bo w ten sposób normalnie mógłbyś przeglądać sobie kompa użytkownika, a tego byś jako przeglądający przecież nie chciał.
Go to the top of the page
+Quote Post
Edric
post
Post #4





Grupa: Zarejestrowani
Postów: 16
Pomógł: 0
Dołączył: 23.04.2007

Ostrzeżenie: (0%)
-----

Cytat(sowiq @ 10.06.2008, 18:28:56 ) *
NIestety, ale AJAX jak i cała JavaScript nie obsługuje przesyłania plików. Jeśli zależy Ci na przesyłaniu formularza z plikiem bez przeładowania strony, musisz zastosować ukrytą ramkę (np 1px x 1px) i do niej normalnie submitować formularz.


Ajax czy też JS jako taki nie. Ale jak widać w moim przykładowym kodzie, AJAX potrafi wywoływać asynchroniczie kod PHP, który wysyłaniem plików spokojnie może się zająć (do tego ma przecież zmienną $_FILES). No i istnieje coś takiego jak <input type='file'/> co pozwala na pobranie nazwy pliku z dysku lokalnego za pomocą przeglądarki. Problem tkwił w tym, że biblioteka, z której korzystałem (advAJAX) akurat z przesyłaniem plików sobie nie radzi. Niemniej znalazłem bibliotekę która to umożliwia - http://en.dklab.ru/lib/JsHttpRequest . Jak znajdę chwilę czasu to wrzucę tu kod pozwalający z jej pomocą na kopiowanie plików na serwer bez przeładowywania strony i bez ukrytych ramek.

Cytat(simple programmer @ 10.06.2008, 19:38:40 ) *
Nie działa, bo w ten sposób normalnie mógłbyś przeglądać sobie kompa użytkownika, a tego byś jako przeglądający przecież nie chciał.


Niestety nie rozumiem... Kod który piszę, ma pozwalać na przesłanie pliku z dysku lokalnego na serwer, bez przeładowania strony. Przeglądanie własnego dysku, to chyba nie problem - umożliwia to input z type='file'.

Ten post edytował Edric 11.06.2008, 12:30:06
Go to the top of the page
+Quote Post
wlamywacz
post
Post #5





Grupa: Zarejestrowani
Postów: 535
Pomógł: 27
Dołączył: 3.05.2005

Ostrzeżenie: (20%)
X----

Nie zrobisz tego w ten sposób po prostu - względy bezpieczeństwa. Jedyna opcja to perl itp.

P.S. Słyszałem że ustawiając specjalnie FF można to wykonać ale to jak robisz tylko dla siebie.
Go to the top of the page
+Quote Post
Edric
post
Post #6





Grupa: Zarejestrowani
Postów: 16
Pomógł: 0
Dołączył: 23.04.2007

Ostrzeżenie: (0%)
-----

Cytat(wlamywacz @ 12.06.2008, 23:07:20 ) *
Nie zrobisz tego w ten sposób po prostu - względy bezpieczeństwa. Jedyna opcja to perl itp.

P.S. Słyszałem że ustawiając specjalnie FF można to wykonać ale to jak robisz tylko dla siebie.


Ale czemu względy bezpieczeństwa? Przecież przesyłanie plików na serwer to normalna sprawa - po to jest input type=file, po to jest m.in. POST, po to jest zmienna $_FILES w PHP. Jedyne co ja chcę zmienić, to wysyłać te pliki bez przeładowania strony.

Zresztą - działa mi to. Poniżej wrzucam kod dla pliku html oraz php. W html są tylko najważniejsze rzeczy - skrypt i formularz. <body> itp sobie darowałem;).

user.html:
[HTML] pobierz, plaintext 
  1. <script src="JsHttpRequest.js"></script>
  2. <script type="text/javascript" language="JavaScript">
  3. function doLoad(value) {
  4.     // Create new JsHttpRequest object.
  5.     var req = new JsHttpRequest();
  6.     // Code automatically called on load finishing.
  7.     req.onreadystatechange = function() {
  8.         if (req.readyState == 4) {
  9.             // Write result to page element (_RESULT becomes responseJS). 
  10.             document.getElementById('result').innerHTML = 
  11.                 '<b>MD5("'+req.responseJS.q+'")</b> = ' +
  12.                 '"' + req.responseJS.md5 + '"<br> ';
  13.             // Write debug information too (output becomes responseText).
  14.             document.getElementById('debug').innerHTML = req.responseText;
  15.         }
  16.     }
  17.     // Prepare request object (automatically choose GET or POST).
  18.     req.open(null, 'serw.php', true);
  19.     // Send data to backend.
  20.     req.send( { q: value } );
  21. }
  22. </script>
  23.  
  24. <!-- Please note that we must specify enctype to multipart/form-data! -->
  25. <form method="post" enctype="multipart/form-data" onsubmit="return false">
  26.     File: <input type="file" name="upl">
  27.     <input type="button" value="Wyślij" 
  28.       onclick="doLoad(this.form.upl)">
  29. </form>
  30.  
  31. <div id="result" style="border:1px solid #000; padding:2px">
  32.     Structured results
  33. </div>
  34. <div id="debug" style="border:1px dashed red; padding:2px">
  35.     Debug info
  36. </div>
[HTML] pobierz, plaintext


serw.php
[PHP] pobierz, plaintext 
  1. <?php
  2. // Load JsHttpRequest backend.
  3. require_once "JsHttpRequest.php";
  4. // Create main library object. You MUST specify page encoding!
  5. $JsHttpRequest =& new JsHttpRequest("UTF-8");
  6. // Store resulting data in $_RESULT array (will appear in req.responseJs).
  7. $GLOBALS['_RESULT'] = array(
  8.   "q"	 => 'file ' . $_FILES['q']['name'],
  9.   "md5"   => md5(@file_get_contents($_FILES['q']['tmp_name'])),
  10. ); 
  11.  
  12. $file= $_FILES['q']['tmp_name'];
  13. $zapisz_jako = $_FILES["q"]["name"];
  14. copy($file, $zapisz_jako);
  15.  
  16. // Below is unparsed stream data (will appear in req.responseText).
  17. ?>
  18. <pre>
  19. <b>Uploaded files:</b> <?=print_r($_FILES, 1)?>
  20. </pre>
[PHP] pobierz, plaintext


Oczywiście wymagane są pliki JsHttpRequest.js oraz JsHttpRequest.php - wszystko na stronie http://en.dklab.ru/lib/JsHttpRequest/

Mi całość działa w Operze, FF i IE7. W FF nie włączałem żadnych specjalnych opcji - lecę na standardowych ustawieniach.
Go to the top of the page
+Quote Post
protheo
post
Post #7





Grupa: Zarejestrowani
Postów: 1
Pomógł: 0
Dołączył: 10.12.2009

Ostrzeżenie: (0%)
-----

Cytat(Edric @ 11.06.2008, 12:17:43 ) *
Ajax czy też JS jako taki nie. Ale jak widać w moim przykładowym kodzie, AJAX potrafi wywoływać asynchroniczie kod PHP, który wysyłaniem plików spokojnie może się zająć (do tego ma przecież zmienną $_FILES). No i istnieje coś takiego jak <input type='file'/> co pozwala na pobranie nazwy pliku z dysku lokalnego za pomocą przeglądarki. Problem tkwił w tym, że biblioteka, z której korzystałem (advAJAX) akurat z przesyłaniem plików sobie nie radzi. Niemniej znalazłem bibliotekę która to umożliwia - http://en.dklab.ru/lib/JsHttpRequest . Jak znajdę chwilę czasu to wrzucę tu kod pozwalający z jej pomocą na kopiowanie plików na serwer bez przeładowywania strony i bez ukrytych ramek.



Niestety nie rozumiem... Kod który piszę, ma pozwalać na przesłanie pliku z dysku lokalnego na serwer, bez przeładowania strony. Przeglądanie własnego dysku, to chyba nie problem - umożliwia to input z type='file'.



Widzisz i tu właśnie się mylisz gdybyś przeczytał specyfikację i zaglądnął do kodu z pliku, który podajesz niżej czyli: JsHttpRequest.js, to zobaczyłbyś że tak naprawdę ta biblioteka działa na zasadzie automatycznego wyboru rozwiązania uploadu dla przesyłanych danych. W przpadku plików tworzone jest rozwiązanie w oparciu właśnie o iframe: "Automatic choice of the best AJAX realization (XMLHttpRequest, <script>, <IFRAME>)."

Tak jak pisali wszyscy powyżej niestety nie ma możliwości załadować pliku za pomocą JavaScript, naprawdę długo szukałem takiego rozwiązania.

Wracając do JSHttpRequest i IFRAME poniżej fragmenty z pliku JSHttpRequest.js:

" * This library tries to use XMLHttpRequest (if available), and on
* failure - use dynamically created <script> elements. Backend code
* is the same for both cases. Library also supports file uploading;
* in this case it uses FORM+IFRAME-based loading."
.
.
.

" // Create invisible IFRAME with temporary form (form is used on empty queryElem).
var div = document.createElement('DIV');

var ifname = 'jshr_i_' + id;
"

Z tego co udało mi się ustalić (a i pewnie i to nie jest do końca takie pewne) to są 4 sposoby przesyłania plików bez przeładowania strony:

1. swfupload - czyli upload realizowany z poziomu flasha (podobno nie działa w 10 wersji flash - ale tego nie sprawdzałem),

2. form+ifrme - w sumie kilka sposobów realizacji ale idea generalnie taka sama - form ładowany do iframe,

3. jQuery - tu nie jestem pewien bo to teoretycznie biblioteka JavaScript więc niby też powinien być iframe ale w to się nie zagłębiałem.,

4. Przeładowanie całej strony po uploadzie (pokaz miniatury wykonuje skrypt php w oparciu o zmienne sesji lub zmienne JavaScript, który generuje pierwotny form do wprowadzania danych).

Jeżeli są jakieś inne rozwiązania bardzo chętnie je poznam i na ich temat porozmawiam (IMG:style_emoticons/default/smile.gif) w razie czego proszę na priv.

Pozdrawiam
Go to the top of the page
+Quote Post
« Następny starszy · XML, AJAX · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 23.08.2025 - 12:39
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn