if we use object id of mongodb in query parameter like for example,
in browser url,
http://example.com/get-details/507f191e810c19729de860ea
to pass this objectID from one state to another state, I am using $stateparam
then,in $http
the url will be
"/get_details?id="+$stateParams.detail_id
$http.get("/get_details?id="+$stateParams.detail_id).then(...);
if there any problem with the url in browser in terms of SEO, i.e, http://example.com/get-details/507f191e810c19729de860ea what could be the solution
It's OK to use MongoDB Object ID as a primary key in a URL, in terms of SEO.
Also please consider including a slugified title along with the Object ID in the URL:
http://example.com/detail/<Object-ID>/<Slug>
It makes the URL more readable and helps search engines to determine the content of your page.
Related
I searched for this but I could only find examples in Laravel and PHP, and I need to know how to do this with Next.js.
All I know is that I can do dynamic routes in Next.js the usual way like this ...
/pages/post/[postId] which will translate to /pages/post/23435 for example, and that way if someone has the URL I could just grab the [postId] with router.query and can show the correct post to the user, easy enough.
But what if I want to show the post name in the URL instead of the id? just like what Udemy does with dashes between the words ...
https://www.udemy.com/course/your-custom-react-component/learn/lecture/
And at the same time if someone has that URL I could still show the correct post to them?
I know I could just do /pages/post/[postName] and show the post name in the URL, but that won't be unique, and won't be able to show the correct post.
How can I do that?
You can to do it with postName as you propose, and then take care that postNames are unique and that each one maps to a postId (that's something you need to deal with on your side; so in your database you would generate a unique slug for each postName)
Another solution would be to show both the name and the id like /pages/post/[postName]/[postId]. You can use several params, check https://nextjs.org/docs/routing/dynamic-routes
If I want to display many posts in my web application but every post have its own type and I want to display each type in single page so, What's the best method to do that? Is put all all posts in one url and use query string to filter the posts upon the type and display it in the page?
For example : axios.get('/posts?type =sport')
Or I have to put every single type in separate Url
For example: axios.get('/posts/sport')
Also one more question please?
use one reducer to manage every posts or create one reducer for each post type?
you can add a dynamic route to every new type.
Ex:
'/transaction' -> component-1
'/transaction/:type' -> component-any (multiple)
welcome to Stackoverflow!
I can imagine you have a web API of some sort serving a URL /posts. You want to consume that endpoint from your web application, and you are using axios to do that. I can assume you are using JSON to return that data. Correct me if I'm wrong.
Now that the basic information is "clear", what data you serve from the endpoint, and how it is requested from the client is up to you. Do you want to ask the server what types are there first, and then do one AJAX request per type? Ok. Do you want to serve all posts independent of their type? Ok. Do you want to accept POST data in your controller so you can filter the results before returning a response? Ok.
If you are looking for a more specific answer, you must give more details, or specify more. But I hope I could be of help.
Edit: complete answer.
If you want to filter the results, you have to send some additional data in your POST request, in this case, your post type. In axios, this could be done like this:
axios.post('https://example.com/posts', {
type: 'sports'
}).then((data) => {
console.log(data);
});
You can obviously get the "type" value from a select input, other variable, even the current router page. I don't know your exact setup, but you can always come back and ask ;)
THEN, in your API controller you have to get that POST parameter type, and use it to filter the results. Again, I don't know your exact setup, but for MySQL if would be a WHERE statement in your query, or similar.
Usually I use ui-router state with id parameter like this:
/* route /news/{news_id} */
http://servername/#/news/14
but already I want to use alias string instead of id like this:
/* route /news/{news_title} */
http://servername/#/news/braking-news-of-usa
How to map news_title to news_id in angular or ui-router?
I don't think this specific to Angular, but you can consider following approaches.
Along with title append news id with some separator. e.g. breaking_news_of_usa_14. When someone clicks that link, in Javascript split the news title and retrieve the ID to query server API.
Make sure you have unique titles for news (overhead at serverside API e.g. unique index, hashes etc.) and instead of querying with news id, query using news title to get the details.
Maintain both news ID and news title like this /{news_title/{news_id}. With this you save overhead of introducing unique titles. (Reference, check stackoverflow URL format for question details.)
I have a table view with a form above it for doing advanced search (text fields, date ranges, drop down lists etc.)
I am trying to store this state in the URL using `$location.search('filters', angular.toJson($scope.filters)); but was wondering if there is a better way.
The reason I want to make use of the URL is so people can share links to filtered data.
This is a perfectly valid use case for $location.search, but you don't need to do an angular.toJson. $location.search accepts an object as its parameter and will automatically convert it into an encoded query string before applying it to the URL.
I'm attempting to upload a photo to Facebook via the Graph API on a test user account for my app. With just the url, link, name parameters present, the upload works fine returning a valid photo id.
However, if I use the additional tags parameter, I end up with the following error returned:
{
"error": {
"message": "(#100) param tags must be an array.",
"type": "OAuthException",
"code": 100
}
}
I've tried to provide the value for tags in almost every possible way I can think of, as I know the Graph API isn't straightforward (even the parameter url which is used to upload a photo from a URL isn't listed under the photo Graph API method);
A single user id
tags=100003919104407
Multiple CS'd user ids
tags=100003919104407,100003919104408,100003919104409
Array with ids not as integers
tags=[100003919104407, 100003919104404,100003919104405]
Array with ids as strings
tags=["100003919104407", "100003919104404","100003919104405"]
Array containing objects, as per the Facebook Graph API documentation
tags=[{"id":"100003919104407"},{"id":"100003919104404"},{"id":"100003919104405"}]
If someone could tell me the right format/another parameter through which to pass user ids in order to have them tagged in a photo, I'd be very grateful.
Try this
It should be in this format
[{"to":"100003919104407","x":0,"y":0},
{"to":"100003919104408","x":10,"y":10},
{"to":"100003919104409","x":20,"y":20}]
or
[{"tag_uid":"100003919104407","x":0,"y":0},
{"tag_uid":"100003919104408","x":10,"y":10},
{"tag_uid":"100003919104409","x":20,"y":20}]
Where did you get your information from? Have you check the tags section?
Create
You can create a tag on the photo by issuing an HTTP POST request to
the tags connection, PHOTO_ID/tags.
Note: This feature is intended to help users tag their friends in real
photos. You should not use this feature to encourage users to tag
their friends if their friends are not actually in that photo, or to
tag friends in composite photos. If your app is found to be
encouraging this behavior, your usage of this feature may be disabled.
You can specify which user to tag using two methods: in the URL path
as PHOTO_ID/tags/USER_ID, or in a URL parameter as
PHOTO_ID/tags?to=USER_ID. To add several tags at once, you can specify
a tags property which contains an array of tags like so
PHOTO_ID/tags?tags=[{"id":"1234"}, {"id":"12345"}]. Currently, you
cannot tag a Page in a photo using this API.
There's also an example.
the X and Y value of array need to be %, not in pixels
Example 1 (wrong)
img:(640,480) xy:(320,240)
[{tag_uid:user_id,x:320,y:240}] <- wrong, because 320 > 100%
Example 2 (right)
img:(640,480) xy:(320,240) px:(320,240) < %
[{tag_uid:user_id,x:50,y:50}] <- right, because 50 < 100%