Develop Reference

Can't open link containing special characters

I have Django app which I test on my local PC and then when I add something new, I upload changes to my company virtual server. I have a problem with links to files. Below is the code for links to attached files (both my local and server have the same code):
<p class="article-content mt-2 mb-1"><strong>Attachment: </strong>{{post.file_close.name}}</p>
If I upload file cars.png everything works fine in both versions. This works no matter the extension, pdf, excel, image, etc.
Problem is, if I upload file carsčč.png it fails only on server side, on my PC it works great.
I get the following error on my Django/debugg:
Page not found (404)
“C:\inetpub\files\PyWeb\media\PN_files\2022\03\06\cars” does not exist
Url of the error page is:
http://hidden_part/media/PN_files/2022/03/06/carsčč.png
But when I click copy and paste it's like this:
http://hidden_part/media/PN_files/2022/03/06/cars%C4%8D%C4%8D.png
Like the link is not complete, it stopped as soon as it runs into a special character.
But, shown link still containes all the letters, it's PN_files/2022/03/06/carsčč.png
Tried:
I looked at regional settings, it's the same on both PCs. Is there something else I could check or change? Maybe include something in the link?
Also, when I manually search for the file, the name is not currupted, it's saved localy as carsčč.png. So I guess it's only the link, tring to get the file.
I figured out it's because of diacritic letters. On my 'base.html' I have meta charset="utf-8". Django setting LANGUAGE_CODE = 'hr-BA'.
I use Bootstrap 4.0 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
Server is hosted on Windows, IIS, .NET Globalization settings are set to utf-8.

In line <a href="{{post.file_close.url}}"> you are internally calling the url() method of the underlying Storage class, which returns the wrong url “C:\inetpub\files\PyWeb\media\PN_files\2022\03\06\cars”.
The main problem is within your storage class. You are propably using FileSystemStorage from django. Whenever you are saving a file, the storage class is calling storage.get_valid_name, which is returning a name which is suitable to use on the target system (ref). In this step the special characters are replaced. The code provided on Storage retains only alpha-numeric characters, periods and underscores from the original filename, removing everything else (ref)The code provided on Storage retains only alpha-numeric characters, periods and underscores from the original filename, removing everything else.).
If you want to change this behaviour, you could write your own custom storage class and overwrite the get_valid_name method (ref).

Can I play youtube blob url in html 5 video?

I'm working on a video library and i need to play videos from different sources like youtube.
When I inspect element on a youtube video, the url looks like something.
blob:https://www.youtube.com/b3038e77-e79c-4e9f-b574-6f4e5d686b4c
But when I try to use it in html 5 video, it is giving me various errors. I tried many methods but none of 'em are working. I'm getting diff errors like,
Not allowed to load local resource: blob
Uncaught TypeError: Failed to set the 'srcObject' property on 'HTMLMediaElement': Failed to
convert value to 'MediaStream'. Uncaught TypeError: video.play is not a function
My question, it is even possible to play video from third party sources. If yes, can you provide me any working example?

It is very difficult to deduce the errors without a code example, but I believe that the problem is between these 2 items
The first error refers to the source type of the resource, in case you must be testing accessing it directly from an .html file. To work around this you can create a simple server to expose these files accessing through a port, e.g.: localhost:8080/test.html. You can do this using a node http-server by following these instructions.
The other 2 errors refer to the type of file being loaded, sites like youtube, netflix use players generally based on HLS or DASH, which use .mpd and .mp4 files (for DASH) and .m3m8 and .ts (for HLS). These files are not natively supported by most browsers. In this case you need to use a javascript player for that. There are opensource solutions for that, for DASH you can use dash.js (here is a link with examples) and for HLS you can use video.js (here is a link with example)
here an explanation about DASH and HLS
https://www.dacast.com/pt/blog/mpeg-dash-vs-hls-what-you-should-know/#hls_vs._mpeg-dash

<!DOCTYPE html> in JS file

I am referencing two JS files in my map.HTML header. Chrome console gives
Uncaught SyntaxError: Unexpected token <
Here is why I'm confused. When I click on the Chrome Console error message, it takes me to the Sources tab. Under Sources, it puts me on the relative JS tab, and shows code starting with < !DOCTYPE html> then continues with a ton of code that is not in my map.html file or JS file. Presumably this is generated when the JS is read?
The two JS files are:
https://github.com/socib/Leaflet.TimeDimension/tree/master/dist
https://github.com/calvinmetcalf/leaflet-ajax/tree/gh-pages/dist
I am opening map.HTML locally with Chrome using a simple python server using a batch file (python.exe -m http.server).
I am sure this is very basic, but it's confusing me because I reference plenty of other JS files both online and locally and I don't get this error.
Thanks

If you try https://github.com/socib/Leaflet.TimeDimension/blob/master/dist/leaflet.timedimension.min.js in your browser, you will get an HTML page.
If you try https://raw.githubusercontent.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.min.js you will get what seams a source javascript file. But your browser may also consider it text/html, because that's what github sends in content-type header.
You can use third party sites which will serve files with appropriate content-type header, (example: https://rawgit.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.min.js ).

In the future, try to do more research before posting here, otherwise a lot of people are going to downvote your questions, and even insult you.
A simple Google search for the differences between html and javascript may be a good start. The first step would be to remove those doctype lines. They mean nothing in Javascript. Just like the word granola has no meaning in Japanese. Different languages.
However, looking at your code, I don't see any DOCTYPE text in your javascript. In order to really debug this, you're going to want to open your webpage (html) in a browser (I recommend Chrome) and press F12 to open the developer tools. Go to the console and trace the error back through all of the files to find the origin.
In order to check and make sure that you're trying to pull javascript files and not html, take all the src urls you're using and paste them in a browser. If you land on a webpage, that url will serve up html, not javascript like you want. If you get a wall of text, you're probably referencing it correctly.
Correct: https://api.mapbox.com/mapbox.js/v3.0.1/mapbox.js
Incorrect: https://github.com/socib/Leaflet.TimeDimension/blob/master/dist/leaflet.timedimension.min.js
Hopefully this helps before this question gets deleted or put on hold. Also notice that people are going to downvote me for actually answering and trying to help.

You can't directly reference code stored in a github repo like you're trying to.
The URLs you're listing aren't javascript files; they're github webpages. That's why they contain HTML doctypes and code you don't recognize -- it's the github website code.
You can get the URL for the actual javascript files by clicking the "raw" button at the top of any of those pages (after selecting a specific individual file -- the urls you gave were for directories, not individual files.) For example:
This is an HTML file: https://github.com/socib/Leaflet.TimeDimension/blob/master/dist/leaflet.timedimension.min.js
This is the raw javascript:
https://raw.githubusercontent.com/socib/Leaflet.TimeDimension/master/dist/leaflet.timedimension.min.js
(That said, I don't believe it's a good idea to treat github like a CDN; usually you would use that purely as a repository and host the actual files in use elsewhere.)

Uncaught SyntaxError: Unexpected token < on each js file that invoked in the index html

I am using mean stack to build a website, when testing, chrome returns the error like:
Uncaught SyntaxError: Unexpected token < angular.js:1.
I don't know what's wrong and what should i do.
Here is the directory of my app:
E-study
-client
-app
-components
-all the libraries are here.
-index.html
-controllers.js
-node_modules
-server
-config
-server.js
And I run the server in E-study like :node server/config/server.js
The scripts in the index.html is<script src="client/components/angular/angular.js"></script>
Just don't know why all the js files are changed to index.html when open in the browser.

open up those library files and see if there are some extra symbol < probably you will find it in the beginning.. if still not able to fix... simply download the fresh library (if those are libraries) from the internet and try again.
make sure that you don't put <script> </script> tags in the included .js files. that is an incorrect syntax for script files.
also make sure you are providing the correct path??? providing incorrect path can return a builtin customized error page. which is html. may be that is the source of error because returned page is HTML which is most likely going to start with a < symbol. and offcourse not a js file.
to ensure that the incorrect path is the issue just copy the path you included in the code and and paste into your favorite browsers url bar and hit enter. if you are not getting the script in plain text.. then it means you are not providing the correct path.
and if it is return a customized error page like .. 404 not found then probably it is returning the html and this is where the error is coming from.

In external js files, which you refer in some other files, don't use <script>..</script> tag.

For express server try to set the static path to entire project folder.It worked for me
app.use(express.static(__dirname ));

Could be a ReCaptcha bot checker type thing intercepting requests for JS files and serving up an HTML page instead, which is invalid HTML so it throws the < is invalid message error.
I know siteground specifically has issues with this intercepting CDN routed traffic.
Check with the host to remove this issue, in this case it's their anti-bot security setup. This has remedied these issues with Siteground for me.

Javascript and jQuery not working on clients server

On my dev site the javascript for maps in the Venue section and the jQuery for the Nav scroll and scroll to top all work fine. http://yogadham.4pixels.co.uk
Upload all the same files to the actual server it's going to sit on and no javascript/jquery works!
http://yogadham.co.uk/xxindex.html
All links are to root so no problem there. I've checked permissions on the .js files. Is this a server issue? Both are Linux. Has anyone had similar issues?

Short Answer: Use Binary mode instead of Ascii mode when transferring files between Windows and Linux via FTP
Long Answer
It seems to be re-encoding your file (index.html) into a single line, probably upon the FTP upload and therefore the comments are causing section5 to break the JavaScript
//remove all comments (temporarily), and confirm if the website works
Edit: The FTP transfer is the issue: Reference
If you are transferring files from Windows to a Unix based server,
Ascii mode will strip out the CR (carriage return) characters found at
the end of each line. You may notice that the file you uploaded is
smaller than your local file. This is completely normal and is
nothing to worry about.
In your case, the CR's are causing the file to break.

Files are not the same. Take a look to the HTML generated by both. In production you don't have CR (carriage return) neither LF (line feed) characters :
https://www.diffchecker.com/pks371y6