Come sbloccare come costruire un fan fan di Facebook di base senza pagare per l'hosting

Lo adori o lo detesti, tutti e il loro cane è su Facebook al giorno d'oggi; così come tutto ciò che è popolare nella vita, è stato completamente sovvertito dai tipi di marketing. Un uso incredibilmente efficace di una pagina di marchio ospitata su Facebook è di incentivare le persone a gradire la pagina creando contenuti riservati solo ai membri; comunemente indicato come a “fan gate”. Questo è pieno di video esclusivi, download o forse un coupon dello shopping - ne usiamo uno qui su MakeUseOf per dare ai nostri fan un facile accesso a tutte le competizioni in corso.

Questo tipo di app di Facebook di base era relativamente semplice da creare in passato, ma Facebook ora richiede che tutte le app con scheda di pagina abbiano una versione sicura - una HTTPS URL di accesso, ma questo è un altro $ 100 all'anno in aggiunta ai costi di hosting esistenti per il tuo sito. Anche se gestisci un piccolo negozio e-commerce, puoi utilizzare PayPal come fornitore di servizi di pagamento e quindi non avere bisogno di certificati SSL. Ma non preoccuparti, perché Facebook ha anche collaborato con Heroku - una società di hosting di cloud - il che significa che puoi creare la tua app di Facebook di base e ospitarla gratuitamente su un server sicuro. Voglio sapere di più? Continua a leggere mentre faccio una semplice app della pagina di Facebook fan-gate, ospitata gratuitamente su Heroku.

Registrati come uno sviluppatore

Prima di creare qualsiasi app, devi essere uno sviluppatore registrato. Vai a developers.facebook.com per iniziare e fare clic sul verde Registrare pulsante in alto a destra se non l'hai già fatto. Hai bisogno di un numero di telefono per registrarti, ma per il resto è gratuito.

Se sei già registrato, fai clic su App nella barra degli strumenti in alto per ottenere una panoramica delle tue app attuali.

Crea una nuova app

Ecco dove inizia il divertimento. Clicca su Crea una nuova app. La denominazione non ha molta importanza, ma ovviamente scegli qualcosa di rilevante. Il campo spazio dei nomi verrà aggiunto all'URL della pagina fan quando l'utente fa clic su tale scheda; puoi lasciarlo in bianco, ma poi vedranno l'ID app nell'URL, che è un po 'più brutto. Lo spazio dei nomi deve essere anche unico, quindi non preoccuparti nemmeno di qualcosa del genere “testapp” o riceverai un errore. Infine, seleziona la casella che dice che vuoi l'hosting gratuito da Heroku.

Dopo aver compilato il captcha sarai invitato a scegliere il tipo di hosting che desideri da Heroku: seleziona PHP e accetta. Facebook creerà automaticamente un nuovo account per te su Heroku, se non ne hai già uno, e prepopolare le impostazioni dell'URL nei tuoi concetti di base, il che è bello da parte loro. In effetti, è molto difficile incasinare questo passo.

Dalla pagina dei dettagli dell'app, vorresti anche impostare il tipo di app come a “Scheda Pagina”, e assicurati che gli URL pertinenti siano inseriti anche lì - di nuovo, questo dovrebbe essere automatico. Quindi salva.

Heroku Primi passi

Al termine, riceverai un'email da Heroku con i dettagli su come cambiare la password e scaricare Heroku “toolbelt” per il tuo sistema. Per quelli di voi che non hanno familiarità con Heroku, non è un host tradizionale nel senso che è possibile accedere a un indirizzo FTP e caricare file; invece Heroku lavora con Git, un sistema di controllo delle versioni. Una volta che hai installato la barra degli strumenti, devi prima clonare il sito sul tuo disco locale - questo ti dà una directory che è un mirror di ciò che è ospitato su Heroku. Ogni volta che apporti modifiche a questi file, li sincronizzi di nuovo tutti per aggiornare Heroku.

Le istruzioni per eseguire questa prima sincronizzazione sono contenute nella tua e-mail di benvenuto, ed è un semplice comando di una riga unico per il tuo indirizzo di hosting: basta copiare e incollare dall'e-mail. Il tuo URL di hosting è completamente arbitrario - nel mio caso lo è stato asciutto-bosco-7743 - è generato casualmente e non ha importanza perché gli utenti non lo vedranno. Apri la directory appena creata e dai un'occhiata in giro.

Heroku ha messo molte funzionalità, ma non ne abbiamo bisogno. Aprire index.php e dare un'occhiata in giro. Trova le seguenti linee vicino all'inizio del file:

$ facebook = new Facebook (array ('appId' => AppInfo :: appID (), 'secret' => AppInfo :: appSecret (), 'sharedSession' => true, 'trustForwarded' => true,));

e subito dopo, copia in questi:

$ signed_request = $ facebook-> getSignedRequest (); $ piaciuto = $ signed_request ['page'] ['piaciuto'];

Non preoccuparti se questo è troppo complicato per te - ti darò presto un modello finito. Una richiesta firmata viene inviata alla tua app da Facebook che include alcune informazioni sull'utente, indipendentemente dal fatto che abbiano accesso come amministratore e se abbiano o meno apprezzato la pagina. Se vuoi sapere esattamente cosa viene inviato, aggiungi quanto segue:

print_r ($ signed_request);

e riceverai una stampa completa dell'oggetto richiesta firmata.

A questo punto, dovrei ammettere che stavo avendo dei problemi reali nel far funzionare la richiesta firmata - sembrava che Heroku stesse tagliando i dati sul caricamento della pagina, ed è stato solo dopo aver caricato l'API JS (un buon 10 secondi dopo il caricamento iniziale della pagina ) che la pagina si aggiorna e indica la corretta “è piaciuto” stato. Grazie a questa domanda di Overflow dello stack, la soluzione sembra aver rimosso il codice che applica HTTPS agli utenti non protetti. Elimina il seguente blocco di codice all'inizio del modello:

// Applica https in produzione if (substr (AppInfo :: getUrl (), 0, 8)! = 'Https: //' && $ _SERVER ['REMOTE_ADDR']! = '127.0.0.1') header ('Posizione : https: // '. $ _SERVER [' HTTP_HOST ']. $ _SERVER [' REQUEST_URI ']); Uscita(); 

Ora, quando la pagina viene caricata, hai una variabile booleana, ovvero a vero o a falso - che ti dice se l'utente ha gradito la pagina o meno. Puoi usare questo con un semplice Se dichiarazione per mostrare entrambi i contenuti un o B:

Mettilo subito dopo l'apertura tag in index.php. Ora, se hai visto in anteprima la tua pagina su Heroku, noterai che ha un sacco di funzionalità aggiuntive, mostrando le pagine che ti sono piaciute, pulsanti per pubblicare aggiornamenti, ecc. Non ne abbiamo davvero bisogno, quindi spogliato tutto incluso l'SDK JavaScript per Facebook, lasciando solo il CSS e il nostro fan-gate. Ecco il codice ridotto che ho finito usando (questa è un'immagine - copia incolla da PasteBin se lo desideri):

Dovresti modificare le sezioni che dicono “non un fan” e “fan” per contenere rispettivamente il tuo contenuto predefinito e segreto. Se si preferisce mantenere il contenuto in un file separato, utilizzare:

includere ( "secret.html");

per importare file esterni.

Sincronizzare con Heroku

Dopo aver apportato tutte le modifiche necessarie al tuo file, devi sincronizzare il backup con Heroku - lo facciamo noi “spingendo” la nostra copia locale al “ramo principale” a Heroku. Assicurati di essere nella directory corretta dalla riga di comando, digita:

git commit -am "cambia i messaggi"

(puoi sostituire il messaggio di modifiche con una nota a te stesso di quali modifiche hai effettivamente apportato in questo momento: è buona norma conservare questi record)

e poi

git push heroku master

Attendere il completamento del comando, poiché potrebbe richiedere un po 'di tempo.

Passaggio finale: aggiungi l'app alla tua pagina

Ora che l'app è stata creata, dobbiamo effettivamente aggiungerla come una scheda alla pagina del tuo brand. Curiosamente, questo viene fatto usando un URL appositamente predisposto:

https://www.facebook.com/dialog/pagetab?app_id=YOUR_APP_ID&redirect_uri=YOUR_APP_URL_ON_HEROKU

Sostituire YOUR_APP_ID con l'ID elencato nei dettagli della tua app, e YOUR_APP_URL_ON_HEROKU con l'URL per il tuo hosting Heroku. Il caricamento di questo URL speciale avvierà quindi il “aggiungi alla tua pagina” finestra di dialogo, da cui è possibile selezionare la giusta pagina del marchio per aggiungere la scheda della pagina a.

Allora, presto - sarà un nuovo pulsante nella tua pagina, in questo modo:

Come puoi vedere, non abbiamo ancora specificato un'immagine per la scheda in modo che sia lasciata come predefinita: puoi farlo dalla pagina dei dettagli dell'app. Questo è fondamentalmente però; se carichi quella scheda, la mia sostituzione index.php o ti mostrerà come a fan o a non fan. O qualsiasi cosa tu abbia personalizzato per mostrare:

Devo ammettere che questo processo è stato più difficile di quanto mi aspettassi, ma evita completamente la necessità di ospitare qualsiasi cosa sul proprio server o ottenere la certificazione SSL. Se avete domande o problemi, chiedetelo nei commenti e cercherò di dare una mano. Se i commenti sono chiusi, vai al nostro sito Answers; e, per favore, se hai trovato utile questo tutorial, condividilo sul tuo social network preferito. Inoltre, probabilmente vorrete dare un'occhiata alla nostra guida gratuita e completa sul social media marketing e prendere in considerazione l'aggiunta di Pinterest alla vostra strategia.

Scopri di più su: Sviluppo App, Facebook.