Im using the following afterModel hook inside an Ember.Route:
afterModel: function() {
this.transitionTo("order", 1);
}
So when we visit #/orders, it redirects to #/orders/1
It works just fine, however once i get to #/orders/1, if I click the browsers back button, I get taken to #/orders and the afterModel hook doesn't fire again to cause another redirect.
Is there any way to completely prevent #/orders from displaying and force the redirect trigger to always fire?
Ember.Route.replaceWith seems to do what you need. Take a look at:
http://emberjs.com/api/classes/Ember.Route.html#method_replaceWith
if you want to always redirect from #/orders use redirect hook rather afterModel. it goes like this
redirect: function() {
this.transitionTo("order", 1);
}
Related
I am using Aplication Customizer to add jQuery and custom javascript to my page:
let current_date: Date = new Date();
let date_String: string = current_date.toString();
date_String = current_date.toISOString()
console.log('date_string = %s', date_String);
SPComponentLoader.loadCss('https://8lbg15.sharepoint.com/sites/KnowledgeBase/SiteAssets/caj23.css?d=' + date_String);
//SPComponentLoader.loadScript('https://8lbg15.sharepoint.com/sites/KnowledgeBase/SiteAssets/jquery-3.6.3.min.js?d=' + date_String)
//SPComponentLoader.loadScript('https://8lbg15.sharepoint.com/sites/KnowledgeBase/SiteAssets/caj23.js?d=' + date_String);
SPComponentLoader.loadScript('https://8lbg15.sharepoint.com/sites/KnowledgeBase/SiteAssets/jquery-3.6.3.min.js?d=' + date_String, {
globalExportsName: 'jQuery'
}).then(($: any) => {
$(function () {
console.log('jQuery is loaded');
});
SPComponentLoader.loadScript('https://8lbg15.sharepoint.com/sites/KnowledgeBase/SiteAssets/caj23.js?d=' + date_String, {}).then(() => {
//...do something
});
});
The code runs fine when I open the page. However, if I navigate to the page from the main site navigation (ie the mega menu) the code doesn't run. Yet if I click on the link a second time in the nav, it loads the page and the code runs.
In other words, it doesn't rung when you change pages via the nav, but if you load the same page (or reload the page with F5) it does!!!
Is this some kind of caching issue? I am using Sharepoint Modern/Online so there is no caching setting for the site.
Any solutions gratefully received.
According to your description, as far as I know, custom code is usually loaded when the entire page is refreshed. And the first time you enter the page via the navigation, the entire page refresh is not triggered, so no code does not take effect.
SharePoint Online works online. If you are worried that the cache has affected this matter, you can try to clear the cache of the browser, or switch to the private mode to see if the problem is resolved.
Seems to be a routing interceptor that will check your link and if appropriate, do a partial navigation, ie avoiding a full page load.
To work around and force javascript to run, add
data-interception="off"
to all links eg by script
$('a').attr("data-interception", "off");
I am trying to create chrome extension that will scrap data from my webpage and then will display it in browser action window. I wanted to use background page for this, cause if i understand extensions correctly, it is only element capable of non-stop working, without need of visible tab.
The problem is, the script i wrote for background.js doesn't work properly, when i use background.js:
var location = window.location.href = 'http://localhost/index.php';
console.log(location);
manifest.json:
"background": {
"scripts": ["src/background/background.js"]
},
The answer i get is chrome-extension://some_random_text/_generated_background_page.html.
It is possible to use background pages to navigate to my webpage, then fill some forms and scrap data for later use?
This is an old question, but I recently wanted to do exactly the same.
So I'll provide an answer for others who are interested.
Setting window.location still does not work in Chrome52.
There is a workaround though. You can first fetch the web page with fetch(), and then use document.write to set the content.
This works fine, and you can then query the document and do everything you want with it.
Here is an example. (Note that I'm using the fetch API, arrow functions and LET, which all work fine now in Chrome52).
fetch("http://cnn.com").then((resp) => {
return resp.text();
}).then((html) => {
document.open("text/html");
document.write(html);
document.close();
// IMPORTANT: need to use setTimeout because chrome takes a little
// while to update the document.
setTimeout(function() {
let allLinks = document.querySelectorAll('a');
// Do something with the links.
}, 250);
});
A chrome extension has two main parts, the extension process and the browser itself. The Background Page works on the extension process. It does not have direct access and information about your webpages.
To have scripts working non-stop on your webpages, you will need to use Content Scripts.
You can then communicate between your Content Script and your Background Page using messages
contentScript.js
var location = window.location.href = 'http://localhost/index.php';
chrome.runtime.sendMessage({location: location}, function(response) {});
background.js
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
console.log(request.location);
});
I'm using the following script to inject a svg in my html body:
Meteor.startup(function() {
$('body').prepend('<div id="svg"></div>');
$('#svg').load('images/svg/sprite/sprite.svg');
});
This works as intended but things go wrong when I manually reload the page in my browser. But only when there's a parameter in my route. When there's no paramater in my route I can refresh all I want without any problems.
Router.route('/test') // all OK!
Router.route('/test/:_id') // current template gets rendered multiple times and app finally crashes
I can't seem to wrap my head around this. Why is this happening? And how to fix this?
The load path needs to be absolute.
$('#svg').load('/images/svg/sprite/sprite.svg');
I am rebuilding a website in ModX and I want to redirect the old URLs to the new ModX pages, automatically.
An old URL is of the form, http://www.oldsite.com/?pg=2
Every page is like this, so I need to manually map the old page IDs to the new ModX resource IDs. For example, pg=2 is the contact page, which is now resource ID 11, so I'll end up with a map like [2=>11, 3=>15, etc]
If I tweak the main index.php right in the docroot, this does exactly what I want:
/* execute the request handler */
if (!MODX_API_MODE) {
if (isset($_GET["pg"])) {
if ($_GET["pg"] == 2) {
$url = $url = $modx->makeUrl(11);
$modx->sendRedirect($url);
}
else {
// Page is set, but we don't have a redirect for it.
$modx->handleRequest();
}
}
else {
$modx->handleRequest();
}
}
However, I am not happy with hacking index.php directly. I'm a bit short of ModX experience to know exactly where to put this code. I tried:
A snippet, which I then called from my HTML header before any HTML, but the redirect stopped working
The Redirector extra, but this doesn't work on the QUERY_STRING, I don't think
Any insight is appreciated, for the best place to package this code, or a pointer towards an Extra I should be using.
The solution that worked for me, following Sean's insights below, is a plugin. The plugin code is below. For other plugin newbies like me, ensure you visit the "System Events" tab to enable your plugin for the event you're trying to access.
<?php
if ($modx->event->name == 'OnWebPageInit') {
// Look to see if the GET params include a pg. If they do, we have a request
// for one of the old pages.
if (isset($_GET["pg"])) {
// Map the old pg IDs to the new resource IDs.
if ($_GET["pg"] == 2) {
$url = $modx->makeUrl(11);
}
// Add more here...
// When done trying to match, redirect.
// But only do the redirect if we found a URL.
if (isset($url)) {
$modx->sendRedirect($url, array('responseCode' => 'HTTP/1.1 301 Moved Permanently'));
exit;
}
}
}
My preference to do this is in the .htaccess file with redirects or url rewriting - that way you can send the redirect and the response code ~before~ modx has to process anything [save a bit of overhead]
if you still want to do this in modx, take a peek at the sendRedirect docs & send the correct response code [so google gets the hint that the page has actually moved] Note: the $responseCode option is depreciated and you should use it in the options array these days:
$modx->sendRedirect('http://modx.com',array('responseCode' => 'HTTP/1.1 301 Moved Permanently'));
I do agree with not hacking the index.php file, only will cause you grief. What you want to do is place your redirect code in a plugin. Check the Modx API docs for the appropriate event for it to fire on - perhaps: OnWebPageInit will do the trick. Sorry, I don't know exactly which one will work.
HOWEVER ~ IMPORTANT NOTE!
Not all events are actually active, they may show up in the modx manager but don't actually do anything, you will just have to test or dig through the code to find out. [or ask in the community] Again, sorry, I don;t know for sure which ones work and which don't.
I've start with phantom.js (btw I'm in love). I'm trying to make the headless browser go to my php admin panel, log in with a username and password, and from the page that it redirects to after log in i want to get some text from a div tag.
So far I manage to successfully fill the fields, create a click event, and even find the access to the DOM part of the div tag and get the inner.Text.
The only missing part for me is what to do when phantom.js clicks on a button (the log in button in this case) which will log me in and change the page content. I can't find how to handle after .click(); event.
This is the code I made so far (by the way its a good way to start with...)
var page = new WebPage();
page.open("the url comes here",
function(status){
if(status != "success"){console.log('fail loading the page');}
page.evaluate(function(){
var arr = document.getElementsByName("formname");
arr[0].elements["username"].value="username here";
arr[0].elements["password"].value="password here";
arr[0].elements["submit"].click();
return;
}
phantom.exit()
});
The code i want run on the page that comes after it is
console.log(window.frames[1].document.getElementById('status').innerHTML)
So the only question remaining is how to handle the redirect and launch the script on the other page.
Thanks,
You need to setup a new callback for the page load:
page.onLoadFinished = function(status){
console.log(window.frames[1].document.getElementById('status').innerHTML)
}
this should come right before triggering .click().