I used https://www.gatsbyjs.com/plugins/gatsby-plugin-sitemap/ to create the sitemap for my website.
Currently, the sitemap is listed at https://www.myWebsite.com/sitemap/sitemap-0.xml, but I want it to be located at https://www.myWebsite.com/sitemap.xml
How can I change the sitemap's location? Sorry if this is obvious
You can't automatically since there's no option nor configuration to do so. Your only change is using any small Node script that changes the filename or doing it manually.
However, there's no SEO problem at all having a sitemap-0.xml as long as you point your Google's Search Console to that file.
Another solution is using gatsby-plugin-advanced-sitemap which by default outputs a file named sitemal.xml as you can see in their example: https://gatsby.ghost.org/sitemap.xml. This plugin is based on the one you are using so it should be quite straightforward swapping between them.
Another solution is to use the same gatsby-plugin-sitemap plugin and then add:
gatsby-plugin-robots-txt plugin and point to the file name in the gatsby-config Something as bellow:
{
resolve: 'gatsby-plugin-robots-txt',
options: {
host: SiteConfig.url,
sitemap: ${SiteConfig.url}/sitemap.xml, HERE PLACE sitemap-0.xml
policy: [{ userAgent: '*', allow: '/' }]
}
},
After doing that, look for set up on webpage/robots.txt to see where is the point
Related
I have a problem, when I click to go to the /analytics page on my site, adblockers block the analytics.json file that's being requested by Next.js as they think it's an analytics tracker (it's not, it's a page listing analytics products).
Is there a way to rename the route files Next.js uses when navigating to server-side rendered pages on the client-side?
I want to either obfuscate the names so they're not machine readable, or have a way to rename them all.
Any help appreciated.
With thanks to #gaston-flores I've managed to get something working.
In my instance /analytics is a dynamic page for a category, so I moved my pages/[category]/index.tsx file to pages/[category]/category.tsx and added the following rewrite:
// next.config.js
module.exports = {
async rewrites() {
return [
{
source: "/:category",
destination: "/:category/category",
},
];
},
};
This now gets the category.json file rather than analytics.json, which passes the adblockers checks and renders as expected.
Note that due to having a dynamic file name in the pages/[category] directory (pages/[category]/[product].tsx), I had to move that to pages/[category]/product/[product].tsx as I was seeing the /analytics page redirected to /analytics/category for some reason without this tweak.
I am using Next.js and I am trying to redirect to a given path base on some regex conditions and cookie.
The goal is to redirect to /foo/bar when the source does not have the key bar and have a given cookie.
I have tried several different ways with next.config.js and none works.
Right now I have the following
async redirects() {
return [
{
source: '/(^(?:(?!bar).)*$)',
has: [{
type: 'cookie',
key: 'utm_source',
value: 'bar',
}],
destination: '/foo/bar',
permanent: true
}
]
}
The documentation is quite vague.
I also had a regex issue and was digging deep into next.js source code and did a little debugging. What I found is that unfortunately nobody tells you that next.js wraps your regex inside /^(?:\/( your regex ))$/i
Actually, the first part (\/) might depend on your source property.
But if you remove everything apart from the actual "word regex" it should work:
source: '/(?!bar)',
(Check out regexp.source in getPathMatch() in node_modules\next\dist\shared\lib\router\utils\path-match.js)
I am using hugo (https://gohugo.io/) and trying to make an external link in the menu (docsy theme).
I changed the _index.md to:
---
title: "Documentation"
linkTitle: "Documentation"
url: "https://www.myurl.com"
weight: 20
menu:
main:
weight: 20
---
However hugo reports:
Rebuild failed: URLs with protocol (http*) not supported
Could anyone advise of how to create an external URL link directly on the menu?
Thanks, Gregor
Keep in mind that "url" is a predefined front matter variable that is meant to be used for defining the full path to the content page from the site root. If you want to add an external link in your front matter, I'd recommend giving the variable a different name, e.g. "external_url".
I just added something like this:
[[menu.main]]
name = "GitHub"
weight = 50
url = "https://github.com/google/docsy/"
To the config.toml file.
I found this solution for the docsy theme here: https://www.docsy.dev/docs/adding-content/navigation/
Hope this helps, Gregor
im trying to make a streaming service where i stream the content of a file (in this case a video) into a video element.
for this purpose i have downloaded and installed videogular and is now trying to set it up however im sure how to do it.
According to the documentation on videogular to load a video you would need a syntax like this:
sources: [
{src: $sce.trustAsResourceUrl(myMp4Resource), type: "video/mp4"}
]
Which is fine for when you want to load the content in without streaming.
But say for instance you have a node server running at port 8105 and the file you wish to collect had an id of 1 then the result might look something like this:
sources: [
{src: $sce.trustAsResourceUrl('http://localhost:8105/loadvideo/1'), type: "video/mp4"}
]
However in my attempt to do so it would just tell me that the resource is not an actual resource.
My question is how do you stream to a video content (preferably with videogular) and does anyone know of examples where people have made this possible?
Server side code
Okay so my initial idea (and i know this is a change for the code above) was to create a route that took at path:
router.route('/retrieveFile')
.post(function (request, response) {
var path = '../' + request.body.data;
var file = fs.createReadStream(path);
file.pipe(response);
});
And then piped the output of the file.
Then use this to stream the file
If you have video files on your harddrive and you want to serve them all with their filenames, you should just use Express Static to serve them just like any other resource
You can add a path prefix '/videos' to differentiate them from regular resources.
app.use('/videos', express.static('videos'));
Then a video file ./videos/myvid.mp4 would be available as http://localhost:8000/videos/myvid.mp4
To have a file available as a file, you need to set the appropriate headers before piping
And to load the file you'd put this code in your router, and where you're using post, if you don't have a strong reason I'd just use get or all
You might also wanna be able to end the transmission if client decides to disconnect mid-stream
Alternatively you might want to go with res.download instead of streams, which which case appropriate headers and interruptions are automatically handled.
So the whole code might look like this:
router.route('/path/to/video.mp4')
.all(function(req, res){
res.header('content-disposition', 'filename="video.mp4"')
var stream = fs.createReadStream('./resources/video.mp4');
stream.pipe(res);
require('on-finished')(res, stream.abort.bind(stream));
// or simply
res.download(fs.readSync('/path'))
});
Then you can use http://localhost:8000/path/to/video.mp4 to either directly load the video into your browser, it'll play it if it can or simply offer to download. Or you can use this URL in your videgular
sources: [ {src: $sce.trustAsResourceUrl('http://localhost:8000/path/to/video.mp4'), type: "video/mp4"} ]
i would like to consolidate the url base for my RESTFul API in a single place in my app built with Sencha Touch. Where is the best place i can put it?
There is a obvious option to store it in localStorage, but is this a good practice ?
When I want to support MVC structure I create file Config.js and put it in application tree in the following place:
in Config.js:
Ext.define('MyApp.config.Config', {
singleton: true,
config: { /** here you can put any objects of your choice that will be accessible globally**/
baseURL : Ext.os.is.Android ? 'http://live_url_here.com' : 'http://localhost/testing_locally',
topBannerUrl : 'http://some_url/banner.png',
anotherGlobalParam : true
},
constructor: function(config) {
this.initConfig(config);
return this;
}
});
Those config parameters will be visible in the whole application.
You may get them:
MyApp.config.Config.getBaseImgURL(); /* returns 'http://some_url/banner.png' */
MyApp.config.Config.getAnotherGlobalParam(); /* returns true */
or set:
MyApp.config.Config.setBaseImgURL('new_url');
MyApp.config.Config.setAnotherGlobalParam(false);
This solution may be especially handy when your project requires many configuration parameters.
I hope it will work for you as well.
Always keep your url base in a seperate file like util.js(utility.js). Your file path should be app > util > Util.js. You can keep your common functions like animateItem, showLoading/hideLoading, custom functions, etc over here so that you can use the same function throughout the app. To load this file in your app do this:
app.js
Ext.application({
name: 'HelloWorld',
requires: [
'HelloWorld.util.Util'
],
view: []
})
For best practices in sencha touch you can see this: Sencha Touch Blog
+1 for Anubis recommendation.
Something like this:
Ext.define('MyApp.Const', {
statics:{
url1:'....',
url2:'....'
}
})
Then you can access your urls with:
MyApp.Const.url1
Of course you must require Const class but you don't need to instantiate it.