Vue router with hash mode doesn't work on Github Pages - vue.js

Can't navigate a specific page by url
Hello everyone, I have a little problem, I had a "boilerplate" project with Vue3 + Laravel. And I wanted to use link so people can navigate specific page, for example here's a link you can navigate
https://klim2020.github.io/
After that you are able to open portfolio page by clicking on Portfolio link at the right top of the page. As you see you have that
/cv/en
adress at the address bar
But if you will try to navigate this link from other source you will get Error
Cannot GET /cv/en
try to navigate from here https://klim2020.github.io/cv/en
Why is this happening can you tell me please?

First off, I do recommend hosting on Netlify or Vercel, those will fix the issue that you do have here.
GH pages are just not worth it. And the other 2 services are more flexible, as free and quite powerful.
The issue here being that if you go to a specific path with a "hard navigation", not a client-side one (via vue-router), you SPA will not be in that specific endpoint. Hence why, you will get a 404 (your initial entry point is available a /).
You also need to use the history mode rather than the current # that you do have in your path.
Best thing? The part explaining how to solve your current issue with Netlify/Vercel is also explained in a section below (mainly providing a redirects/rewrites configuration).

Related

how do you tell if a website is using docusaurus?

How can you tell if a documentation website is using Docusaurus?
Take for example this website:
https://beta.openai.com/docs/api-reference/introduction
I suspect that it was build with Docusaurus but I didn't find any browser extension to confirm it.
It's not built with Docusaurus.
It is simple to identify. Take the Algolia website for example, if you view the page source of any page, and search for docusaurus, you can find some results:

Branch.io architecture query

I have the following requirement and based on the branch docs I cannot get myself a straight answer.
We want to enable deep links that if the user has the app installed that it uses them and if not redirects to download then redirects.
If the user is on a desktop they get redirected to a page to download app.
We want to control all the actual deep linking using react navigation config and wanted to know how we can pair the two!? The guides are very poorly written and makes understanding the flow a nightmare.
Some guidance and suggestions on how best to accomplish this would be great.
P.s. are the links generated that when app found it takes the prefix and replaces with appname:// ??
Your requirement for deep linking can be handled with Branch, you can set the URI schemes of the apps under the link settings of your Branch dashboard and also mention your app on PlayStore/Appstore for the user to download the app when clicked on the link.Similarly you can add the redirection URLs for the scenarios when your link is clicked on a desktop.
Alternatively you can use our React SDK to create links with all these link properties and even more. More details here.
The handling of the deep link data and redirecting the user to the desired page can be found here.
If you wish to know more about how Branch passes data through to the app and attributes app sessions, check this.

How can I deep link into a Vue.js project on GitHub Pages?

I have a practise repository in GitHub (see https://jdomleo.github.io/vue-deploy-practise).
Navigate to "About" in the navigational list at the top:
You will see in the URL, it has appened /about, as expected. However, if I give people the URL https://jdomleo.github.io/vue-deploy-practise/about, they get a 404 error from GitHub Pages.
My question is, how can I configure my Vue.js project to allow deep linking?
See link to GitHub repository https://github.com/JDomleo/vue-deploy-practise.
You have to add a custom 404.html page to your github pages that reroutes the request using javascript.
The first problem though is that you have enabled HTML5 History Mode, that requires a server to be set up to handle that and I don't think github pages allows for it.
Once you fixed that you have a couple of options.
Here is one example on how the 404 page uses the local storage to reroute the app. https://medium.com/swlh/how-to-host-your-angular-reactjs-vuejs-spa-on-github-pages-2d9ab102ac7b
Another is simple to change the url to a fragment instead of path, similar to the method used in this library https://github.com/rafrex/spa-github-pages. This library maight even just work for you.

Branch.io links not tracking clicks after custom subdomain setup

BACKGROUND
I have an app that was set up using a default branch domain (ex: my.app.link).
Links were created using my.app.link. Many of these links needed to mirror existing links I have in production (with another linking service that we are migrating off of) that use a format not supported in Branch.io, so I had to work around the issue by using a '-' in place of '.' in the link's path. This is a solution recommended by Branch with the assurance that the '.' would be translated to a '-' on the backend at Branch.io (this appears to work fine).
I recently had a custom subdomain CNAMEd over to custom.bnc.lt (ex: myapp.mydomain.com).
The link settings in the Branch.io dashboard have been updated to use the custom subdomain (change is valid: "Domain is correctly set up and SSL is working.").
ISSUES
All pre-existing quick links still have the old default domain, no clicks register even though they 'work' with the new subdomain.
Duplicating one of these links picks up the new subdomain, but the url that gets created is http, not https (which is the default for any other link we created and there doesn't seem to be a way to choose one protocol or the other, nor can it be updated in the dashboard). This also seems to be causing link clicks to not track in the dashboard.
The fact that we mirrored links from another platform using a workaround (replacing '.' for a '-'), also seems to cause link clicks to not track in the dashboard.
QUESTIONS
How does Branch.io handle link clicks for a quick link that has been set up for an app using a custom subdomain? Does the configured link need to match 1:1 to the link that is clicked on the device?
How can I fix the original links, especially if I can't duplicate them (to pick up the custom subdomain) in a way that gives me a 1:1 match to the previous link I created (since the new link is http and the others are https, as would be distributed in a live/production environment)?
Why isn't Branch tracking link clicks for the x.y.z links that I set up as x-y-z? This aliasing works fine, and seemed to be tracking clicks fine in test.
Amruta from Branch.io here:
1. How does Branch.io handle link clicks for a quick link that has been set up for an app using a custom subdomain?
A: For all Branch links, every time a Branch link is clicked the click is is registered by Branch. Using a custom domain (if configured properly) should not cause any problems in registering clicks on the Branch dashboard neither should using Quick links cause any issues. Also Branch links with either schemes http:// or https:// register link clicks. Having Branch links with http:// scheme should not cause any issues with registering link clicks
2.All pre-existing quick links still have the old default domain
A: The old links created on the app.link will not be updated with your custom domain. If you wish to use links with your link domain, you can create new links with the same link parameters. (PS: both links on the old app.link domain and links on your custom domain should work as before if you still have your App configured to support the app.link domain links.)
3. Duplicating one of these links picks up the new subdomain, but the url that gets created is http, not https
A: At present, the Branch API creates Branch links for custom domains with the 'http://'scheme. This is because we are not sure if custom domains have the SSL certificate and creating links with the https:// scheme would break for such domains. Hence by default, all custom domain links are created using the http:// scheme. There is no direct way to create links using the https:// scheme using the Branch API, the only way you can do it is by manually changing the scheme from 'http' to 'https://'.
4. Why isn't Branch tracking link clicks for the x.y.z links that I set up as x-y-z? This aliasing works fine, and seemed to be tracking clicks fine in test.
I believe, the issue here has nothing to do with your custom domain but is maybe related to a key mismatch. You mention that the link clicks were tracked in the test version of the App, which leads me to believe that your app is still using the Branch key from the test version (key format: key_test_XXXXXXXXXXXXXXX). Please ensure that your App is using the correct key. The simple test for this: When you click on the Branch link, you get the link parameters in your app and the link parameters contain +clicked_branch_link:true. If so, the link click will be tracked on Branch's end.
If you still continue to face issues, you could write to integrations#branch.io and our team would be more than happy to help you resolve the issue.

Unable to Share URLs to Google+

This issue began last week. Prior to that, I was not having any problems, and I am not aware of any changes to my site or platform.
Now, when I want to share a new blog or article to Google+, it fails. Typically I would use the embedded +1 buttons on a specific post and use the expanded box to create my post. The box comes up, but instead of a nice title and image, it now uses the URL only for the page, and sometimes adds extra characters to the end of the URL. If I take the URL from the address bar and try to compose a new update directly on Google+, I get the same issue. If I enter the URL into the Link field on a status update, it usually comes back "could not load website."
Here's a sample
You'll find Google+ sharing buttons above and below the article. Sharing to every other network works as expected.
My site is a Drupal site that has been operating for 10 months. I am a Drupal developer, but have never encountered an issue like this.
It appears that requests from the Googler crawler are being rejected by your server. I tried testing the microdata with the structured data testing tool and it runs into problems connecting to your site. Other sites work fine.
If you have access to your site's Apache access logs, I would check those for problems coming to that URL. You can narrow your search down by looking for the user agent of the crawler: Google (+https://developers.google.com/+/web/snippet/)
My guess is that something changed in your server's configuration that is the cause. Start with the logs and see what's there.