What is the canvas and application tab for the Facebook application?

Question

I spent a lot of time reading FB dev documents and tutorials, but I'm still very confused about what you can use in the canvas application and page tab and how to use them.

What I expect from using the FB SDK on my site is to click the continue with facebook button on the login screen, have a couple of common and similar buttons and send notifications to facebook if the user has allowed this. My site has an internal messaging system, and I want to notify users that a new message or activity has occurred on my site. Thus, users do not need to check my site every day for activity that is important to the user, since I expect rare activity (about a few operations per week).

Everything works for me, but after the user clicks on the notification, he gets into the application for the canvas. FB documents and tutorials focus on code examples, but I haven’t found a description of what the canvas application really is. Without this fundamental understanding, I cannot complete my notifications logic, I cannot understand terms such as “secure canvas URL”, and I'm generally not sure about the user experience (which I would like to do as much as possible).

If I google “what is the facebook canvas app”, I get “Canvas is an exciting and expressive Facebook experience for companies to tell their stories and showcase their products.” As you can see from the comment below, something else ...

I would take it if someone could explain with a simple word and maybe an example what a canvas app is and how to use it, given that my main goal is to notify users of activity on my site in my fb account.

I am using the CI framework PHP SDK v5.

Answer 1

Background

On Facebook, you create “apps” that run on “platforms.” As a quick, very simplistic summary, the three main types of “platforms” that can run applications are as follows:

• The website on which you host and control, but integrated with the Facebook API (has Facebook login, posting, etc.), but otherwise looks like a regular website. You host them on your servers.

• A website designed to be placed inside an iFrame on the Facebook platform. These applications will also interact with Facebook Graph. You still host them on your servers, but you have an added advantage, but you can get limited user information when the page loads.

• Standalone programs (including mobile apps) that also interact with Facebook graphics.

What you're talking about is the second of them - iFrame on Facebook.

Facebook provides two ways to embed an iFrame application:

• one is a canvas app. This is the minimal environment for Facebook Header, Footer and several ads on the right. It maximizes your space. (e.g. https://apps.facebook.com/candycrush/?fbs=-1&fb_appcenter=1 )

• the other is the "page tab" ( https://developers.facebook.com/docs/pages/tabs ). This is smaller and designed to be hosted on Facebook Page, so it has less space. However, as a marketer, he keeps more and more branded for your company. (Example: https://www.facebook.com/NutellaANZ/app/595447743881506/ )

Please note that one application can work through all of the above - a canvas, a page tab and a separate HTML page. With some API changes, you can also wrap the same code for mobile devices and put them in app stores. A user can log in to your mobile application, and you can log in to websites and vice versa (to some extent, but you need to study them).

---

Only games?

You are correct that most of the documents on Facebook related to applications relate to games. Indeed, a good place to start is https://developers.facebook.com/docs/games/gamesonfacebook , where you can now help you with Canvas Apps.

But this should not be a game - as long as you use the API, everything will work. When you mention PHP, look at https://developers.facebook.com/docs/php/howto/example_access_token_from_canvas - not mentioned about the game, but how to get information from iFrame in PHP. (There is still a lot of reading!).

---

Reading notifications

When you click on the notification, Facebook will add the parameters to the URL. Some of them are defined by notification (see https://developers.facebook.com/docs/games/services/appnotifications ), while others will help you get user information ( https://developers.facebook.com/docs/reference/ login / signed-request , https://developers.facebook.com/docs/php/SignedRequest/5.0.0 ).

Therefore, use this information on the server side to determine who the user is and how you want to handle the user. But what experience you want to provide the user when you are in the electronic system of Facebook is up to you.

Answer 2

Reading the message, I found that the TAB API is not accessible by Mobile, returning an error.