I use this link for sharing my page via google plus.
https://plus.google.com/share?url=http%3A%2F%2Fexample.com%2Fcompany%20name%2search
so I use encodeURIComponent for getting this url (also tried to use encodeURI).
but when sharing box appears link is incorrect. It is:
http://example.com/company
Forsure I can change ' ' with, for example, '-' (or another symbol), but I use value from url in my AngulaJs app for correct initializing and it will be better to use native way for this.
What is my fault or are there any native ways to fix this?
%20 is an encoded space which is not a valid URL character. The most commonly used character instead of a space is a -.
The best approach would be to normalize the input into an ID that you will use to query your own database. E.g. Bob's Bar & Grill would get processed to bobs-bar-grill and then you would query your database to find:
{
"id": "bobs-bar-grill",
"name": "Bob's Bar & Grill"
}
This both makes your URLs clean and better protects you from a security perspective of random user content in URLs.
As a last resort you could double encode the path so that Google still has encoded spaces after it decodes the URL once.
var url = "http://example.com/company name";
encodeURI(encodeURI(url));
// "http://example.com/company%2520name"
And Google will send users to http://example.com/company%20name
Related
i am using firebase for my project ,the documentation gives me the endpoint for signing in users as:
https://identitytoolkit.googleapis.com/v1/accounts:signInWithPassword?key=[API_KEY]
i want to know what does the colon : mean, for example the word key after the question mark shows its a parameter likewise what does the notion accounts:signInWithPassword mean.The reason:I have an axios instance with config:
axios.create(
{
baseURL:"https://identitytoolkit.googleapis.com/v1",
params:{
apiKey:"somekey"
}
})
now since the baseUrl shown above remains same for firebase signing in with email and password or signing up with email and password. I want to dynamically embed accounts:signInWithPassword and accounts:signUp for respective requests and i am not sure if specifying accounts:respectiveUsecase in params object would work.
A colon doesn't have any special meaning in an URL path. It's just a convention those APIs tend to use in their paths.
There are a handful of metacharacters that do:
question marks (?) and hashes (#) delimit the query or search parts
% is used for escaping characters (e.g. %0A)
+ is sometimes an encoding for a space instead of %20.
& generally separates query parameters (e.g. foo=bar&baz), though this is not a part of the standard. Some server software could expect e.g. semicolon-separated parameters.
As #deceze pointed out, colons do have a special meaning in the host part, e.g. https://user:pass#host/path:where:colons:do:not:matter.
It is a dynamic value (like a parameter where you in pass in a value directly)
:nounId: The colon (:) before the word indicates that we don't mean the literal string "nounId" as part of the endpoint, but rather that we are expecting some dynamic data to be inside there. From the above example of /ski/:skiId, one actual endpoint might be something like /ski/1234 (where 1234 is the unique ID number of one of the skis in our database.
source: https://coursework.vschool.io/rest-api-design/#:~:text=%3AnounId%20%3A%20The%20colon%20(%3A)%20before,data%20to%20be%20inside%20there.
I wanted to navigate to a URL using queryParams while Routing in Angular.
<a routerLink='/master' [queryParams]="{query:'%US',mode:'text'}"><li (click)="search()">Search</li></a>
The URL I wanted to navigate is:
http://localhost:4200/master?query=%US&mode=text
But when I click on search it navigates me to:
http://localhost:4200/master?query=%25US&mode=text
I do not know why 25 is appended after the % symbol. Can anyone tell me a cleaner way to navigate correctly.
In URLs, the percent sign has special meaning and is used to encode special characters. For example, = is encoded as %3D.
Certain special characters are not allowed in url. If you want to use those in url you have to encode them using encodeURIComponent javascript function.
%25 is actually encoded version of % character. Here browser is encoding them itself.
When trying to get queryParams from url , you can decode them using decodeURIComponent.
For more information check : https://support.microsoft.com/en-in/help/969869/certain-special-characters-are-not-allowed-in-the-url-entered-into-the
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/decodeURIComponent
I have a problem in an angular2 project where I'm generating a URL to be sent to a user via email. The URL in the email needs to contain a special ID which is passed in the router as:
{ path: somepath/:id }
The user then clicks on the url which will be:
http://localhost/somepath/{id}
My problem is that the id can contain a trailing "=" character which gets automatically trimmed off when navigating to the url (and therefore making the ID now incorrect)
I have tried encoding the id before adding it to the url making the url:
http://localhost/somepath/XXX%3D
but the encoded "=" (%3D) still gets trimmed off.
Is there any reason why encoded url values are still being trimmed off and is there any way to prevent this?
Ok was just a massive oversight on my part....
I the actual id was being masked by a random encryption generator that includes symbols and usually ends in "=". What I didn't notice however, was that there was a ")" that was being included in a couple of cases as well, which does not get encoded and was causing everything after it to be trimmed off when loading the URL.
Ended up fixing it by replacing the ")" with a different symbol that doesn't get encoded but one that doesn't have another function in Angular2 (in this case a "*").
Our application implements APIs to access entity details via AJAX GET requests - it once used POST but we decided to change our standards.
Unfortunately we hit a design flaw recently.
Suppose our API is http://localhost/app/module/entity/detail/{id} where {id} is a Spring #PathVariable that matches that entity's primary key.
If the primary key is a numeric surrogate key (auto-increment) there is no problem then. But we thought that this all worked with String primary keys.
It happened that we found some valid production data contain slashes, backslashes and semicolons for primary key. Our tables cannot use auto-increment surrogate keys because of their gargantuar size.
More in general, we discovered that we were unprepared to handle non-alphanumeric characters.
What the defective code was originally
Here is how our application used to reach to display entity data in a single page form the entity list:
User navigates table.jsp where an AJAX list is retrieved via POST
An Angular expression constructs the link to the detail page of that entity by means of detail?entityId={{::row:idAttribute}}
A valid link is generated by Angular
Examples:
detail?entityId=5903475934 //numeric case, we have several details page with same navigation pattern
detail?entityID=AAABBBCCC
detail?entityID=DO0000099101\test
The user clicks on the link and the browser points to the corresponding address
http://localhost/blablabla/detail?entityId=DO0000099101\test //Could be escaped.... read more later
The page needs the ID code from the parameters to issue the correct AJAX call
Need to retrieve the Entity ID from the query string. The Angular controller is in a separate file that doesn't see the query string (and is included dynamically, having the same page name)
<script type="text/javascript">
var ____entityId = '${param.entityId}';
</script>
Which gets translated to
<script type="text/javascript">
var ____entityId = 'DO0000099101\test'; //Yes, I know it's incorrect because now we have a TAB
</script>
Angular fetches the Entity ID into the page scope
In the Angular controller, we do the following
$scope.entityId = ___entityId;
$http.get($const.urlController+'detail/'+$scope.entityId)
Ajax call is issued
http://localhost/blablablabla/entity/detail/DO0000099101est //URL is bad
Spring MVC decodes the #PathVariable
Unfortunately, the parameter is treated as DO0000099101est
What we tried to fix
We have tried to fix the mistake by escaping the \t as it is clear that its presence in the HTML content constitutes a bug. Javascript interprets it as a tab.
Trying to URL-escape the ID
We tried to manually navigate to http://localhost/blablabla/detail?entityId=DO0000099101%5Ctest by escaping the backslash to its URL entity. The purpose is that if this worked we could modify Angular code in the table page
The result is that the \t appeared again as it is in the Javascript fragment. From that point, the sequence is the same
<script type="text/javascript">
var ____entityId = 'DO0000099101\test';
</script>
Trying to Java-escape + URL-Escape the ID in the URL
What if the Angular table page escaped the URL by this way?
http://localhost/blablabla/detail?entityId=DO0000099101%5C%5Ctest
<script type="text/javascript">
var ____entityId = 'DO0000099101\\test'; //Looks great
</script>
Unfortunately Angular now reverses the backslash into a forward slash when performing the Ajax request
http://localhost/blablabla/detail/DO0000099101/test
Trying to perform the Ajax call manually with escaped URL
So know that the REST url is http://localhost/app/module/entity/detail/{id}, let's try to see how Spring expects the backslash to be escaped
http://localhost/app/module/entity/detail/DO0000099101%5Ctest //results in 400 error
http://localhost/app/module/entity/detail/DO0000099101\\test //Chrome reversed the backslash into a forward slash and the result is 404 as expected for http://localhost/app/module/entity/detail/DO0000099101//test
Using encodeURIComponent
We already tried this (but I didn't mention in the original post). To #Thomas comment, we tried again to encode the primary key by Javascript escaping in the controller itself.
$http.get($const.urlController+'detail/'+encodeURIComponent($scope.entityId))
The problem with this approach is that the backslash-T sequence in the URL is encoded to %09, which results in a tab decoded on the server side
Using both encodeURIComponent and a Java escape
Now we tried to use both approach #4 and fixing the hardcoded Java-escaped (i.e. \\t) into the Javascript for testing purposes.
<script type="text/javascript">
var ____entityId = 'DO0000099101\\test';
</script>
$http.get($const.urlController+'detail/'+encodeURIComponent($scope.entityId))
This time the Ajax call resulted in 400 error as case #3
http://localhost/app/module/entity/detail/DO0000099101%5Ctest //results in 400 error
Question time
I want to ask this question in two ways, one specific and one more general.
Specific: how can I properly format a #PathVariable so that it can preserve special characters?
General: in the REST world, what care is to be done when dealing with resource IDs that may contain special characters?
For the second, let me be more clear. If you control your REST application and generation of IDs, you can choose to allow only alphanumeric identifier (user-generated or random or whatever) and sleep happy.
But in our case we need to browse entities that come supplied from external systems that have broader restrictions on character sets allowed for entity primary identifiers.
And again, we cannot use auto-increment surrogate keys.
I want to send some Korean values from page1.html on page sumbit to page2.html. But the Korean fonts are getting encoded. Can any one help me with it. I have this meta tag in both the screens.
window.location.href = "page2.html?value='풍경' these Korean character are getting encoded in few mobile devices.
for this page the values is encode as
page2.html?value= %EC%82%EB%AC%BC
Korean characters (and any other non-URL-safe characters) are %-encoded for the transaction. However, when received by the server and put into (for instance) PHP's $_GET array, they are decoded automatically so you don't have to worry about it.
I'm still not completely clear on what you actually asking, but if you correctly construct Url it should be much easier to reason on what should/should not be happening:
// to construct correctly encoded Url:
var encodedValue = encodeURIComponent("'풍경'");
window.location.href = "page2.html?value=" + encodedValue;
// to decode back from query parameter (if needed)
var decoded = decodeURIComponent(encodedValue);
Check out Encode URL in JavaScript? for guidance on encoding Urls with JavaScript.