How do I load an mbox content without inserting into the dom - javascript

I'm trying to interface with Adobe Test & Target because I want to load JSON rather than markup through my mbox. I want to load some mbox content into javascript and manually add it to the DOM. I have searched all over for full documentation of the mbox.js but I can't find anything other than the very basics. It describes how to use mboxDefine() and mboxUpdate to target a specific dom element. Is there a function that just returns the content?
```

T&T does not offer a function to assign the response to a javascript variable. Basically the way it works is mbox.js builds a url to their server and then then outputs a script include tag. This is done to get around the same origin policy limitations (cross-site scripting).
In order to handle whatever is in the html offer, they put it in their own javascript variable on their server and then output it as that as the response. However, they also have the response output the code that updates the target element. So there's nothing you can do to actually stop them from updating the target element with the html offer contents. They simply don't expose that.
However, you don't have to put html in an html offer. You can put json (javascript) in an html offer. Just do like
html offer 'myJsonMbox' (in interface)
<script type='text/javascript'>
var myJsonString = "[json string]";
</script>
Then on your page (inside your body tag, but before your code that wants to use it) you'd have the regular mbox code:
<div class='mboxDefault'></div>
<script type='test/javascript'>
mboxCreate('myJsonMbox');
</script>
And then somewhere after that, where you're wanting to do something with it, that myJsonString is there for you to reference. Or, you can do it with the mboxDefine and mboxUpdate sometime after page load, if you prefer.
Is there some particular reason why you don't think this will work for you?

You can:
a- Insert JS code you are going to use to manually manipulate the DOM
b- Insert CSS code you can use to alter the original HTMl or the newly added HTML.
c- Insert a call to a 3rd party script that will load content from a 3rd party server if needed, or the same server.

Related

Place content (or ads) between HTML that is returned from a php server?

I am using laravel, vuejs.
Its a simple question. But i need to know if it works before creating it. So what i am currently doing is
I have a WYSIWYG editor. I am saving the content from it into a html file and i am storing the location to that html file as a reference in my database
When the user requests a page, I am retrieving that html file and send the content to the page and place the content in the page.
Now to the question, I need to place adsense code between some contents in the html piece(returned from the server). The html is a whole content returned from the php server. Right?
So how can i place adsense code between each paragraph or so after the content is returned from server?
You should really consider storing content in a DB. But if you really need to store HTML in files for some reason, you can use HTML tags like !adsense! in your editor. Then just read HTML from a file and use str_replace or similar function to replace this tag with actual ad code.
As Alexey said, you may consider storing the content on the DB.
Also, you could consider actually using markdown instead of HTML, you could still use the WYSIWYG, but is easier to pre process it and easy to convert to HTML.
That being said, I second that the best option is to either use "key" to be replaced after, but that would mean giving the control to the person who edits if he wants to add the ad or not.
I would actually think you should pre process that HTML, there are some libraries to pre process it or you could use a regular expression, but, bottom line, you read the HTML before you output it, and find out what is a paragraph (depends on how your WYSIWYG is formatting things, this is why I prefer markdown), for example, you could split it in paragraphs based on the P tags or something like that, and then re assemble that, but adding the ad every X paragraphs, that way you can control how and when you put the ad, instead of the person who edits it.
To pre process the HTML you could use something like one of the following options:
Symphony DOM Crawler (recomended): http://symfony.com/doc/current/components/dom_crawler.html
PHP DOM Functions: http://php.net/manual/en/book.dom.php
A PHP HTML Parser Library: https://github.com/paquettg/php-html-parser
Or something similar.

forbid javascript in html file

Following problem:
I've given a file with HTML inside but also maybe some script code.
Now I want to edit the file so that no script gets executed when opening the file with a browser.
My question is: What do I have to do?
Which possibilities are there to place a script inside HTML to let it get executed? I know there is the script tag, you could also do it with an iframe but what else is possible?
I definitely want to prevent any kind of script execution. How can I achieve this?
Have a look at an established, well tested HTML filter library such as http://htmlpurifier.org/ which uses a whitelist to filter possibly malicious code. Don't rely on the filtered HTML documents being secure from any javascript though, time and time again browsers are updated and new ways to sneak in javascript are discovered.

Why doesn't embedded JavaScript execute when inserted in response to an ajax call?

Inserting JavaScript in the .innerHTML does not cause it to run.
I have what I call a mini-feed in which a user submits a post. This initiates an ajax call which saves the user data to the mysql table. From there PHP generates the xhtml. From there the the PHP generated xhtml is sent back to javascript as response text. This xhtml contains embedded javascript used to display "pretty time".
Now if the PHP generatd xhtml/javascript is send to the client in a non-ajax way this works. But when I send it as responseText and then update the DOM using .innerHTML it does not function. Whatever mechanism that picks up javacript with in the XHTML does not seem to like the embedded javascript written into the .innerHTML property of the enclosing div tag.
Is there an easy fix for this? Or do I have to construct the UI with in the javascript with out just inserting it all in as innerHTML...in a previous post someone mentioned that .innerHTML was not good practice. Perhaps this is what they meant.
You're right, innerHTML will not do that, if you want to dynamically create a script tag, you will need to use document.createElement to create a script tag, but that has all of the same wonderful security bonuses associated with eval.
Here's another idea, though. Wouldn't it be better to have some function defined in the main page which, after appending anything new, sets the date to "pretty" mode without needing to have the AJAX response know anything about it?
The following code should work:
function onSuccess() {
src = document.createElement('script');
src.innerHTML = this.responseText;
document.body.appendChild(src);
}
But I would agree with cwallenpoole that why not have all that javascript code (for pretty-fying the date) be already written in advanced in the main page? (or script included or something).

Data attributes and script tags

I have a project I'm working on called Natalie.
What it does, (twitter.com is a good example if you don't understand my explanation) is it uses the hash tag, to load a page via XHR, and then inserts it into the page, so you can have a generic look that doesn't change between pages, that doesn't need PHP or the like.
It has several configuration properties, the main ones being:
A selector to use to find the place you would like to insert the loaded page.
A folder path to use at the document root. (Think Apache configuration)
The page to load if there isn't a hash tag.
I currently have them in an object called Natalie.config but I would like to do something like <script src="Natalie.js" data-natalie-docroot="/Folder"></script>
Is there any way to tell which tag the script is running from, or do you have to search all script tags for these attributes?
I would much rather prevent something like this from happening if possible:
<script src="Natalie.js"></script>
<script data-natalie-docroot="/Folder"></script>
I'd simply put data-natalie-docroot="/Folder" on the <body> tag. The reason being that it is not directly associated to the script itself. Your approach also wouldn't work if someone wanted to load your script using a dynamic script loader.

Javascript redirect to dynamically created HTML

I have a javascript routine that dynamically creates an HTML page, complete with it's own head and script tags.
If I take the contents of the string and save it to a file, and view the file in a browser, all is well, but if I try document.write(newHTML), it doesn't behave the same. The javascript in the header of the dynamic newHTML is quite complicated, and I cannot include it here... But please believe me that it works great if I save it to a file, but not if I try to replace the current page with it using document.write. What possible pitfalls could be contributing to this that I'm not considering? Do I possibly need to delete the existing script tags in the existing header first? Do I need to manually re-call onLoad??
Again, it works great when the string is saved to, for example, 'sample.html' and browsed to, but if I set var Samp="[REAL HTML HERE]"; and then say document.write(Samp); document.close(); the javascript routines are not executing correctly.
Any hints as to what I could be missing?
Is there another/better way to dynamically replace the content of the page, other than document.write?
Could I somehow redirect to the new page despite the fact that doesn't exist on disk or on a server, but is only in a string in memory? I would hate to have to upload the entire file to my server simply to re-download again it to view it.
How can I, using javascript, replace the current content of the current page with entirely new content including complex client-side javascripting, dynamically, and always get exactly the same result as if I saved the string to the server as an html file and redirected to it?
How can I 'redirect' to an HTML file that only exists as a client-side string?
You can do this:
var win=window.open("") //open new window and write to it
var html = generate_html();
win.document.write(html)
win.document.close();
Maybe eval() function would help here? It's hard to give ansver without seeing the code.
Never tried this, but i think it should be possible. Some thoughts on what might make it work:
Make sure the document containing your js is sent with the correct headers / mimetype / doctype
Serve the javascript in a valid way, for example by sending a w3c valid page containing the script tag.
Maybe then it works. If not, try to erase the current html before writing the new one.
Also, it might be helpful to look how others managed to accomplish this task. If i remind it correctly, the google page is also essentially a short html page with a bunch of js.

Categories