This question already has answers here:
Check if image exists on server using JavaScript?
(18 answers)
Closed 2 years ago.
Is there way to check if link to image is working before adding src attribute to image?
What I have tried:
First idea was to make ajax call to image src but I cannot be sure that CORS pocily will allow it.
Adding onError callback into my component. No luck because I use SSR and it causes problems
My use case:
I'm building text editor and user can insert link to image. I want to know if link is ok before inserting it into my model.
The other answers/question aren't specifically about cross-domain requests. If you only have to support modern browsers you can use an opaque fetch request which works cross domain and is pretty easy to use.
fetch('http://example.com/your-image-url', { mode: 'no-cors' }).then(() => {
if (response.ok) {
// the image exists
}
});
Related
This question already has an answer here:
How to use youtube API in firefox extension?
(1 answer)
Closed 5 months ago.
i want to code a firefox extension where i can invite people to a "Yt-Music party" and it will sync up to the host YtMusic.
The element "movie_player" contains a lot of functions and variable which could be usefull, like the current time of the song.
For some reason the getCurrentTime() function works in the webconsole, but not when i have it like this, in my extension.
Do i need extra permission to do this?
Thanks in advance
const ytPlayer = document.getElementById('movie_player')
const test = ytPlayer.getCurrentTime()
console.log(test)
Extensions don't have direct access to elements on the page. You'd have to inject a content script, and then pass data (via messaging) between the page and the extension's background script (or service worker) to have this type of communication. Note also that content scripts don't get access to things like ytPlayer by default either.
This question already has answers here:
How do I load an HTML page in a div using JavaScript?
(17 answers)
Closed 2 years ago.
I am getting my hands on Node.JS fetch to understand how it works and then use it.
I have installed node-fetch and followed some tutorials and saw some videos on the subject, but it is not yet all clear. Even if what is shown works, I still have questions. Here one I need to solve soon. What is the way to simply display the page in the browser?
For example in the code below, I use a fetch to access my site (https://mynicewebsite.example.com), possibly setting some options (headers ....), and then I can log a number of informations using console.log(). But how should I change the code if I simply want the contents of the site (https://mynicewebsite.example.com) to be displayed in the browser?
Just as if I had typed the address directly in the address area of the browser.
Here the code with the fetch call.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
const makeFetchCall = async () => {
const response = await fetch('https://mynicewebsite.com', {
method: 'GET',
headers: {
'Authorization': 'Bearer blahfblahdblahzblah',
//..... // possibly some other things
}
});
}
makeFetchCall();
</script>
</body>
</html>
fetch is an API used to get some data from a URL and make it available to JavaScript. It is provided by browsers to JS running in webpages.
node-fetch is a library that makes that API available to Node.js.
There's no sign of Node.js anywhere in your code. You are using the browser version, not node-fetch.
If you want to display a page in the browser, don't use fetch. Navigate to it:
location = "http://example.com"
This question already has answers here:
how to fully change url without reloading the page to new url?
(2 answers)
Closed 3 years ago.
Is it possible to change change subdomain without refreshing the page?
E.g. from www.somedomain.com to aaa.somedomain.com without full reload?
Edit: I need to switch subdomain part only so in above example somedomain.com stays same, only www is changed to aaa
what you are looking for is History.pushState(), but as described here,
It can't be done. This is by design. There are no exceptions.
From the Mozilla pushState documentation:
The new URL must be of the same origin as the current URL; otherwise, pushState() will throw an exception.
This question already has answers here:
Check whether user has a Chrome extension installed
(17 answers)
Closed 5 years ago.
I want to detect if a Chrome extension is installed in user's browser. If not, I want to display a link to install the extension. If it is already installed, I want to hide the link.
This seems like a possible solution but I am confused what some_object_to_send_on_connect is supposed to be?
https://developer.chrome.com/extensions/extension#global-events
var myPort=chrome.extension.connect('jllpkdkcdjndhggodimiphkghogcpida', some_object_to_send_on_connect);
I know it's an old question, but since I managed to solve this problem (for my needs) I'd like to share.
I accomplished this by adding some info into the DOM. In extension's content.js file I have:
document.documentElement.setAttribute('extension-installed', true);
And in my page:
var isInstalled = document.documentElement.getAttribute('extension-installed');
if (isInstalled) {
...
}
I'm not sure if you want to check from a web page or from an already installed extension.
From a web page
You can't. Only Chrome Web Store can check that.
But if you write the extension and the web page, you could make your extension execute some content script in you page to confirm its installed and working.
From an extension
Provided you know the extension's id you are looking for, you can use
chrome.management.get(id, callback);
You can use chrome.management.getAll() to get a list of installed extensions, with more info than their id.
https://developer.chrome.com/extensions/management
Assuming you are the author of the extension, you can include a CustomEvent within your extension.js file, and within your site you can addEventListener to that event.
Within your extension:
const customEvent = new CustomEvent('myExtensionCheckEvent', {
detail: true // whatever value you enter here will be passed in the event
})
document.dispatchEvent(customEvent)
And your sites javascript file:
document.addEventListener('myExtensionCheckEvent', e => {
if (e.detail) {
// the extension is installed
}
})
Note that the key must be called detail.
This question already has answers here:
How to disable (View Source) and (Ctrl + C ) from my site
(10 answers)
Closed 9 years ago.
I'm looking for disable keyboard script to protect hidden content.
It is not possible. A user will always be able to view your source since he needs to download it in order to render the page.
There are more ways to view source than what you are trying to prevent:
Using firebug
Using wget
Right clicking on content choosing 'view source'
Using the menu option
Via man in the middle
probably more...
This is not very complicated but totally unreliable. Its same with all other Javascript protections.
First the trick (IE incompatible):
function denyKey(event) {
var code = event.keyCode;
if(event.ctrlKey) {
if(code==85)
return false;
}
}
window.addEventListener("keydown", denyKey);
My code is just scratch, it is not cross-browser. This is where to get keyCodes. I did not put much effort in the code since I want to discourage you from using it.
Once you send data to user, he can read the data unless you encrypt them without giving him the key. This means any:
Javascript authentication
Secret loading pages
Javascript "Wait before download..."
Blocked mouse buttons
..can and will be bypassed by the user.
I have a bookmarklet to unblock mouse buttons for example.
That is not possible, even if it was, it would have been a horrible protection. Even I could write a simple script that fetches the source of an arbitrary page. Everything that the client sees, is 'view source'-able (somebody edit that). Only server-side code is safe. Even if it was only possible to view your page through a real browser (but you can't make it so) you'll probably overlook a accelerator key, or other shortcut. If you don't want the client to see some code, don't give it to him! Keep it server-side (and not in a .txt file, that's accessible too) or don't keep it.