Archief - web widget (AJAX form), hoe embedden?

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
f

forloRn_

Legacy Member
Goeiemorgen,

Er werd me gevraagd om een generiek web widget te maken dat je kan embedden in andere pagina's. Het gaat hier om een eenvoudige form die naast de gebruikelijke naam, voornaam, e-mail enzovoort ook een file uploadet. Er hoort ook een progress bar bij en je moet de upload ook kunnen cancellen.

Met behulp van een JQuery plugin was die form een fluitje van een cent, en hij werkt als standalone pagina. Het probleem situeert zich nu bij het embedden ervan: hoe doe je dat precies? De manier waarop maakt weinig uit maar ik heb weinig ervaring met front-end development dus ik weet niet hoe je dit typisch doet.

Ik heb het al met een iframe geprobeerd, maar de iframe zelf stylen zodanig dat je niet ziet dat het een iframe is (à la HTML 5 seamless), is me nog niet gelukt (laatste Chrome en alleen CSS geprobeerd). De style van de inhoud is een andere kwestie: kan het iframe de style van de hoofdpagina overerven? Kan je überhaupt vanuit de hoofdpagina de inhoud van een iframe stylen? Cross-browser?

De tweede manier waarop ik heb geprobeerd heb is met een JQuery load om het widget met AJAX binnen te halen en in de DOM te stoppen. Dat werkte, maar blijkbaar enkel wanneer widget (dat nu een onderdeel wordt van de hoofdpagina) en backend zich op hetzelfde domain bevinden, wat hier niet het geval zal zijn.

Kan iemand me hier wat op weg zetten?

Merci!
a

adrianhates

Legacy Member
includen in je pagina met PHP lijkt me een goede optie.
Je moet zien dat alles qua functionaliteit ( javascript ) daar dan ook wordt opgeroepen..
f

forloRn_

Legacy Member
't Is geen PHP, maar dat terzijde. Dit helpt toch niet met de file upload? Widget en back-end zitten nog altijd in verschillende domains.
a

adrianhates

Legacy Member
wat heeft dat er mee te maken dat het geen PHP is? Uw site bouwt ge toch ook ni pagina voor pagina op door te kopiëren van een andere pagina? :) Een iframe om iets te includen dat op uw eigen site domein staat en puur code is is trouwens sowieso een slecht idee :)
b

bealzebub

Legacy Member
Als je klant controle over de webserver heeft die die widget host (dus niet bij jou, maar wel op het domein dat de widget op de pagina zal tonen!), dan kan je CORS gebruiken. Als CORS actief is kan je AJAX requests naar een ander domein doen niettegenstaande de Same-Origin-Policy.

Pas op, de "headers" module van Apache moet wel geactiveerd zijn daarvoor!

Code: 
a2enmod headers

In je Apache conf file (niet in .htaccess, werkt dacht ik gewoon nie):

Code: 
  Header set Access-Control-Allow-Origin "*"
  Header set Access-Control-Allow-Headers "X-Requested-With, Authorization"
  Header set Access-Control-Allow-Methods "POST, GET, PUT, DELETE, OPTIONS"

Eventueel de allowed headers bijsturen.

Als je de CORS access wil beperken tot een select aantal domains, moet het er zo uit zien:

Code: 
  Setenvif Origin http://toegelaten.domein1.be AccessControlAllowOrigin=http://toegelaten.domein1.be
  Setenvif Origin http://toegelaten.domein2.be AccessControlAllowOrigin=http://toegelaten.domein2.be
  Setenvif Origin http://toegelaten.domein3.be AccessControlAllowOrigin=http://toegelaten.domein3.be
  Header set Access-Control-Allow-Origin %{AccessControlAllowOrigin}e env=AccessControlAllowOrigin
  Header set Access-Control-Allow-Headers "X-Requested-With, Authorization"
  Header set Access-Control-Allow-Methods "POST, GET, PUT, DELETE, OPTIONS"
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan