Connecting a python backend and vue.js frontend on Google App Engine - python

I have an assignment, building a system on google app engine with python backend(not flask), and Vue.js front end.
The system needs to load the vue.js app(some basic hello world app), on google app engine(google cloud SDK).
I've built the python & yaml side and loaded it to GAE and also built the vue.js side..
but i'm stuck a long time on how can i connect the parts so the python/yaml will load my app on loading the url..
Please Help,
Thanks ahead either way! :)

Strictly speaking, your Python will not directly "load your app".
First, at the risk of unneeded explaining, there's the important concept of where code resides vs where code executes. Your VueJS code resides on the server in a static file but executes in the client / browser.
Q: How does it get from the server to the browser to execute?
A: The client must send a request to the server to provide it.
Q: What would cause the browser to send this request?
A: Instructions in other code sent to it, most probably a <script> tag in HTML.
So, the flow goes something like this (may vary for you depending on details not provided):
Browser sends request to server (GAE) for HTML, such as the home page
Server (GAE) responds with HTML
This HTML may be dynamically created by Python or may be a static file.
This HTML contains tags to instruct the browser to request more files: images, CSS, JS.
This HTML should contain a <script> tag to request your VueJS code.
Browser receives the HTML and processes it, including the <script> tag for your VueJS code.
Browser sends request to server for the VueJS code.
Server (GAE) responds with the static file containing the VueJS code.
Browser receives the file containing VueJS codes, runs it, and your VueJS is now loaded & running!
As your VueJS runs, it may send AJAX requests to the server (GAE) to get data and/or more code.
Your VueJS code must reside in a static file on the server. To the server (Python), this static file is just a meaningless bag-of-bytes (if there's a syntax error in the code it won't be found until it executes client-side).
How do you get these statics files into GAE so they are available when the browser requests it? You probably already got this (for CSS, images), but just in case you don't, see this link: Server Static Files for details on setting this up.

Related

I want to implement a Python chatbot on my static HTML website

I am trying to implement a chatbot that I created in Python on my website. I have looked at so many tutorials and most of them uses some sort of SocketIO connection which they use on localhost.
My current setup
I have a static website made with HTML, CSS and JS which is hosted on GitHub Pages (for now). As a separate project I have a Python project in which I have a function that can take an input message and then return the "correct" bot message from that.
What I want
I now want to create a html interface where a user can input his message and press send. Then (in JS I assume) I will take this message, somehow send it to the python function, get a response from the python function, and then print it out in JS. No other users should see these messages, just the current user.
My problem
I know the JS steps but I have no clue how to make a JS function "talk" to a python function/script/project and then use the response from that. I have seen so many tutorials on flask/socketio but all seems to be targeted to localhost and some sort of live chat between users.

Can i run a gwt project without using a webserver

Im making a webserver from scratch in python by simply supplying HTML content through a tcp socket. I want to be able to run gwt projects, is this possible by just echoing the contents of the generated index.html to a browser?
If it is a client-side GWT application, then yes, you could serve it with a basic HTTP webserver that receives HTTP GET requests from a browser and serves files like HTML, JavaScript, images, etc.
If the GWT application includes server-side servlets then it wouldn't work when the client sent requests to the server part of the application.

Read files from User end

Hi all thanks for help (in advance)
I developed an HTML form, which takes source and destination from the user and uses python in background to combine those files. I hosted this in my web server but if a user is entering the path which is in his desktop my application is not reading. It is searching for the path in the webserver but not in the user desktop.
You need to provide a way for the client to send the file to the server. The app is running on your web server which has its own file system. This server will not have direct access to clients' file system (this would be a huge security concern).
Sounds like you are trying to develop this as if it is a local app on the client's machine. This is not the case because you deployed part of the app to your web server. Think of your app as two pieces. Server side application / client side application. You need to create a way for these two to communicate with each other in a secure manner.
What you are looking for can be done with a REST endpoint on the server side where a client can send the file to the server via a POST request.
Basically the client side of the app (your webpage) could prompt the client to select a file on their machine and then send the contents of the file(s) via HTTP POST to the server side of your app where your python code performs whatever operations you want. The server app could even send a response back to client (the combined files maybe).
Something like this is what you ultimately need to do... note that in this link they developed BOTH server/client parts of their app in python. In your case you have created a webpage client frontend that will run in a browser. You would need to add some code to your webpage to have the user upload a file from their machine and send it to the server.
Sending files between client - server through TCP socket in python?

How do you make a Redirect URI for a Slack App?

I'm trying to create a Slack App (see here), but I'm having incredible difficulty with how to create a Redirect URI.
Slack states the following:
You must specify at least one redirect URL for OAuth to work. If you
pass a URL in an OAuth request, it must (at least partially) match one
of the URLs you enter here. Learn more
I have a rudimentary understanding of a Redirect URI conceptually, but I have no idea how to go about actually getting this Redirect URI that Slack requires.
I've successfully used all of Slacks Integrations with Python including Real Time Messaging, but setting up a Redirect URI seems to require a special server or a website.
As already mentioned in the comments you will need a publicly reachable webserver to host your script for installing the Slack app. So the redirect URL is the URL to your installation script.
Basically any webserver or script hosting service that runs your favorite script flavor (e.g. PHP or Python) will work. See also this answer on how the OAUTH process can be implemented.
The redirect URL works without SSL, but for security reasons SSL is strongly recommended. Also many other features of Slack requires you to run SSL on your webserver (e.g. Interactive Buttons)
Another option is to run a webserver on your local machine (e.g. WAMP for windows) and open it to the Internet through a secure tunnel (e.g. ngrok). For developing and testing this is actually the better alternative, since you can test and fix your Slack app locally without having to deploy every change on a public server.
However for running a public Slack app (e.g. one that is listed on the Slack App Directory) I would strongly recommend to put the production version of your App on a public webserver.
If you're just trying to get it up so that you can authorize another workspace you can always use 'http://localhost' after authorizing it will try to redirect you there and you wont be able to see anything useful, but the authorization should still have taken place I believe.
of course if you're looking for the api code, you will have to pull it directly from the browser url. ... it's very manual.

bottle framework: getting requests and routing to work

I have written a webapp using traditional cgi. I'm now trying to rewrite it with bottle
The page is simple...the user fills out a form, hits submit and the data object is sent to a python script that used to live in my cgi-bin
The python script generates an image, and prints the url for that image out to standard out
On callback, I use javascript to display the newly generated image on the page formatted with html.
The issue that I'm having with bottle is getting the image-generating script to execute when it receives the post request. I'm used to handling the post request and callback with javascript (or jquery). should I be using a bottle method instead?
I actually resolved the issue. The Bottle framework tutorial encourages first-time users to set up the server on a high port (to avoid conflict with apache, etc) for development. I was missing two parts of the process: 1. import the python script so that it can be called from the main bottle file 2. in the main bottle file, add a route to the api link (for the javascript to work) I'm not sure if I would have had to add the route if I was running the server on port 80

Categories