Python Flask Modifying Page after loaded - python

I have a question about using Flask with Python.
Lets say I want to make a website for some mod I'm making for a game, and I want to put in a live chat feed, how would I go around modifying the contents of the page after the page has been sent to the person?

That is definitely doable. What you do is load an html page with some javascript that will make calls to your webserver to update the page with recent chat lines. The tutorial Realtime Web Chat with Socket.io and Gevent is a very good place to start. He explains the whole process from the ground up in one article. There are also two other stackoverflow questions that might be useful to you:
A tutorial for a web-based chat server in Python
Python + comet + web (chat) - I need working(!) library/server
For flask specific implementations of a chat application you might want to check out these two projects:
flask-gevent-socketio-chat
flask-chat

Short answer: you can't.
Longer answer: once you have "sent the page" (that is, you have completed a HTTP response) there is no way for you to change what was sent. You can, however, use JavaScript to make additional HTTP requests to the server, and use the HTTP responses to modify the DOM which will change the page that the person is looking at. There are many ways to make a live chat feed, all of which are too complicated to put in a single Stack Overflow answer, but you can be sure that they all use JavaScript.

I would suggest you look into AJAX, specifically jQuery.
jQuery can send ajax request to your flask backend to retrieve more data and upon fetching new data it can modify the html contents of the page in user's browser.
Example:
$.getJSON("/chat-feed", function(msg){
$("#chat-container").append("<div>" + msg.text + "</div>");
});

Related

Open a web page and let it refresh automatically in python

When you do a request in python, you simply download the page and your connection is over.
However, if you open it in your browser, for some websites the page content will automatically refresh. For example the stock prices on yahoo finance, or notifications on reddit.
Is it possible to replicate this behaviour in python: automatic refresh without having to constantly manually re-download the same page entirely?
These websites use this thing called websockets, which allows you to easily send live data back and forth from client to server. They keep a normal request open so that the server can send data back whenever it needs. If you need websockets, there are some resources listed below:
MDN Web docs
100 seconds of code
The results will be the same if you re-download the page. Don't make it harder than it has to be. If you are hell-bent, you'll need to use something like puppeteer, phantomjs, or selenium.

Login and Clicking Buttons with Python "requests" Module

I have been playing with requests module on Python for a while as part of studying HTTP requests/responses; and I think I grasped most of the fundamental things on the topic that are supposed to be understood. With a naive analogy it basically works on ping-pong principle. You send a request in a packet to server and then it send back to you another packet. For instance, logging in to a site is simply sending a post request to server, I managed to do that. However, what I have trouble is to fail clicking on buttons through HTTP post request. I searched for it here and there, but I could not find a valid answer to my inquiry other than utilizing selenium module, which is what I do not want to if there is another way with requests module too. I am also aware of the fact that they created such a module called selenium for a thing.
QUESTIONS:
1) What kind of parameters do I have to take into account for being able to click on buttons or links from the account I accessed through HTTP requests? For instance, when I watch network activity for request header and response header with my browser's built-in inspect tool, I get so many parameters sent back by server, e.g. sec-fetch-dest, sec-fetch-mode, etc.
2) Is it too complicated for a beginner or is there too much advanced stuff going on behind the scene to do that so selenium was created for that reason?
Theoretically, you could write a program to do this with requests, but you would be duplicating much of the functionality that is already built and optimized in other tools and APIs. The general process would be:
Load the HTML that is normally rendered in your browser using a get request.
Process the HTML to find the button in question.
Then, if it's a simple form:
Determine the request method the button will carry out (e.g. using the formmethod argument, see here).
Perform the specified request with the required information in your request packet.
If it's a complex page (i.e. it uses JavaScript):
Find the button's unique identifier.
Process the JavaScript code to determine what action is performed when the button is clicked.
If possible, perform the JavaScript action using requests (e.g. following a link or something like that). I say if possible because JavaScript can do many things that, to my knowledge, simple HTTP request cannot, like changing rendered CSS in order to change the background color of a <div> when a button is clicked.
You are much better off using a tool like selenium or beautiful soup, as they have created APIs that do a lot of the above for you. If you've used the built-in requests library to learn about the basic HTTP request types and how they work, awesome--now move on to the plethora of excellent tools that wrap requests up into a more functional and robust API.

iframe tab facebook app displays on a new page instead of within the iframe/facebook-canvas

I am using Python and a javascript or php sdk.
To obtain the access_token - I follow the steps indicated on the docs page (https://developers.facebook.com/docs/authentication/). I pass the redirect url to dialog/oauth and obtained the access_token. Once this is done, all output html being sent back to the browser gets rendered into to a new page, leaving the facebook iframe/canvas. (fyi, all output is done thru the usual 'self.response.out.write' function call).
Seems the PHP sdk hides this and I can't find a way to get : http://www.facebook.com/dialog/oauth?client_id=%s&redirect_uri=%s" dialog to send the output from the redirected url to the iframe/canvas that triggered the application. This is a 'Page Tab' app (not a 'App on Facebook') so have set the "Page Tab Name" and "Page Tab Url" on the basic apps config page.
I have not implemented session yet and I am wondering if that is necessary to pass the iframe target as a state variable and have it passed back along with the redirect to the uri.
I have searched many posts/etc and no luck and any help would be much appreciated !!
Tab Page Application undocumented steps :
The confusing part is the CANVAS_PAGE_URL in the example. This needs to be the web-hosted app URL (e.g. https://www.appname.appspot.com/).. This not clearly defined..
If access_token and the user_id is not found on the signed_request an auth dialog needs to be done (as per the page documentation). This needs to be done thru the script top.location.ref to endure that it launches as a dialog. This goes to a new page overwriting the canvas (or the fan-page) that triggered the app.
When the user allows the permissions on the app, the app is called thru the tab-page-canvas-url?code=".....". At this point, a redirect needs to be done (which is not documented anywhere. I had to look at the php sdk code to figure this out (fbmain.php line 17) (redirect() in python and header() php). The redirect needs to take the url for the app on the fan page : http://www.facebook.com/FAN_PAGE_NAME?sk=app_nnnnnnn
It took many hours of research and digging to understand this and hope it helps (I see a lot of questions raised around page breaking out of the iframe/canvas) and the basic problem is the extra redirect step that FB does not document anywhere...
(mail me and I am happy to share python code that is now all working nicely)
It is stated elsewhere, but to make clear: the reason your app breaks out of facebook is because the authentication dialogs get away from the original apps.facebook.com url.
This may only happen with extended permissions as the new permissions screen is two pages instead of one.
Once the authorization process is complete, the browser is redirected to the fully qualified app url on your server.
The "fix" is to send the browser back to the Facebook app using it's http://apps.facebook.com/appname address.
[that doesn't seem like good "flow" to most people, but that is how it is right now. I think there may be a different route by using the "Authenticated Referrals" on the "Auth Dialog" page of the apps, but haven't used it yet]
I use the PHP SDK and here is what I do:
Check for the "state" request parameter when your redirct_url is called after authorization. Some people had suggested using the "code" parameter, but I do not see it being returned.
''
// after completing the first authorization, the redirect url may send users away from Facebook to the redirect url itself.
//This php code redirects them back to the app page
if (isset($_GET['state'])){ header("Location: http://apps.facebook.com/appname']); exit; }
If you know a better way, please let me know!

creating non-reloading dynamic webapps using Django

As far as I know, for a new request coming from a webapp, you need to reload the page to process and respond to that request.
For example, if you want to show a comment on a post, you need to reload the page, process the comment, and then show it. What I want, however, is I want to be able to add comments (something like facebook, where the comment gets added and shown without having to reload the whole page, for example) without having to reload the web-page. Is it possible to do with only Django and Python with no Javascript/AJAX knowledge?
I have heard it's possible with AJAX (I don't know how), but I was wondering if it was possible to do with Django.
Thanks,
You want to do that with out any client side code (javascript and ajax are just examples) and with out reloading your page (or at least part of it)?
If that is your question, then the answer unfortunately is you can't. You need to either have client side code or reload your page.
Think about it, once the client get's the page it will not change unless
The client requests the same page from the server and the server returns and updated one
the page has some client side code (eg: javascript) that updates the page.
You definitely want to use AJAX. Which means the client will need to run some javascript code.
If you don't want to learn javascript you can always try something like pyjamas. You can check out an example of it's HttpRequest here
But I always feel that using straight javascript via a library (like jQuery) is easier to understand than trying to force one language into another one.
To do it right, ajax would be the way to go BUT in a limited sense you can achieve the same thing by using a iframe, iframe is like another page embedded inside main page, so instead of refreshing whole page you may just refresh the inner iframe page and that may give the same effect.
More about iframe patterns you can read at
http://ajaxpatterns.org/IFrame_Call
Maybe a few iFrames and some Comet/long-polling? Have the comment submission in an iFrame (so the whole page doesn't reload), and then show the result in the long-polled iFrame...
Having said that, it's a pretty bad design idea, and you probably don't want to be doing this. AJAX/JavaScript is pretty much the way to go for things like this.
I have heard it's possible with AJAX...but I was
wondering if it was possible to do
with Django.
There's no reason you can't use both - specifically, AJAX within a Django web application. Django provides your organization and framework needs (and a page that will respond to AJAX requests) and then use some JavaScript on the client side to make AJAX calls to your Django-backed page that will respond correctly.
I suggest you go find a basic jQuery tutorial which should explain enough basic JavaScript to get this working.

Web based wizard with Python

What is a good/simple way to create, say a five page wizard, in Python, where the web server component composes the wizard page content mostly dynamically by fetching the data via calls to a XML-RPC back-end. I have experienced a bit with the XML-RPC Python module, but I don't know which Python module would be providing the web server, how to create the static content for the wizard and I don't know how to extend the web server component to make the XML-RPC calls from the web server to the XML-RPC back-end to be able to create the dynamic content.
If we break down to the components you'll need, we get:
HTTP server to receive the request from the clients browser.
A URL router to look at the URL sent from client browser and call your function/method to handle that URL.
An XML-RPC client library to fetch the data for that URL.
A template processor to render the fetched data into HTML.
A way to send the rendered HTML as a response back to the client browser.
These components are handled by almost all, if not all, Python web frameworks. The XML-RPC client might be missing, but you can just use the standard Python module you already know.
Django and Pylons are well documented and can easily handle this kind of project, but they will also have a lot of stuff you won't need. If you want very easy and absolute minimum take a look at using juno, which was just released recently and is getting some buzz.
These frameworks will handle #1 and provide a way for you to specify #2, so then you need to write your function/method that handles the incoming request (in Django this is called a 'view').
All you would do is fetch your data via XML-RPC, populate a dictionary with that data (in Django this dictionary is referred to as 'context') and then render a template from the context into HTML by calling the template engine for that framework.
Your function will just return the HTML to the framework which will then format it properly as an HTTP response and send it back to the client browser.
Simple!
UPDATE: Here's a description of how to do wizard style multiple-step forms in Django that should help you out.

Categories

Resources