Forum Mjukvara Programmering och digitalt skapande Tråd Inlägg

load() i jQuery - fast ladda mot en extern sida?

1
Skriv svar
Permalänk
Medlem
●

load() i jQuery - fast ladda mot en extern sida?

Tjena

Hur gör jag om jag vill ha samma funktionallietet som load() har i jquery fast mot en extern sida.
Jag vill alltså kunna skicka parametrar (POST/GET) till en extern sida via jquery (js).

Resultatet av målsidan ska sen kunna laddas in i en div, precis som man kan med load().

Är inte JSON rätt sak för detta?

Hoppas ni hängde med och att ni kan hjälpa mig.

Senast redigerat
Visa signatur

iPhone

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Citat:

Ursprungligen inskrivet av xarph
Tjena

Hur gör jag om jag vill ha samma funktionallietet som load() har i jquery fast mot en extern sida.
Jag vill alltså kunna skicka parametrar (POST/GET) till en extern sida via jquery (js).

Resultatet av målsidan ska sen kunna laddas in i en div, precis som man kan med load().

Hoppas ni hängde med och att ni kan hjälpa mig.

Jag är inte helt säker men förbjuder inte Firefox detta? Det går inte att göra sin egna sida och sen kalla på sweclockers.com. Tror inte det bara är firefox utan även nyare IE. Detta för att höja säkerheten på något vis.

Rätta mig om jag har fel.

Visa signatur

ηλί, ηλί, λαμά σαβαχθανί!?

Redigera
Citera flera Citera
Permalänk
Medlem
●

Om det bara ska fungera i Internet Explorer eller på samma domän är det bara att använda $.get();

Men för t.ex. Firefox, som inte tillåter cross-site-scripting, måste man hitta på en annan lösning. Problemet är alltså att Firefox säger ifrån när ett JS anropar någonting utanför sin egna domän.

Det enklaste och vanligaste är då att man skapar en enkel PHP-fil som hämtar sidan och returnerar den till ditt JavaScript. T.ex. såhär:

$.get('minLillaWebService.php?sida=' + enURI, funtion(result){
    var minHamtadeDiv = $(result).find('#enDiv');
});
Visa signatur

På SoundCloud | Fästmöns galleri

Redigera
Citera flera Citera
Permalänk
Medlem
●
var exempelurl = "http://example.se/blogg.php?bloggid=<?php print $_GET['id']; ?>&url=" + escape(encodeURI($("#url").val())) + "&text=" + escape(encodeURI($("#text").val())) +"&jsoncallback=?";
        
	$.getJSON(exempelurl, function(data) {
		
		$("#skickat").html(data.mes);
	});

Har en div som har ID "skickat" där resultatet ska komma, men det kommer ingenting där... förstår inte vad som är fel.

URLen anropas korrekt, men jag får inget meddelande i "skickat"-diven.

Visa signatur

iPhone

Redigera
Citera flera Citera
Permalänk
Medlem
●

Vad får du om du kör alert(data); istället då?

Visa signatur

På SoundCloud | Fästmöns galleri

Redigera
Citera flera Citera
Permalänk
Medlem
●
Citat:

Ursprungligen inskrivet av azoapes
Vad får du om du kör alert(data); istället då?

Får ut [object Object] i en alert-ruta.

Visa signatur

iPhone

Redigera
Citera flera Citera
Permalänk
Medlem
●

Ja då verkar det ju funka. Du kan sätta en breakpoint och inspektera objektet i FireBug om du har det... plugin till Firefox.

Visa signatur

På SoundCloud | Fästmöns galleri

Redigera
Citera flera Citera
Permalänk
Medlem
●

Nu har jag fått det att fungera i FireFox men det fungerar inte i IE eller Chrome. Vad kan vara fel?

 			var exampleurl = "http://example.se/blogg_send.php?blogid=<?php print $_GET['id']; ?>&url=" + url + "&text=" + text +"&jsoncallback=?";
					
				$.getJSON(exampleurl, function(data) {
					
					$("#skickat").html(data.msg);
				});

Sen har vi en ruta med 2-3 st klicklänkar där man nog kan lösa hide/show på ett bättre sätt. Kan någon ge förslag? Tack.

	$sat("#example_ruta").html(blogbox);

	$sat("#write").click(function () {

		$sat("#send").show();
		$sat("#write").hide();
		$sat("#back").hide();		

		$sat("#skriv").show();
		$sat("#msg").hide();
		$sat("#works").hide();
		$sat("#skickat").hide();

	});

	$sat("#send").click(function () {		
		
		$sat("#back").show();
		$sat("#write").hide();
		$sat("#send").hide();

		$sat("#skickat").show();
		$sat("#skriv").hide();
		$sat("#msg").hide();
		$sat("#works").hide();
	
	$sat("#work").click(function () {

		$sat("#back").show();
		$sat("#write").hide();
		$sat("#send").hide();

		$sat("#works").show();
		$sat("#skriv").hide();
		$sat("#msg").hide();
		$sat("#skickat").hide();
	});

	$sat("#back").click(function () {

		$sat("#write").show();
		$sat("#send").hide();
		$sat("#back").hide();

		$sat("#msg").show();
		$sat("#skriv").hide();
		$sat("#works").hide();
		$sat("#skickat").hide();
	});

});
Senast redigerat
Visa signatur

iPhone

Redigera
Citera flera Citera
Permalänk
Medlem
●

Sitter du med IE8 så kan du trycka F12 och köra igång den debuggern(breaks, kolla värdena etc) för att se om du hittar några konstigheter.

Redigera
Citera flera Citera
Permalänk
Medlem
●

Nu har jag fått det att fungera i IE8. Det var några HTML-element som inte var stängda ordentligt.

Men funktionaliteten fungerar varken i Safari eller Chrome. Någon som har någon idé om varför? Ingenting anropas.

Visa signatur

iPhone

Redigera
Citera flera Citera
Permalänk
Medlem
●

Har du validerat koden? http://validator.w3.org/#validate_by_input
Ligger javascriptet efter alla element som används? Kan bli lite problem om du försöker använda javascript som försöker anropa elementet som det ligger i.

Redigera
Citera flera Citera
Permalänk
Medlem
●

Ja, koden är mer eller mindre validerad. Men går inte "validera" JS-kod.

Här är JS-koden:

	var blogid = 1;
	var blogbox = 'HTML-KOD här';

if (typeof(jQuery) == 'undefined')
{
	var $sat = jQuery.noConflict();
}
else
{
	var $sat = $;
}

jQuery(document).ready(function() {

	$sat("#ex_ruta").html(blogbox);

	$sat("#write").click(function () {

		$sat("#send").show();
		$sat("#write, #back").hide();	

		$sat("#skriv").show();
		$sat("#msg, #works, #skickat").hide();

	});

	$sat("#send").click(function () {		
		
		$sat("#back").show();
		$sat("#write, #send").hide();

		$sat("#skickat").show();
		$sat("#skriv, #msg, #works").hide();

		var url = $sat("#url").val();
		var text = $sat("#text").val();
		
			var exurl = "http://ex.se/blogg_send.php?blogid=1&url=" + url + "&text=" + text +"&callback=?";
					
				$sat.ajaxSetup({ scriptCharset: "utf-8" , contentType: "application/json; charset=utf-8"});
				$sat.getJSON(exurl, function(data) {					
					
					$sat("#skickat").html(data.msg);
				});
	});
	
	$sat("#work").click(function () {

		$sat("#back").show();
		$sat("#write, #send").hide();

		$sat("#works").show();
		$sat("#skriv, #msg, #skickat").hide();
	});

	$sat("#back").click(function () {

		$sat("#write").show();
		$sat("#send, #back").hide();

		$sat("#msg").show();
		$sat("#skriv, #works, #skickat").hide();
	});

});
Senast redigerat
Visa signatur

iPhone

Redigera
Citera flera Citera
Permalänk
Medlem ★
●

för ett otränat öga, ser din kod lite underlig ut eftersom du definierar variablen $sat inne i ett if/else-block. jag kan tänka mig att det är odefinierat när/var/hur du har tillgång till den variabeln. mitt förslag är att definiera den utanför din kontroll och tilldela den i blocken.

var $sat;
if (typeof(jQuery) == 'undefined')
{
    $sat = jQuery.noConflict();
}
else
{
    $sat = $;
}

som en parentes, så tycker jag att det känns lite underligt att kontrollera existensen av jQuery och sedan använda objektet ändå... borde inte följande räcka?

var $sat = jQuery.noConflict();

$sat(document).load(
    // function(){} osv...
);
Visa signatur

as far as we can tell, the massacre went well...

Redigera
Citera flera Citera
Permalänk
Medlem
●
Citat:

Ursprungligen inskrivet av jovnas
för ett otränat öga, ser din kod lite underlig ut eftersom du definierar variablen $sat inne i ett if/else-block. jag kan tänka mig att det är odefinierat när/var/hur du har tillgång till den variabeln. mitt förslag är att definiera den utanför din kontroll och tilldela den i blocken.

var $sat;
if (typeof(jQuery) == 'undefined')
{
    $sat = jQuery.noConflict();
}
else
{
    $sat = $;
}

som en parentes, så tycker jag att det känns lite underligt att kontrollera existensen av jQuery och sedan använda objektet ändå... borde inte följande räcka?

var $sat = jQuery.noConflict();

$sat(document).load(
    // function(){} osv...
);

Jag utförde dessa ändringar, men fortfarande samma sak i Safari och Chrome

Tack ändå.

Visa signatur

iPhone

Redigera
Citera flera Citera
Permalänk
Medlem
●

Skälet till att jag frågade om du validerat var eftersom att du påpekade att du hade några element som du inte avslutat. Javascripten är ganska beroende av att kunna hitta i dokumentet så...

Men i vilket fall, bara att dra igång debuggern som finns i chrome/safari. Ska vara inbyggd i dom också om jag inte minns fel. Om du inte hittar det så är det bara att sätta dit alerts och se var det tar stopp

Redigera
Citera flera Citera
Permalänk
Medlem
●

Nu har vi testat lite och det verkar som att problemet i Chrome/Safari försvinner när man kör koden ovan lokalt (eller på samma domän). Dock är det meningen att denna koden ska köras på olika domäner, och ska göra anrop till vår domän.

Är det någon som har en aning varför det är såhär? Ska inte getJSON fungera mellan olika domäner?

Det märkliga är att det fungerar korrekt i IE och FireFox men sätter stopp i Chrome/Safari. Men kör vi som sagt koden på samma domän så fungerar det...

Visa signatur

iPhone

Redigera
Citera flera Citera
Permalänk
Medlem
●
Citat:

Ursprungligen inskrivet av xarph
Är det någon som har en aning varför det är såhär? Ska inte getJSON fungera mellan olika domäner?

Som sagt så är det säkert någon säkerhetsdetalj som spökar där. Tror inte att det ska gå att köra någon form av requests mellan domäner sådär. Varför Firefox och IE tillåter det vet jag inte.

Visa signatur

Blogg. Webboken. Pinboard, Last.fm, Facebook, Kongregate. W3fools.
Validera din HTML, men skryt inte om att du gör det.
Använd HTML5 och kom ihåg semantiken!

Redigera
Citera flera Citera
Permalänk
Medlem
●
Citat:

Ursprungligen inskrivet av You
Som sagt så är det säkert någon säkerhetsdetalj som spökar där. Tror inte att det ska gå att köra någon form av requests mellan domäner sådär. Varför Firefox och IE tillåter det vet jag inte.

Har tittat på ett par andra sidor också som kör getJSON och där verkar det fungera i Chrome/Safari, och dom kör mellan olika domäner.

Denna koden är från Bloglovin.com:

	var bk_buyurl = "http://www.bloglovin.com/ajax/spotlight.add.php?n=2101&bloggu..." + escape(encodeURI($bk("#bk_input_blogaddress").val())) + "&m=" + escape(encodeURI($bk("#bk_input_text").val())) +"&jsoncallback=?";
        
	$bk.getJSON(bk_buyurl, function(data) {
		$bk("#bk_spotlight_buy").html(data.mes);
	});

Och vår kod ser väldigt lik ut men funkar inte...

Senast redigerat
Visa signatur

iPhone

Redigera
Citera flera Citera
Permalänk
Medlem
●
Citat:

Ursprungligen inskrivet av xarph
Och vår kod ser väldigt lik ut men funkar inte...

Det där ser ju ut att gälla samma domän? Om du tagit koden från www.bloglovin.com och den anropar något på www.bloglovin.com ... är ju inte cross-domain.

Det jag kan tänka mig är att du surfar in på t.ex. http://www.test.com och försöker anropa något på http://test.com som är en annan domän.

Visa signatur

På SoundCloud | Fästmöns galleri

Redigera
Citera flera Citera
Permalänk
Medlem
●
Citat:

Ursprungligen inskrivet av azoapes
Det där ser ju ut att gälla samma domän? Om du tagit koden från www.bloglovin.com och den anropar något på www.bloglovin.com ... är ju inte cross-domain.

Det jag kan tänka mig är att du surfar in på t.ex. http://www.test.com och försöker anropa något på http://test.com som är en annan domän.

Den koden hämtade jag från en annan sida som anropade Bloglovin.com.

Visa signatur

iPhone

Redigera
Citera flera Citera
Permalänk
Medlem
●

Ok, du skrev att den var från Blogvin.com

Testa att själv hämta data från Blogvin, från din sida.

Visa signatur

På SoundCloud | Fästmöns galleri

Redigera
Citera flera Citera
1
Skriv svar
Senaste nyheterna
Hårdvara
Mjukvara
Övrigt
Nytt i forumet
Datorkomponenter
System
Ljud, bild och kommunikation
Spel och mjukvara