2016년 12월 9일 금요일

Creating a Custom TinyWebDB Service updated on November 23, 2015.


Note: these instructions were last updated on November 23, 2015. 
TinyWebDB is an App Inventor component that allows you to store data persistently in a database on the web. Because the data is stored on the web instead of a particular device, TinyWebDB can be used to facilitate communication between devices and apps (recommendation systems, multi-player games, etc.).
By default, the TinyWebDB component stores data on a test service provided by App Inventor, http://appinvtinywebdb.appspot.com/. This service is helpful for testing, but it is shared by all App Inventor users, and it has a limit of 1000 entries. If you use it, your data will be overwritten eventually.
For most apps you write, you'll want to create a custom web service that isn't shared with other App Inventor apps and programmers. You don't need to be a programmer to do so --- just follow the instructions below and you'll be able to make your own web service.
To create your own web service, follow these instructions:

1. Review the page describing two TinyWeb DB services and download the .zip file(s) from that page corresponding to the particular service(s) that you want. This .zipfile contains source code for your custom TinyWebDB web service. You do not have to understand this code in order to use it. Below, for concreteness, let's assume that you have downloaded alltags-deletable-tinywebdb-fall5.zip. (But you could instead use alltags-deletable-list-tinywebdb-fall5.zip.)


2. Unzip the downloaded alltags-deletable-tinywebdb-fall15.zip file (typically by double-clicking on its icon). This will create a folder named alltags-deletable-tinywebdb-fall15. You can rename it if you want.


3. Download the installer for Google App Engine for Python from https://cloud.google.com/appengine/downloads.  When you visit this page, you will see several buttons; click on the one that says Google App Engine SDK for Python.




4. After you've clicked on the button, you will have an option to download the installer for you your operating system:



5. Run the downloaded installer (typically by double-clicking on its icon). When it's done, you should have a folder like the following:



6. Follow the installation notes you get by clicking on the button for your platform at https://cloud.google.com/appengine/downloads:



7. Note: these installation notes assume that you have administrative privileges on your computer, which you might not have. If you don't, then it is not necessary to copy GoogleAppEngineLauncher application from the folder to your Application or ProgramFiles folder; copy it to your Desktop instead. Also, it is not necessary toMake commands symlinks to succeed at the following steps. The key thing is that you have this executable GoogleAppEngineLauncher application icon on your computer:



8. At this point, you can safely delete the installer program/folder. 

9. You need to make sure your computer has Python version 2.7 installed. See the installation notes at https://cloud.google.com/appengine/downloads for your platform for how to check this. If you have an older version of Python, install Python version 2.7 from the Python web site.


10. Run the GoogleAppEngineLauncher by double-clicking its icon. If you are prompted to Make command symlinks, you can say OK, but it doesn't really matter if this step succeeds or not.  This should result in creating an empty GoogleAppEnginerLauncher window:




11. In the GoogleAppEngineLauncher menu, choose File>Add Existing Application.



12. Click Browse



13. Navigate to the alltags-deletable-tinywebdb-fall15 folder you unzipped above, and click Choose

14. (for the folder itself, not any of its contained files).




15. Do not change the port numbers, and click Add.



16. This alltags-deletable-tinywebdb-fall15 service has now been added to your GoogleAppEngineLauncher:



17. In the GoogleAppEngineLauncher, click the Run button. This will launch a test web service that runs locally on your computer (not remotely on the web). The app has correctly launched if you see a small green circle icon containing a white right triangle at the far left of the selected line.



If you instead see a warning icon --- a yellow triangle containing an exclamation point --- most likely GoogleAppEngineLauncher is confused about which version of Python to run. Fix this in GoogleAppEnginerLauncher>Preferences by setting the Python path to be the executable for Python 2.7


18. You can test the local test web service by opening a web browser and entering localhost:8080 as the URL. You'll see the web page interface to your web service. The end-goal of this service is to communicate with a mobile app created with App Inventor. But the service provides a web page interface to the service to help programmers with debugging. You can experiment with your web service through this local web page. You can invoke the store and get operations by hand (by clicking on /storeavalue and /getvalue), view the existing entries, and also delete individual entries.




19. Your web service is not yet on the web, and thus not yet accessible to an App Inventor app. To move it to the web, you need to upload it to Google's App Engine servers using a Google account. 

✰ You should first try using your Wellesley gmail account to do this. In the past, Wellesley's gmail accounts have sometimes not been able to use App Engine, but they appear to work as of Nov. 23, 2015. 


✰ If your Wellesley gmail account does not work for the following steps, you will instead need to use a Google/gmail account that is different from your Wellesley account. In this case: 


✰ If you do not already have a non-Wellesley gmail address, create one now at https://accounts.google.com/SignUp?hl=en

✰ Before the following steps, in a new browser window, visit gmail.com and sign in at your non-Wellesley gmail account.

20. In a browser window logged into the gmail account from step #16, visithttps://console.developers.google.com/start. This will bring you to your Google Developer Console start page. There may be a button at the top of the page encouraging you to sign up for a free trial. DO NOT PRESS THIS BUTTON. Instead, click the DISMISS button.  




21. At subsequent points in this process, you may be asked again to sign up for a free trial. DO NOT DO THIS.

22. On the Google Developer Console start page, click the Create an Empty projectoption.




23. In the resulting New Project window, you'll need to specify a Project Name. We recommend that your project name has form yourGmailName-alltags-deletable. The window will also specify a Project ID that may be different from your Project Name. E.g., in the window below, the Project name is gdome-alltags-deletable, but the Project ID is gdome-alltags-deletable-1138. Remember the Project ID because you'll need it later. Click Create to create your project. You'll now have a new empt project on Google's servers.



24. Visit your Google Developer Console home page at https://console.developers.google.com/home. You should see the project created in step #19 on this page:



25. Now go back to the GoogleAppEngineLauncher window and click the Edit button.



26. This will open a text editor for the app.yaml file within the alltags-deletable-tinywebdb folder:



27. In the text editor, modify the first line so that application: is followed by the Project ID (which is not necessarily the same as the Project Name) from  step 19.



28. Save the changes to this file and close the editor window. The name of the project within the GoogleAppEngineLauncher window will change:

 google-app-engine-local-service-renamed.png


29. In the GoogleAppEngineLauncher, click on the Deploy button.



30. A new browser tab should open requesting you give Google App Engine certain permissions. Before you click Allow, make sure that the gmail/Google account in the upper right is the same as that from step 16. If not, close your browser application, restart it, visit the desired gmail page, and log in with the desired address before repeating this step.


31.


32. Your browser tab may now change show something like this:

33. Your service will now be uploaded from the GoogleAppEngineLauncher to an App Engine server in the cloud. The progress of this upload is tracked by the Log window:




34. Once the deployment succeeds, you have your own active TinyWebDB service at the URL yourProjectID.appspot.com. For example, the above deployment creates a service at http://gdome-alltags-deletable-1138.appspot.com.  The web page at this URL should look the same as when you ran it on the local test server, except that now its in the cloud and accessible by anyone with using this URL.



35. In the GoogleAppEngineLauncher window, if you press the Dashboard button, it will bring you to a page with details about the monitoring of your new service. Note that your service is completely free. However, it does have some resource restrictions, and if you exceed a quota for the number of accesses to your database during a particular day, the service will shut down until the end of the day, at which point the quota will be reset.




Your App Inventor apps can store and retrieve data using your new service. Just do the following:


✰ Drag in a TinyWebDB component into the App Inventor Designer window.

✰ Change the ServiceURL property from the URL for your service. Using the example above, this would be  http://gdome-alltags-deletable.appspot.com 

✰ Now any StoreValue operations (blocks) will store data at your service, and anyGetValue operations will retrieve values from your service.


댓글 없음:

댓글 쓰기