Website viewed with electron unable to load all resources - electron

I am trying to load https://trello.com with win.loadURL('https://trello.com'); This works fine but the login page says
Your browser was unable to load all of Trello's resources. They may have been blocked by your firewall, proxy or browser configuration.
Try refreshing the page and if that doesn't work, check out our troubleshooting guide.
I have tried:
allowRunningInsecureContent: true
webSecurity: false
'Content-Security-Policy': '*'
Changing my useragent
Nothing shows up in console and it seems to work fine when i use the < webview > tag.
According to a Trello article the urls that it tries to load resources from are: d78fikflryjgj.cloudfront.net, d2k1ftgv7pobq7.cloudfront.net or a.trellocdn.com

mainWindow = new BrowserWindow({
width: 600,
height: 600,
webPreferences: {
contextIsolation: true
}
})
Add this contextIsolation:true When you are creating new BrowserWindow

Related

Setting session or partition in BrowserWindow / Webpreferences not working

I am trying to save cookies to a named session. The cookies are saved in session.defaultSession and get() does return them.
Here I'm attempting to set the partition
mainSession = session.fromPartition("persist:myapi");
Then this function when app.on('ready') is event.
const createMainWindow = () => {
mainWindow = new BrowserWindow({
webPreferences: {
nodeIntegration: true,
webviewTag: true,
//session: mainSession,
partition: mainSession
},
.....
});
Later after response received I check mainSession and it is empty {}.
Using v 7.1.11
Perhaps the problem is related to my cookie. My electron browserWindow.loadUrl is a local html file. It presents a log in screen to an API. The cookie is returned from the API and while it shows up in session.defaultSession it does not show in devtools (like a typical cookie would in a browser).

"Not allowed to load local resource" with file image URL in Electron app

I am working on a note taking Electron app that uses Markdown. Currently, I'm working on inserting images into notes (using the Markdown syntax).
When inserting an image, my main process copies the image into the notes directory, then returns a file:/// URL to the image file. However, when I try to render the image, it doesn't load - and I get the error Not allowed to load local resource: file:///Users/joe/notes/images/foo.jpg.
Is there a way I can configure Electron to allow these local image URLs?
Option 1
Turning the web security off
mainWindow = new BrowserWindow({
height: 563,
useContentSize: true,
width: 1000,
webPreferences: {
webSecurity: false
}
});
Option 2
You can create your own protocol like this answer
Also here is the user that answered that question
You need register a file protocol to remove the file:/// prefix.
import { protocol } from "electron";
app.whenReady().then(() => {
protocol.registerFileProtocol('file', (request, callback) => {
const pathname = decodeURI(request.url.replace('file:///', ''));
callback(pathname);
});
});
https://github.com/electron/electron/issues/23757#issuecomment-640146333

Electron, I can't use BrowserWindow to explore file system

I'm trying to show a folder of the machine running an Electron app, I already look and see I can load the url file:///d:/ on my machine and see the folder content but noway to do that with a BrowserWindow. I can see in the DevTools an error saying
Not allowed to load local resource.
Is there a workaround or any setup to be able to do that?
I use the following code:
ipcMain.on('openExplorer', (event, arg) => {
exploreWindow = new BrowserWindow({ width: 120, height: 82, title: "MyApp", icon: "assets/images/favicon.ico" });
exploreWindow.setTitle('Files Explorer');
addr = 'file:///d://' ;
console.log(addr);
exploreWindow.loadURL(addr);
exploreWindow.openDevTools();
});
For security reasons it is a good idea to not grant a BrowserWindow access to the filesystem. If you still want to do so you could use the inter process communication module to access the filesystem from your mainfile and send it to your BrowserWindow.
See:
Electron Documentation for ipcMain
Electron Documentation for ipcRenderer

dailymotion api mobile website issues

I am trying to play embed videos in my webpage, in desktop browser there is no problem, but in mobile version I have these issues:
Video wont start automaticaly
There is Dailymotion logo in right bottom corner
I am using DM object provided by file https://api.dmcdn.net/all.js.
Code:
<script src="https://api.dmcdn.net/all.js"></script>
<script>
DM.init({
apiKey: 'correct api key',
status: true, // check login status
cookie: true // enable cookies to allow the server to access the session
});
</script>
<div id="player{$img->getId()}" class="dailymotion tile"></div>
<script>
$(function () {
var player{$img->getId()} = DM.player(document.getElementById("player{$img->getId()}"), {
{var DMurl = explode("/", $img->getImgUrl())}
video: {$DMurl[count($DMurl) - 1]},
width: "100%",
height: "100%",
params: {
autoplay: true,
mute: true,
endscreen-enable: false,
ui-logo: true,
controls: false
}
});
player{$img->getId()}.play();
});
</script>
My problem might be caused by syntax error in params (endscreen-enable and ui-logo, phpstorm is showing syntax error because of '-' char)
Video wont start automatically
=> this is normal on mobile devices, it will be the same for any video you add, from any provider. The reason is that most mobile devices prevent videos from being played automatically, hence the play must be triggered by a user interaction. This is detailed on Dailymotion developer website at : https://developer.dailymotion.com/player/faq#player-faq-autoplay-does-not-work-on-mobile
There is Dailymotion logo in right bottom corner
=> you pass ui-logo: true so this is normal !

jquery load page to dialog

I develop Intranet application with login via AD. In my application I need load web page from another application on same server and show this page in dialog.
$('#btnExample').click(function () {
var id = getCurrentId();
var url = 'http://SERVERNAME:81/Runtime/Forms/formDetail.aspx?SN=' + id;
jQuery.support.cors = true;
$('#pagePreview').load(url, function (response, status, xhr) {
alert(xhr.status + " " + xhr.statusText);
});
$('#pagePreview').dialog(
{
draggable:false,
height: 768,
width: 1024,
modal: true,
});
return false;
});
The load function throw error: Access Denied.
Why?
In my application is user logged by Active Directory and in the second app is logged too by AD...
Is any other way to resolve it? I need display this page in my site in a dilog.
Thanks
The second page is probably not on the same host as the first, so your request violates the "same origin policy".
As workaround, try an ajax request, load html into something, then populate the dialog with it. If the request is still denied make a local php script that makes a curl request to the specified page, and make an ajax request towards that script.
If it still fails... something is wrong.

Resources