There is a lot of confusion about the use of canonicals and HREFLang tags.   


Error 1 - Canonical and HREFLang are not interchangeable - you must use the hreflang element for each page that has an alternate.  


Error 2 - Dominate Page Canonical  If you use the URL for site A in the canonical tag on site B, the page on site B will NOT be indexed as you are telling the search engine that is the preferred page.    


For example 

Page A Code 

<link rel="alternate" hreflang="en" href="http://www.example.com/en/page-a"/>

<link rel="alternate" hreflang="en-gb" href="http://www.example.com/uk/page-b"/>

<link rel="canonical" href="http://www.example.com/en/page-a" />


Page B Code 

<link rel="alternate" hreflang="en" href="http://www.example.com/en/page-a"/>

<link rel="alternate" hreflang="en-gb" href="http://www.example.com/uk/page-b"/>

<link rel="canonical" href="http://www.example.com/uk/page-b" />


Page A has both HREFLang elements and a canonical to itself 


Page B has both HREFLang Elements and a canonical to itself


Below is an example how this simple misunderstand can be a disaster.  The Webmaster read a blog post that told him to add a canonical back to the original page.  He added that to all pages instead of the self-referencing HREFLang element. 




In this example, the source on the Singapore page, https://www.examplesite.com/sg/  we see the HREFLang Element is correct but look below next to the red star and you will see that the Singapore page has a canonical set to the global site.  As such, search engines will not index the /sg pages resulting in a hreflang alternate "not found error".


This eliminated ever page for the 4 other sites from Google and traffic tanked.   So NEVER use a canonical back to the original English version unless you don't want the local version indexed.