Don't get mad at me when I'm announcing that the server this blog is on hasn't been updated for the same amount of time the last time I posted. It's reality. We move on to other things in life, that explains the abscence even though this blog is still existing. With that out of the way, I'll start squeezing updates for the server the blog is on and see anything else I can do from there.

Until then,

~rhz

I usually encounter this issue every now and then. Sometimes it can be fixed on my end while other times it's fixed on the developer's end. It could get problematic if future maintainers do not know where it is configured. There are three possible ways where CORS can be configuered, namely through

• Service Provider
• HTTP Server
• Application

Service Provider could mean it can be configured over the management consoles of, i.e. AWS, Azure, GCP, and among others. HTTP Servers such as Nginx and Apache. And lastly through the application. How it implemented will depend on how the infrastructure is architected.

Whenever possible I would recommend in configuring it through the service provider. This would leave out the burden for system administrators or developers in having to do it on their end. If that's not possible, the HTTP server will then suffice. Only do it inthe application as a last resort or by the limitation of not doing it through the other two.

Service Provider

Documentation for configuring CORS in AWS's console can be found here. It comes with two options, enabling it over GUI in the console or enabling it with OpenAPI definition.

HTTP Server

Configuring it in Nginx will fall into the location block.

location / {
  add_header "Access-Control-Allow-Origin" * always;
  add_header "Access-Control-Allow-Credentials" *;
  add_header "Access-Control-Allow-Methods" *;
  add_header "Access-Control-Allow-Headers" *;
  proxy_set_header HOST $host;
  proxy_set_header X-Forwarded-Proto $scheme;
  proxy_set_header X-Real-IP $remote_addr;
  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

  proxy_pass http://upstream;
}

Application

Probably the easiest to integrate it is through the application itself. I'll be using flask in this article.

Install Flask-CORS with pip install flask-cors

app = Flask(__name__)
cors = CORS(app, resources={r"/api/*": {"origins": "*"}})

Final Thoughts

From the examples above, it is recommended to limit the origin only through the domain in which it is needed. And I hope that you dear reader may have an idea on how to properly architect your APIs with this read.

Resources

1: https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

Packages

• Nginx
• PHP*
• MariaDB

There is an alternative way in installing the packages by using the Chocolatey package manager. The only caveat is you can't customize the installation directory in the free version. If you're willing to shell out $96/yr to free you of worry. Then why not?

* Download the Non Thread Safe as it fits with Nginx

Setting Up

You could create a directory under any drive of your choice with my existing structure as reference.

/c/Dev/Bin
/c/Dev/Programs
    : /nginx
    : /php
/c/Dev/Code

There is a Bin folder included which we will use to add it in our system path and linking binaries using batch and bash.

In the Bin folder we will have a batch script that acts a runner to boot up Nginx and PHP. It is a modified version of the original batch script I have been using over the years.

/c/Dev/Bin/servers.cmd

Finally add "C:\Dev\Bin" to your path of your environment variables. Now you can now call "servers.cmd" in MINGW64 or "servers" in Command Prompt.

"Write code as if monkeys would be able to read it".

Easy said than done. Think about it, if people treat programming as poetry. Then even a beginner would be able to understand what you wrote on sightread.

There was a recent airline accident, which led to numerous delays and eventually become cancellations in the most busiest airports in the country. It happened just when passengers are flocking in to spend their vacation due to holidays in the upcoming week. Though what comes after the accident infuriates me the most.

Being a traveler myself, I have my fair share of delays on different circumstances. I can recall at least three.

• The airline crew manning the gate never had a single clue what happened to our aircraft which delayed the flight for at least three hours. The PA system also informed us that the plane didn't arrive yet. When actually the plane (Airbus A330) was just in front of us all along! Apparently the maintenance crew have to replace one of its wheels for safety reasons if I would assume so. What ticked me off is when they never used any kind of power tools for it!

• Same airline as above but a different case. Boarding was delayed for an hour and another hour by the time we got on. There was a medical emergency that happened the flight before and we were not cleared for taxi unless the required medical equipment was replenished. The airline crew still never had a single clue of what happened.

• Flight was delayed for six hours after assumingly the pilots declared the aircraft we're about to fly into is not fit for flying. Imagine your flight is delayed for six long hours, how would you feel? I for one, just want to be at my destination and go to bed right way. Unfortunately the case for my fellow passengers were far more worse. I can assume most of them are on the last leg of their trip from an international flight. I can also assume that they haven't got enough sleep and now are getting agitated and/or irritated on what the hell is going on with their flight. As I mentioned in the two examples above, the airline crew never had a single clue.

What infuriates me the most is not with any kind of incident but with the passengers themselves. Traveling is not supposed to be a one way ticket for whatever reason your trip is. There will always be unforseen circumstances that sidelines us from the original plan. People will talk about contingency plans after and not before it happens.

It all starts by the time you book your ticket. It's common knowledge that you should be getting travel insurance every single time. Good if you're booking it yourself but not for the rest who book their tickets in travel agencies and in ticketing booths. Not buying insurance just to cut down your expenses will be the single biggest mistake you'll be making when you're traveling. You'll be in a different world of hurt and nothing can save you other than the huge fees you'll be paying, if you're willing to.

Apart from that, another thing that infuriates me is when passengers are getting ahead of themselves in the check-in counter. This happens a lot of times when I'm on budget airlines. They start complaining when their baggage are either oversized or overweight then will pick up a fight since they don't like to pay additional fees. If I can recall your baggage allowance is stated over your itinerary document. Isn't it hard for everyone to read it?

Going back, what happened last Friday was tragic but I can't help myself getting mad with people who know nothing of the basics of air travel. Accidents happen but it isn't the airport's responsbility to take care of stranded passengers. That's the job of the airline. If the airline doesn't cooperate with their grievances, then they have the opportunity to escalate it to the Civil Aeronautics Board. We also do not need another senate inquiry. The gesture is noble but it always end up being unproductive and wasting everyone's time.

I've written an article before that describes my first experience with the asynchronous nature of Javascript. In this article I'm going to expand further on what I've learned

Making The Asynchronous, Synchronous

While going further with the project later did I realize on how to use the sorcery of async and await. Being a lazy uneducated programmer I am. I usually skip explanations in favor the result of the source code or the snippet may bring.

The way I see it, I usually encounter certain types of tutorials or guides; In which I have to watch a whole video, or skim through the whole article just to get an idea on its behavior. This doesn't sit well with me as I'm impatient and lazy. I skip to the part seeing how it works or copy and pasting the code to see if it works then torturing myself on the explanation. Only then ironically, I'll have an interest on almost anything technical.

The simplest and dumbed down explanation on the usage of async / await is to make the process syncrhonous or blocking. As what I've stated in the previous article. I'm used to blocking behavior so I'll assume that the process is synchronous as long as I use the two keywords. And that didn't go well for me at first.

async foo() : Promise {
  // process here
  return Promise.resolve(true);
}

var bar = await foo();

Yes, I know. It is dumb. I should've been more diligent enough to read first, but in the spirit of programming. Understanding things based on trial and error is where I grew from.

async foo() : Promise {
  return new Promise((resolve, reject) => {
    // process here
    resolve(true);
  });
}

var bar = await bar();

It took a good night worth of sleep just to realize that what I've been doing is all wrong. The right way of doing it is to do the process within the Promise and only then it behaved from what I originally expected.

Dive In!

Two months ago I was given a project to work in a mobile app that I decided to be written in the Ionic Framework. Working with the framework was a fun experience which I found a new love and hate relationship with the Javascript ecosystem. Though I haven't delved into the specifics, learning something new is definitely the most rewarding thing out of it.

Everything should be straightforward unless you're emulating over a browser. One of those is every HTTP request is treated as a CORS request. This only applies for local development.

Take below as an example.

const headers = new HttpHeaders({'Content-Type': 'application/json'});

this.http.post(ENV.API_ENDPOINT + '/oauth/token'), {
      username: credentials.email,
      password: credentials.password,
      client_id: ENV.API_CLIENT,
      client_secret: ENV.API_SECRET,
      grant_type: 'password'
    }, {headers: headers})
    .toPromise();

Normally you would expect the request would translate as 200 POST https://domain.tld/oauth/token but instead it would request 200 OPTIONS https://domain.tld/oauth/token before doing a POST request. The solution was straightforward, setup a proxy url.

// ionic.config.json
"proxies": [
    {
      "path": "/oauth/token",
      "proxyUrl": "http://domain.local/api/oauth/token"
    }
]

Now we just need to replace URL parameter for http.post.

const uri = '/oauth/token';

this.http.post((ENV.ENVIRONMENT === 'production' ? ENV.API_ENDPOINT + uri : uri), {

After running ionic serve again everything is now running smoothly.

Async Storage?

The most frustrating part was working with the storage component. Looking through the documentation it's very straightforward enough. You only need to speciy key and value parameters to save the data. The symptom started showing when I was going to redirect the user to the HomePage.

Below is an excerpt from home.ts

this.storage.get('user').then((data) => {
  this.name = data.name;
  this.email = data.email;
}).catch(err => {
  console.log(err);
});

It took at least two pages before I data is populated. What was happening behind was interesting. Lets just assume that we're still about to authorize into the system. This makes the value of user is undefined. Now when you're successfully authorized the value of user turns null. What I expected from the start that it should contain the User object. It only returns the correct object after getting redirected over and over for at least two to three times.

The solution was to wait it out. I made a placeholder page which turned into a processing page for data syncing tasks. Then set a sleep timer for at least 3 to 5 seconds or if there are successful promises returned.

Conclusion

Coming from languages with blocking background this was my first taste in experience how asynchronous processes work. A good lesson learned while getting through a hellish language.

This post is long due after I posted my blog post of losing a phone. After getting a new phone I then downloaded Uber & Grab. When trying to login with my usual credentials. I quickly hit the wall as a security measure, an SMS code should be inputted. Being quite in a dilemma, the most sanest choice is to contact customer support of both companies.

Retrieving my Uber account was easy as they only need to change the phone number in the system. By the time Grab replied to my ticket, I'm about to hit another wall.

Good day!

Thank you for your email and we appreciate your time reaching us today! This is -redacted-, a member of Grab's Customer Experience team.

I want to apologize for the inconvenience this has caused you. We do not suggest our passengers to change the phone number you already registered in your account as per Technical Team confirmed that the passenger might encounter problems if they choose to change there phone number.

Every phone number this is already tied up with the account they initially created as per advise as well by our Technical Team to prevent fraudulent activities.

If passenger choose to change the phone number they need to create another account and deactivate the previous account they have but then the points and tier they gained will be automatically lost. What we can also suggest is to put the number to the driver's note in the booking passengers made to informed drivers.

We hope this information was of helps!

Reading it again I don't know if I should cry or throw a huge tantrum as my bullshit meter is about to go full. I want to ask a few questions for myself.

Technical Team confirmed that the passenger might encounter problems if they choose to change there phone number.

Is this serious?

Every phone number this is already tied up with the account they initially created as per advise as well by our Technical Team to prevent fraudulent activities.

Are you fucking serious?

And lastly.

If passenger choose to change the phone number they need to create another account and deactivate the previous account they have but then the points and tier they gained will be automatically lost.

This is absolute bullshit.

Going over it and I'm sorry if I have to throw accusations but if that's the logic of the technical team on implementing such security measure. 1) That's not they're department to do so & 2) They're totally inept security practices at all. Let alone if the point of customer service is to relieve the inconvenience of your customer, you're intentionally giving more inconvenience to them.

What could have caused this problem?

The only reason to believe that this problem exist is when the technical team made the phone number, the primary key in the database. If they're using relational databases that's adding insult to injury. If they're using NoSQL then it arbitrarily explains the nonsensical reason they gave me.

I still don't get it why they have to deactivate or delete the account just to have a new number associated with it.

That's not the end of it.

At first when I tried logging in with a social button. I.e. Google Login; It either do the following 1) if the email is associated with a registered user, ask the user to login 2) if the email is not associated, do the usual register flow. When I tried it on Grab, it immediately gave an error "email already exists". I was completely dumbfounded by this. How come this very simple flow was never implemented in the first place? And how come this is overlooked?

Being a programmer myself, it stressed me out very much.

Going over with Uber's support was very smooth I only need to fill up my name, phone number on file, two recent uber trips made, email on file, and other details regarding about the concern. Support replied and asked me for confirmation to change the phone number, I replied the affirmative, poof number changed! That simple! Not only that, when I tried logging via social button, it asked me to input user credentials. That's a major difference right for user experience.

The lessons to be learned from this are,

1. Never let the technical team do security implementations that will cause a user inconvenience
2. Catch the earliest signs of user experience design flaws before you're causing more inconvenience to the user

A little while back I was engaged into a project that centers around Yii2. Though it has one problem. Configuration. Yep. The configuration for Yii2 is a total mess.

To give you a better perspective on how it works, each module has its own configuration folder and a common configuration folder. Lastly each having their own web or www/public folder.

To wire all of them together it does require_once or include throughout the header of a config file. Adding to the mess is production config values are included in the SCM! To remedy this I have to do three things

• Centralize the configuration
• Config values utilize environment variables from an .env file
• Centralize the public folder

Other Problems

Throughout the whole ordeal I encountered certain problems that gave me an initial perspective on how Yii2 works in the background. I have to do some quirks in order to go around these problems and make the site work.

• base_path is based on the module base directory. It created a problem whereas aliases for assets, views, and config files will resolve to the module's base path instead of the newly altered structure.
• request, errorHandler components when included in the console config creates an error in the default yii console runner.

Structure

The two most significant changes on the Yii project is the addition of a config/, public/ folders with their respective files and a console runner that can run the changes made throughout the structure.

One of the biggest advantages in the new structure is you don't have to worry about same values in your configs throughout in your project/module directories. Lastly it provides a reasonable improvement in leaving out sensitive values out from the SCM.

Source Code

The code speaks for itself. If you have questions please contact me over Twitter.

Here we go again and hopefully I wont neglect the responsibility to keep up a simple blog. Things recently are changing, fast. Really fast. To keep up with what's going on, I'll maintain hopefully this one.

I wont speculate what I'm going to write in the coming weeks but it's going to range from a variety of interests. If you personally know me you might be already familiar of what I'm going to post so I'll just leave it to that.

Cheers,
rhz