In a previous article, you’ve been introduced to CouchDB. This time, you’re going to create a full-fledged app where you can apply the things you learned. You’re also going to learn how to secure your database at the end of the tutorial.
You’re going to build a Pokemon spawn locations recorder.
This will allow users to save the locations of the monsters they encounter on Pokemon Go. Google Maps will be used to search for locations and a marker placed to pinpoint the exact location. Once the user is satisfied with the location, the marker can be interacted with, when it will show a modal box which allows the user to enter the name of the Pokemon and save the location. When the next user comes along and searches the same location, the values added by previous users will be plotted in the map as markers. Here’s what the app will look like:
The full source code for the project is available on Github.
If you don’t have a good, isolated dev environment set up, it’s recommended you use Homestead Improved.
The box doesn’t come with CouchDB installed, so you’ll need to do that manually; but not just plain CouchDB. The app needs to work with geo data (latitudes and longitudes): you’ll supply CouchDB with the bounding box information from Google Maps. The bounding box represents the area currently being shown in the map, and all the previous coordinates users have added to that area would be shown on the map as well. CouchDB cannot do that by default, which is why you need to install a plugin called GeoCouch in order to give CouchDB some spatial superpowers.
The simplest way to do that is by means of the GeoCouch docker container. You can also try to install GeoCouch manually but it requires you to install CouchDB from source and configure it all by hand. I don’t really recommend this method unless you have a unix beard.
Go ahead and install Docker into the VM you’re using, and come back here once you’re done.
First, clone the repo and navigate inside the created directory.
<span>git clone git@github.com:elecnix/docker-geocouch.git </span><span>cd docker-geocouch </span>
Next, open the Dockerfile and replace the script for getting CouchDB with the following:
# Get the CouchDB source
RUN cd /opt; wget http://www-eu.apache.org/dist/couchdb/source/${COUCH_VERSION}/a$
tar xzf /opt/apache-couchdb-${COUCH_VERSION}.tar.gz
You need to do this because the download URL that’s currently being used is already failing.
Build the docker image:
<span>docker build -t elecnix/docker-geocouch:1.6.1 . </span>
This will take a while depending on your internet connection so go grab a snack. Once it’s done, create the container and start it:
<span>docker create -ti -p 5984:5984 elecnix/docker-geocouch:1.6.1 </span><span>docker start <container id> </span>
Once it has started, you can test to see if it’s running by executing the following command:
<span>curl localhost:5984 </span>
Outside the VM, if you forwarded ports properly, that’ll be:
<span>curl 192.168.33.10:5984 </span>
It should return the following:
<span>{"couchdb":"Welcome","uuid":"2f0b5e00e9ce08996ace6e66ffc1dfa3","version":"1.6.1","vendor":{"version":"1.6.1","name":"The Apache Software Foundation"}}
</span>Note that I’ll constantly refer to 192.168.33.10 throughout the article. This is the IP assigned to Scotchbox, which is the Vagrant box I used. If you’re using Homestead Improved, the IP is 192.168.10.10. You can use this IP to access the app. If you’re using something else entirely, adapt as needed.
You’re going to use the Slim framework to speed up the development of the app. Create a new project using Composer:
php <span>composer create-project slim/slim-skeleton pokespawn </span>
pokespawn is the name of the project, so go ahead and navigate to that directory once Composer is done installing. Then, install the following extra packages:
<span>composer require danrovito/pokephp guzzlehttp/guzzle gregwar/image vlucas/phpdotenv </span>
Here’s a brief overview on each one:
Access Futon from the browser and create a new database called pokespawn. Once created, go inside the database and create a new view. You can do that by clicking on the view dropdown and selecting temporary view. Add the following inside the textarea for the Map Function:
<span>git clone git@github.com:elecnix/docker-geocouch.git </span><span>cd docker-geocouch </span>
Once that’s done, click on the save as button, add pokemon as the name of the design document, and by_name as the view name. Press on save to save the view. Later on, you’ll be using this view to suggest Pokemon names based on what the user has entered.
Next, create a design document for responding to spatial searches. You can do that by selecting Design documents in the view dropdown then click on new document. Once in the page for creating a design document, click on the add field button and add spatial as the field name, and the following as the value:
# Get the CouchDB source
RUN cd /opt; wget http://www-eu.apache.org/dist/couchdb/source/${COUCH_VERSION}/a$
tar xzf /opt/apache-couchdb-${COUCH_VERSION}.tar.gz
This design document utilizes the spatial functions provided by GeoCouch. The first thing it does is check whether the document has a loc field in it. The loc field is an array containing the coordinates of a specific location, with the first item containing the latitude and the second item containing the longitude. If the document meets this criteria, it uses the emit() function just like a normal view. The key is a GeoJSON geometry and the value is an array containing the name of the Pokemon and the sprite.
When you make a request to the design document, you need to specify the start_range and the end_range which has the format of a JSON array. Each item can either be a number or a null. null is used if you want an open range. Here’s an example request:
<span>docker build -t elecnix/docker-geocouch:1.6.1 . </span>
And its output:
<span>docker create -ti -p 5984:5984 elecnix/docker-geocouch:1.6.1 </span><span>docker start <container id> </span>
If you want to learn more about what specific operations you can do with GeoCouch, be sure to read the documentation or the Wiki.
Now you’re ready to write some code. First you’re going to take a look at the code for the back-end then move on to the front-end code.
The app requires some Pokemon data to be already in the database before it can be used, thus the need for a script that’s only executed locally. Create a poke-importer.php file at the root of your project directory and add the following:
<span>git clone git@github.com:elecnix/docker-geocouch.git </span><span>cd docker-geocouch </span>
This script makes a request to the Pokedex endpoint of the Pokemon API. This endpoint requires the ID of the Pokedex version that you want it to return. Since Pokemon Go only currently allows players to catch Pokemon from the first generation, supply 2 as the ID. This returns all the Pokemon from the Kanto region of the original Pokemon game. Then loop through the data, extract all the necessary information, save the sprite, and make a new document using the extracted data.
Open the src/routes.php file and add the following routes:
# Get the CouchDB source
RUN cd /opt; wget http://www-eu.apache.org/dist/couchdb/source/${COUCH_VERSION}/a$
tar xzf /opt/apache-couchdb-${COUCH_VERSION}.tar.gz
Each of the routes will respond to the actions that can be performed throughout the app. The root route returns the home page, the search route returns the Pokemon name suggestions, the save-location route saves the location and the fetch route returns the Pokemon in a specific location.
Under the src directory, create an app/Controllers folder and inside create a HomeController.php file. This will perform all the actions needed for each of the routes. Here is the code:
<span>docker build -t elecnix/docker-geocouch:1.6.1 . </span>
The Home Controller uses the $renderer which is passed in via the constructor to render the home page of the app. It also uses the DB class which you’ll be creating shortly.
Create a Utils/DB.php file under the app directory. Open the file and create a class:
<span>docker create -ti -p 5984:5984 elecnix/docker-geocouch:1.6.1 </span><span>docker start <container id> </span>
Inside the class, create a new Guzzle client. You’re using Guzzle instead of some of the PHP clients for CouchDB because you can do anything you want with it.
<span>curl localhost:5984 </span>
The config is from the .env file at the root of the project. This contains the base URL of CouchDB.
<span>curl 192.168.33.10:5984 </span>
searchPokemon is responsible for returning the data used by the auto-suggest functionality. Since CouchDB doesn’t actually support the LIKE condition that you’re used to in SQL, you’re using a little hack to mimic it. The trick here is using start_key and end_key instead of just key which only returns exact matches. fff0 is one of the special unicode characters allocated at the very end of the basic multilingual plane. This makes it a good candidate for appending at the end of the actual string being searched, which makes the rest of the characters become optional because of its high value. Note that this hack only works for short words so it’s more than enough for searching for Pokemon names.
<span>{"couchdb":"Welcome","uuid":"2f0b5e00e9ce08996ace6e66ffc1dfa3","version":"1.6.1","vendor":{"version":"1.6.1","name":"The Apache Software Foundation"}}
</span>makeGetRequest is used for performing the read requests to CouchDB and makePostRequest for write.
php <span>composer create-project slim/slim-skeleton pokespawn </span>
savePokemonLocation saves the coordinates to which the Google map marker is currently pointing, along with the name and the sprite. A doc_type field is also added for easy retrieval of all the documents related to locations.
<span>composer require danrovito/pokephp guzzlehttp/guzzle gregwar/image vlucas/phpdotenv </span>
isValidCoordinates checks if the latitude and longitude values have a valid format.
<span>git clone git@github.com:elecnix/docker-geocouch.git </span><span>cd docker-geocouch </span>
fetchPokemons is the function that makes the request to the design document for spatial search that you created earlier. Here, you specify the southwest coordinates as the value for the start_range and the northeast coordinates as the value for the end_range. The response is also limited to the first 100 rows to prevent requesting too much data. Earlier, you’ve also seen that there are some data returned by CouchDB that aren’t really needed. It would be useful to extract and then return only the data needed on the front-end. I chose to leave that as an optimization for another day.
# Get the CouchDB source
RUN cd /opt; wget http://www-eu.apache.org/dist/couchdb/source/${COUCH_VERSION}/a$
tar xzf /opt/apache-couchdb-${COUCH_VERSION}.tar.gz
handleResponse converts the JSON string returned by CouchDB into an array.
<span>docker build -t elecnix/docker-geocouch:1.6.1 . </span>
Open composer.json at the root directory and add the following right below the require property, then execute composer dump-autoload. This allows you to autoload all the files inside the src/app directory and make it available inside the App namespace:
<span>docker create -ti -p 5984:5984 elecnix/docker-geocouch:1.6.1 </span><span>docker start <container id> </span>
Lastly, inject the Home Controller into the container. You can do that by opening the src/dependencies.php file and add the following to the bottom:
<span>curl localhost:5984 </span>
This allows you to pass the Twig renderer to the Home Controller and makes HomeController accessible from the router.
Now you’re ready to proceed with the front-end. First, create a templates/index.html file at the root of the project directory and add the following:
<span>curl 192.168.33.10:5984 </span>
In the
are the styles from the various libraries that the app uses, as well as the styles for the app. In the are the text field for searching locations, the map container, and the modal for saving a new location. Below those are the scripts used in the app. Don’t forget to replace YOUR_GOOGLEMAP_APIKEY in the Google Maps script with your own API key.For the main JavaScript file (public/js/main.js), first create variables for storing values that you will be needing throughout the whole file.
<span>{"couchdb":"Welcome","uuid":"2f0b5e00e9ce08996ace6e66ffc1dfa3","version":"1.6.1","vendor":{"version":"1.6.1","name":"The Apache Software Foundation"}}
</span>Next, create the function for initializing the map. A min_zoomlevel is specified to prevent users from zooming out until they can see the entirety of the world map. You’ve already added a limit to the results that can be returned by CouchDB, but this is also a nice addition to prevent the users from expecting that they can select data from the whole world.
php <span>composer create-project slim/slim-skeleton pokespawn </span>
Create the marker for pin-pointing locations that users want to add. Then, add an event listener for opening the modal for adding locations when the marker is pressed:
<span>composer require danrovito/pokephp guzzlehttp/guzzle gregwar/image vlucas/phpdotenv </span>
Initialize the search box:
<span>function(doc){
</span> <span>if(doc.doc_type == 'pokemon'){
</span> <span>emit(doc.name, null);
</span> <span>}
</span><span>}
</span>Add various map listeners:
<span>{
</span> <span>"points": "function(doc) {\n if (doc.loc) {\n emit([{\n type: \"Point\",\n coordinates: [doc.loc[0], doc.loc[1]]\n }], [doc.name, doc.sprite]);\n }};"
</span><span>}
</span>Add an event listener for when the place in the search box changes.
<span>curl -X GET --globoff 'http://192.168.33.10:5984/pokespawn/_design/location/_spatial/points?start_range=[-33.87049924568689,151.2149563379288]&end_range=[33.86709181198735,151.22298150730137]' </span>
The fetchPokemon function is responsible for fetching the Pokemon that were previously plotted in the currently viewable area of the map.
<span>git clone git@github.com:elecnix/docker-geocouch.git </span><span>cd docker-geocouch </span>
This is the code for adding the auto-suggest functionality of the text field for entering the name of a Pokemon. A renderItem function is specified to customize the HTML used for rendering each suggestion. This allows you to add the ID of the Pokemon as a data attribute which you then use to set the value of the pokemon_id field once a suggestion is selected.
# Get the CouchDB source
RUN cd /opt; wget http://www-eu.apache.org/dist/couchdb/source/${COUCH_VERSION}/a$
tar xzf /opt/apache-couchdb-${COUCH_VERSION}.tar.gz
When the Save Location button is pressed, a request is made to the server to add the Pokemon location to CouchDB.
<span>docker build -t elecnix/docker-geocouch:1.6.1 . </span>
Create a public/css/styles.css file and add the following styles:
<span>docker create -ti -p 5984:5984 elecnix/docker-geocouch:1.6.1 </span><span>docker start <container id> </span>
By default CouchDB is open to all. This means that once you expose it to the internet, anyone can wreak havoc in your database. Anyone can do any database operation by simply using Curl, Postman or any other tool for making HTTP requests. In fact, this temporary state even has a name: the “admin party”. You’ve seen this in action in the previous tutorial and even when you created a new database, a view and a design document earlier. All of these actions can only be performed by the server admin but you’ve gone ahead and done it without logging in or anything. Still not convinced? Try executing this on your local machine:
<span>curl localhost:5984 </span>
You’ll get the following as a response if you don’t already have a server admin on your CouchDB installation:
<span>curl 192.168.33.10:5984 </span>
Yikes, right? The good news is there’s an easy fix. All you have to do is create a server admin. You can do so with the following command:
<span>{"couchdb":"Welcome","uuid":"2f0b5e00e9ce08996ace6e66ffc1dfa3","version":"1.6.1","vendor":{"version":"1.6.1","name":"The Apache Software Foundation"}}
</span>The command above creates a new server admin named “kami” with the password “mysupersecurepassword”.
By default, CouchDB doesn’t have any server admin so once you create one, the admin party is over. Note that server admins have god-like powers so you’re probably better off creating only one or two. Then create a handful of database admins who can only perform CRUD operations. You can do so by executing the following command:
php <span>composer create-project slim/slim-skeleton pokespawn </span>
If successful, it will return a response similar to the following:
<span>composer require danrovito/pokephp guzzlehttp/guzzle gregwar/image vlucas/phpdotenv </span>
Now you can try the same command from earlier with a different database name:
<span>function(doc){
</span> <span>if(doc.doc_type == 'pokemon'){
</span> <span>emit(doc.name, null);
</span> <span>}
</span><span>}
</span>And CouchDB will shout at you:
<span>{
</span> <span>"points": "function(doc) {\n if (doc.loc) {\n emit([{\n type: \"Point\",\n coordinates: [doc.loc[0], doc.loc[1]]\n }], [doc.name, doc.sprite]);\n }};"
</span><span>}
</span>For this to work, you now have to supply your username and password in the URL like so:
<span>git clone git@github.com:elecnix/docker-geocouch.git </span><span>cd docker-geocouch </span>
Ok, so that’s it? Well, not really because the only thing you’ve done is limit database operations that can only be done by server admins. This includes things like creating a new database, deleting a database, managing users, full-admin access to all databases (including system tables), CRUD operations to all documents. This leaves you with unauthenticated users still having the power to do CRUD stuff on any database. You can give this a try by logging out of Futon, pick any database you want to mess around with and do CRUD stuff in it. CouchDB will still happily perform those operations for you.
So, how do you patch up the remaining holes? You can do that by creating a design document that will check if the username of the user who is trying to perform a write operation (insert or update) is the same as the name of the user that’s allowed to do it. In Futon, log in using a server admin or database admin account, select the database you want to work with, and create a new design document. Set the ID as _design/blockAnonymousWrites, add a field named validate_doc_update, and set the value to the following:
# Get the CouchDB source
RUN cd /opt; wget http://www-eu.apache.org/dist/couchdb/source/${COUCH_VERSION}/a$
tar xzf /opt/apache-couchdb-${COUCH_VERSION}.tar.gz
The new version of the document, the existing document, and the user context are passed in as an argument to this function. The only thing you need to check is the userCtx which contains the name of the database, the name of the user who’s doing the operation, and an array of roles assigned to the user.
A secObj is also passed as the fourth argument, but you don’t really need to work on it; that’s why it’s omitted. Basically, the secObj describes what admin privileges have been set on the database.
Once you’ve added the value, save the design document, log out, and try to create a new document or update an existing one and watch CouchDB complain at you.
Since you’re only checking for the username, you might be thinking that attackers can simply guess the username and supply any value to the password and it would work. Well, not really, because CouchDB first checks if the username and password are correct before the design document even gets executed.
Alternatively, if you have many users in a single database, you can also check for the role. The function below will throw an error at any user who doesn’t have the role of “pokemon_master”.
<span>docker build -t elecnix/docker-geocouch:1.6.1 . </span>
If you want to learn more about how to secure CouchDB, be sure to check out the following resources:
Let’s wrap up by updating the app to use the security measures that you’ve applied to the database. First update the .env file: change the BASE_URI with just the IP address and the port, and then add the username and password of the CouchDB user that you’ve created.
<span>git clone git@github.com:elecnix/docker-geocouch.git </span><span>cd docker-geocouch </span>
Then, update the constructor of the DB class to use the new details:
# Get the CouchDB source
RUN cd /opt; wget http://www-eu.apache.org/dist/couchdb/source/${COUCH_VERSION}/a$
tar xzf /opt/apache-couchdb-${COUCH_VERSION}.tar.gz
That’s it! In this tutorial, you learned how to create a Pokemon spawn locations recorder app with CouchDB. With the help of the GeoCouch plugin, you were able to perform spatial queries, and you learned how to secure your CouchDB database.
Do you use CouchDB in your projects? What for? Any suggestions / features to add into this little project of ours? Let us know in the comments!
Pokemon spawn locations in Pokemon Go are typically found in areas with high cellular activity. These areas can include parks, shopping centers, and other public places. The Pokemon Go app uses GPS to track your location and spawns Pokemon based on your surroundings. You can also use third-party apps or websites like Pokemap.net to find spawn locations. However, be aware that using third-party services can violate the terms of service of Pokemon Go and may result in a ban.
A biome in Pokemon Go is a specific geographic area that influences what types of Pokemon spawn there. For example, water-type Pokemon are more likely to spawn near bodies of water, while grass-type Pokemon are more likely to spawn in parks or forests. Understanding the different biomes can help you predict where certain types of Pokemon are likely to spawn.
You can record Pokemon spawn locations using a variety of methods. One method is to use a database like CouchDB to store the locations of Pokemon spawns. This involves using the Pokemon Go API to retrieve spawn data and then storing this data in CouchDB. You can then use this data to analyze spawn patterns and predict future spawn locations.
Yes, you can use Pokemon spawn location data to predict future spawns. By analyzing the data, you can identify patterns in the spawn locations and times. This can help you predict where and when certain types of Pokemon are likely to spawn in the future.
Yes, there are risks associated with using third-party apps or websites to find Pokemon spawn locations. These services can violate the terms of service of Pokemon Go and may result in a ban. Additionally, these services may not always provide accurate or up-to-date information.
The Pixelmon mod for Minecraft allows you to find Pokemon spawn locations within the game. The mod includes a feature that shows the spawn locations of Pokemon on a map. You can use this feature to find and catch Pokemon within the game.
The Tenorshare Pokemon Go map is a third-party service that provides a map of Pokemon spawn locations. The map is updated in real-time and includes information on the types of Pokemon that are spawning and their exact locations. However, be aware that using this service can violate the terms of service of Pokemon Go and may result in a ban.
The PogoMap website provides a map of Pokemon spawn locations. The map is updated in real-time and includes information on the types of Pokemon that are spawning and their exact locations. You can use this website to find and catch Pokemon in your area.
Yes, you can contribute to the PogoMap website by reporting Pokemon spawn locations. This helps to keep the map up-to-date and accurate. However, be aware that reporting false information can result in a ban from the website.
Yes, there are other methods for finding Pokemon spawn locations. For example, you can join local Pokemon Go communities or forums where players share information about spawn locations. You can also use the in-game Nearby feature to find Pokemon that are close to your current location.
The above is the detailed content of How to Create a Pokemon Spawn Locations Recorder with CouchDB. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
