Mein eigener Netflix Squid Proxy

Seit letzter Woche gibt es Netflix in Deutschland. Allerdings nicht mit dem vollständigen US Angebot. Es fehlen sämtliche Star Trek Serien, viele aktuelle Filme und Dokus und diverse neuere Staffeln populärer Serien.

Ein Bekannter gab mir dann den Hinweis das man sich mit dem deutschen Netflix Account auch im US Netflix einloggen kann .. allerdings benötigt man eine US IP Adresse.

Netflix filtert das Angebot für die jeweiligen Länder nach IP Ranges die diesen Ländern zugeordnet sind.

Nichts leichter als das. Für meine SEORCH Scraper betreibe ich sowieso ein paar kleine 5 Dollar Server in New York. Da sollte sich doch ein Proxy drauf installieren lassen. Quasi mein eigener US Proxy.

Natürlich gibt es solche Angebote zuhauf im Internet. Kosten alle ein paar Dollar im Monat und funktionieren auch prima. Aber ich finde selber machen immer noch um Welten cooler als dafür zu bezahlen.

Werkzeug

Du brauchst also einen kleinen Linux Server auf dem du Superuser Rechte hast, der muss zwingend eine US IP Adresse haben. Ich hab meinen bei Digital Ocean .. das kleinste Paket reicht um sicher 10 – 20 Kumpels auch noch damit zu versorgen. 1 TB Transfer muss man auch erst mal wegballern. Daneben musst du dir zutrauen auf der Linux Konsole Programme zu installieren und mit VI oder NANO Textfiles zu editieren.

Konsolen Foo

Erst mal Paketmanager Update machen und dann squid installieren .. ggf. mit sudo davor wenn ihr keine root Rechte habt.

CentOS:

yum update
yum install squid

Ubuntu:

apt-get update
apt-get install squid squid-common

Dann müsste in beiden Fällen unter /etc/squid/squid.conf die Squid Config Datei liegen. An der pfuschen wird gleich rum darum am besten ein Backup davon machen:

cp squid.conf squid.conf.bak

Jetzt bearbeiten wir schnell die squid.conf .. ihr könnt sie natürlich auch per FTP öffnen oder direkt auf der Konsole bearbeiten wie man das lieber mag. Dort muss dann folgendes rein:

via off
forwarded_for off

Das dient dazu den Proxy zu anonymisieren. Transparente Proxys reichen eure IP an den Zielserver weiter. Mit diesen Einstellungen sieht Netflix dann nur noch die IP des Proxy Servers.

Such dann die Zeile -> http_access deny all und kommentiert das aus. Wir lassen für den ersten Test erst mal alle Zugriffe auf den Proxy zu. (Das solltet ihr später dann ändern).

# http_access deny all
http_access allow all

Dann starten wir Squid:

service squid start 
oder 
service squid restart

Nun sollte euer Proxy zu erreichen sein:
http://[SERVERIP]:3128

Genau diese Einstellungen müsst ihr nun auch in eurem Browser vornehmen. Unter MacOS findet man das unter Netzwerk und dann Weitere Optionen -> Proxies

Dort dann bei HTTP und HTTPS die IP und den Port eintragen und im Fenster davor dann auf Anwenden klicken.

Sicherheit

Natürlich solltet ihr euren Proxy nicht so offen im Netz stehen lassen. Naja kann man .. muss man aber nicht. Man kann Squid mit einem Passwort versehen und wie das geht steht hier.

Ebenso könnte man auch wieder in der squid.conf den Zugriff auf Netflix beschränken. Ich wollte hier aber nur eine schnelle Basisanleitung geben um Netflix US mit eigenen Mitteln zu nutzen.

CSS3 – Transition – Transform

Ich habe heute mit CSS3 Transitions rumgespielt .. die Effekte funktionieren aktuell nur in den Webkit Browsern Chrome und Safari. Im Sinne von Progressive Enhancement ist die Darstellung aber auch in allen anderen Browsern (sofern ich sie getestet habe :)) in Ordnung .. schauts euch also mal im Firefox an ..

Was ich aber sagen kann .. mit den ganzen Möglichkeiten die durch CSS3 Transition und Transform da in den Browsern ankommen wird CSS3 ziemlich komplex wobei natürlich abzuwarten bleibt wie stark das eingesetzt wird.

Ich hab im ersten Schritt mal versucht so ne Art Gallerie zu bauen, mit einer Beschreibung und das Ganze dann irgendwie ansprechend zu animieren.

Den TRANSFORM Parameter -> translateZ habe ich nicht so ganz verstanden .. ich weiß schon was er macht etc. aber je nachdem was man hier für Werte eingibt kann es zu witzigen Effekten kommen ..

Das CSS steht direkt im Quelltext .. und hier das ganze Beispiel.

HTML5 – Canvas – Snake

Auf meinem Weg zum JavaScript Ninja .. falsch .. eigentlich wollte ich nur mit dem neuen HTML5 Element Canvas rumspielen .. am Ende habe ich dann aber glaube ich mehr mit JavaScript rumgespielt .. aber darauf wird es hinauslaufen .. das CANVAS Element ist ohne Javascript im Grunde völlig nutzlos .. CANVAS ist wieder Name schon sagt die weiße Leinwand die euch zur Verfügung steht ..

Pinsel und Farben sind aber JavaScript .. und mehr muss man zu Canvas dann auch fast nicht mehr sagen ..

Das Element lässt euch machen was ihr wollt .. sofern es sich irgendwie mit JavaScript machen lässt.

Das Spiel

Inspiriert vom No Tears Guide to HTML5 Games habe ich dann beschlossen das klassische Snake das man von den alten Nokia Handys kennt in JavaScript nachzubauen .. hier könnt ihr mein Canvas Snake mal ausprobieren.

Ich habe etwas von jQuery und dem jQuery Hotkeys Plugin Gebrauch gemacht .. aber nur um die Tastatureingaben sicher abzufangen .. der Rest ist natives JS.

Der Quelltext ist schön knapp und wie ich finde sehr gut lesbar .. mal sehen .. wenn ich die Tage Zeit habe werde ich vielleicht noch ein bei “magische” Codeschnipsel kommentieren ..

Das komplizierteste war das Array das sich die Länge und Position der Schlange merkt .. und obsolete Positionen der Schlange wieder cleared ..

this.body.push([this.x, this.y])      
if (this.body.length > this.taillength) {          
  var clear = this.body.shift();
  cx.clearRect(clear[0], clear[1], this.grid, this.grid); 
}

Hier schaue ich wie lange die Schlange ist und wische dann alles was über die Länge die in der taillength Variablen steht wieder weg.

Weiterhin ist die Kollisionskontrolle etwas schwerer zu verstehen als der Rest. Es gibt einmal die Kontrolle ob die Schlange ihr Futter frisst und zum zweiten ob die Schlange crashed .. in sich selbst oder in die Begrenzung.

Für das Futter checke ich nur ob der Kopf (this.x / this.y) der Schlange sich an der gleichen Position wie das Futter befindet

if (this.x  randomPointX && this.y  randomPointY) {
  this.taillength++;
  food(); 
}

Für die Kollisionskontrolle mit der Wand oder Schwanz muss ich schauen ob sich der Kopf mit den Koordinaten die aktuell im body Array stehen überschneidet .. ganz gut hilft einem hier die .some Methode mit der man einfach schauen kann ob im kompletten Array die Werte vorkommen ..

Spielen tut man mit dem Cursor und ihr braucht einen Browser der HTML5 unterstützt ..

Hier gehts zum Canvas – HTML5 – Snake